/*
Theme Name: Shivalay Blog
Template: twentytwentyfive
Author: Bitnet Infotech
Description: Custom glassmorphism blog child theme for SHIVALAY — charcoal ground, ivory type, gold accent.
Version: 1.0.0
*/

:root{
  --bg:#0b0a09;
  --surface:#151210;
  --ink:#f4ede0;
  --ink-muted:rgba(244,237,224,0.6);
  --accent:#b98d4a;
  --support:#5c3d1a;
  --border:rgba(244,237,224,0.12);
  --border-strong:rgba(244,237,224,0.16);

  --radius-sm:8px;
  --radius-md:16px;
  --radius-lg:30px;
  --radius-pill:999px;

  --space-sm:8px;
  --space-md:16px;
  --space-lg:32px;
  --space-xl:64px;

  --font-display:'Cormorant Garamond', serif;
  --font-title:'Marcellus', serif;
  --font-body:'Inter', sans-serif;
  --font-deva:'Noto Sans Devanagari', sans-serif;

  --container:1200px;
}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:var(--font-body);
  font-weight:400;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
body::before{
  content:'';
  position:fixed; inset:0;
  background:
    radial-gradient(60% 40% at 50% 0%, rgba(185,141,74,0.10), transparent 70%),
    linear-gradient(180deg, var(--bg) 0%, var(--bg) 100%);
  pointer-events:none;
  z-index:0;
}
img{max-width:100%; display:block;}
a{color:var(--accent); text-decoration:none;}
a:hover{color:var(--ink);}
.container{max-width:var(--container); margin:0 auto; padding:0 24px;}

/* ---------- Glass primitives ---------- */
.glass{
  background:rgba(244,237,224,0.06);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  border:1px solid var(--border);
  box-shadow:0 8px 32px rgba(0,0,0,0.35);
  border-radius:var(--radius-lg);
}
.glass-pill{
  display:inline-flex; align-items:center; gap:6px;
  background:rgba(244,237,224,0.08);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  border:1px solid var(--border-strong);
  border-radius:var(--radius-pill);
  padding:10px 20px;
  color:var(--ink);
  font-size:13px;
  font-family:var(--font-body);
  transition:border-color .25s ease, color .25s ease, transform .25s ease;
}
.glass-pill:hover{border-color:rgba(185,141,74,0.5); color:var(--accent); transform:translateY(-1px);}
.eyebrow{
  font-family:var(--font-body);
  font-size:11px;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--accent);
  font-weight:600;
}

/* ---------- Header / nav ---------- */
.site-header{position:relative; z-index:10; padding:28px 0;}
.site-header .container{display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap;}
.brand{display:flex; align-items:center; gap:12px; text-decoration:none;}
.brand-mark{
  font-family:var(--font-display);
  font-size:22px; letter-spacing:0.12em; text-transform:uppercase;
  color:var(--ink); font-weight:600;
}
.brand-mark:hover{color:var(--ink);}
.brand-badge{
  font-size:10px; letter-spacing:0.1em; text-transform:uppercase;
  padding:4px 12px; color:var(--accent); font-weight:600;
}
.primary-nav{display:flex; align-items:center; gap:28px;}
.primary-nav ul{list-style:none; display:flex; gap:28px; margin:0; padding:0;}
.primary-nav a{
  color:var(--ink-muted); font-size:14px; font-weight:500;
  transition:color .2s ease;
}
.primary-nav a:hover{color:var(--accent);}
.nav-toggle{
  display:none;
  align-items:center; justify-content:center;
  width:40px; height:40px;
  background:rgba(244,237,224,0.08);
  border:1px solid var(--border-strong);
  border-radius:var(--radius-pill);
  color:var(--ink);
  cursor:pointer;
  transition:border-color .2s ease, color .2s ease;
}
.nav-toggle:hover{border-color:var(--accent); color:var(--accent);}

@media (max-width:820px){
  .primary-nav{
    display:none;
    position:absolute; top:100%; left:24px; right:24px;
    margin-top:12px; padding:20px;
    background:rgba(11,10,9,0.92);
    backdrop-filter:blur(18px);
    border:1px solid var(--border-strong);
    border-radius:var(--radius-md);
    box-shadow:0 8px 32px rgba(0,0,0,0.4);
  }
  .primary-nav.is-open{display:block;}
  .primary-nav ul{flex-direction:column; gap:16px;}
  .nav-toggle{display:inline-flex;}
}

/* ---------- Hero ---------- */
.blog-hero{padding:56px 0 72px; position:relative; z-index:1;}
.blog-hero .container{max-width:var(--container); text-align:center;}
.blog-hero h1{
  font-family:var(--font-display);
  font-weight:600;
  color:var(--ink);
  font-size:clamp(38px,5vw,60px);
  line-height:1.08;
  letter-spacing:0.01em;
  margin:14px 0 18px;
}
.blog-hero p{
  color:var(--ink-muted);
  font-weight:300;
  font-size:17px;
  max-width:100%;
  margin:0;
}

/* ---------- Posts grid ---------- */
.posts-section{padding:0 0 80px; position:relative; z-index:1;}
.posts-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:28px;
}
@media (max-width:980px){.posts-grid{grid-template-columns:repeat(2,1fr);}}
@media (max-width:680px){.posts-grid{grid-template-columns:1fr;}}

.post-card{
  overflow:hidden;
  display:flex; flex-direction:column;
  transition:transform .35s ease, border-color .35s ease, box-shadow .35s ease;
}
.post-card:hover{
  transform:translateY(-4px);
  border-color:rgba(185,141,74,0.3);
  box-shadow:0 8px 40px rgba(185,141,74,0.12), 0 8px 32px rgba(0,0,0,0.35);
}
.post-card-media{aspect-ratio:16/10; overflow:hidden; border-radius:var(--radius-lg) var(--radius-lg) 0 0;}
.post-card-media img{width:100%; height:100%; object-fit:cover; transition:transform .5s ease;}
.post-card-media--placeholder{
  background:
    radial-gradient(60% 60% at 50% 50%, rgba(185,141,74,0.16), transparent 70%),
    linear-gradient(135deg, var(--surface) 0%, var(--bg) 55%, var(--support) 100%);
  position:relative;
}
.post-card-media--placeholder::after{
  content:'';
  position:absolute; inset:22%;
  border:1px solid rgba(185,141,74,0.4);
  border-radius:50%;
}
.post-card:hover .post-card-media img{transform:scale(1.06);}
.post-card-body{padding:26px 26px 28px; display:flex; flex-direction:column; gap:12px; flex:1;}
.post-meta{
  font-size:11px; letter-spacing:0.08em; text-transform:uppercase;
  color:var(--accent); font-weight:600;
}
.post-meta .dot{color:var(--border-strong); margin:0 6px;}
.post-card h2{
  font-family:var(--font-title); font-weight:400;
  font-size:22px; line-height:1.3; color:var(--ink); margin:0;
}
.post-card p{color:var(--ink-muted); font-size:14px; font-weight:300; line-height:1.6; margin:0; flex:1;}
.read-more{
  display:inline-flex; align-items:center; gap:6px;
  color:var(--accent); font-size:13px; font-weight:600;
  letter-spacing:0.02em; margin-top:4px;
}
.read-more svg{transition:transform .25s ease;}
.post-card:hover .read-more svg{transform:translateX(4px);}

/* ---------- Pagination ---------- */
.blog-pagination{display:flex; justify-content:center; gap:8px; margin-top:56px; flex-wrap:wrap;}
.blog-pagination a, .blog-pagination span{
  min-width:40px; height:40px; padding:0 14px;
  display:inline-flex; align-items:center; justify-content:center;
  background:rgba(244,237,224,0.08);
  backdrop-filter:blur(14px);
  border:1px solid var(--border-strong);
  border-radius:var(--radius-pill);
  color:var(--ink-muted); font-size:14px;
  transition:border-color .2s ease, color .2s ease;
}
.blog-pagination a:hover{border-color:var(--accent); color:var(--accent);}
.blog-pagination .current{color:var(--accent); border-color:var(--accent);}

/* ---------- Single post ---------- */
.post-breadcrumb{padding:36px 0 0; position:relative; z-index:1;}
.post-breadcrumb a{
  display:inline-flex; align-items:center; gap:8px;
  font-size:12px; letter-spacing:0.08em; text-transform:uppercase;
  color:var(--accent); font-weight:600;
}

.post-header{padding:24px 0 36px; position:relative; z-index:1;}
.post-header-meta{
  font-size:12px; letter-spacing:0.06em; text-transform:uppercase;
  color:var(--accent); font-weight:600; margin-bottom:16px;
}
.post-header-meta .dot{color:var(--border-strong); margin:0 8px;}
.post-header h1{
  font-family:var(--font-title); font-weight:400; color:var(--ink);
  font-size:clamp(30px,4.6vw,54px); line-height:1.15; margin:0;
}

.post-banner{padding:0 0 48px; position:relative; z-index:1;}
.post-banner-media{aspect-ratio:21/9; border-radius:var(--radius-lg); overflow:hidden; box-shadow:0 8px 32px rgba(0,0,0,0.35);}
.post-banner-media img{width:100%; height:100%; object-fit:cover;}

.post-body{padding:0 0 96px; position:relative; z-index:1;}
.post-body .container{max-width:1200px;}

.post-layout{max-width:1200px; display:grid; grid-template-columns:1fr 340px; gap:44px; align-items:start;}
@media (max-width:960px){
  .post-align,
  .post-layout{grid-template-columns:1fr;}
}
.post-main{min-width:0;}

.post-reading{margin-bottom:40px;}
.post-reading .glass{padding:48px;}
@media (max-width:680px){.post-reading .glass{padding:32px 24px;}}

.post-content{font-family:var(--font-body); font-weight:300; color:rgba(244,237,224,0.85); line-height:1.75; font-size:17px; max-width:68ch;}
.post-content p{margin:0 0 22px;}
.post-content h2,.post-content h3{
  font-family:var(--font-display); font-weight:600; color:var(--ink);
  line-height:1.15; margin:40px 0 16px;
  padding-bottom:10px; border-bottom:2px solid var(--accent); display:inline-block;
}
.post-content h2{font-size:32px;} .post-content h3{font-size:24px;}
.post-content blockquote{
  border-left:3px solid var(--accent);
  margin:32px 0; padding:6px 0 6px 24px;
  font-family:var(--font-display); font-style:italic; font-size:21px; color:var(--ink);
}

/* Sanskrit / mantra blocks: centered devotional treatment, own glass panel, glow on hover. */
.post-content blockquote[lang="sa"]{
  font-family:var(--font-deva);
  font-style:normal;
  font-size:clamp(20px,2.4vw,26px);
  line-height:2.05;
  letter-spacing:0.01em;
  text-align:center;
  color:var(--accent);
  border-left:none;
  padding:36px 32px;
  margin:40px 0;
  border-radius:var(--radius-lg);
  background:
    radial-gradient(70% 90% at 50% 0%, rgba(185,141,74,0.10), transparent 70%),
    rgba(244,237,224,0.05);
  border:1px solid rgba(185,141,74,0.25);
  box-shadow:0 8px 32px rgba(0,0,0,0.3);
  transition:border-color .4s ease, box-shadow .4s ease;
}
.post-content blockquote[lang="sa"]:hover{
  border-color:rgba(185,141,74,0.5);
  box-shadow:0 8px 40px rgba(185,141,74,0.16), 0 8px 32px rgba(0,0,0,0.3);
}

.post-content a{text-decoration:underline; text-underline-offset:3px;}
.post-content img{border-radius:var(--radius-md); margin:24px 0;}
.post-content ul,.post-content ol{padding-left:22px; margin:0 0 22px;}
.post-content li{margin-bottom:8px;}
.post-content li::marker{color:var(--accent);}

.post-cta-wrap{text-align:center; margin:44px 0 8px;}
.post-cta{
  text-decoration:none;
  font-weight:600; font-size:14px; letter-spacing:0.02em;
  padding:14px 34px;
  color:var(--ink);
}
.post-cta:hover{color:var(--bg); background:var(--accent); border-color:var(--accent);}

.post-nav{display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-bottom:40px;}
@media (max-width:680px){.post-nav{grid-template-columns:1fr;}}
.post-nav-link{padding:22px 26px; display:block;}
.post-nav-link.next{text-align:right;}
.post-nav-label{font-size:11px; letter-spacing:0.08em; text-transform:uppercase; color:var(--accent); font-weight:600; margin-bottom:8px;}
.post-nav-title{font-family:var(--font-title); font-weight:400; font-size:18px; color:var(--ink);}

/* ---------- Comments ---------- */
.comments-section .glass{padding:40px;}
@media (max-width:680px){.comments-section .glass{padding:28px 22px;}}

/* ---------- Sidebar ---------- */
.post-sidebar{display:flex; flex-direction:column; gap:24px; position:sticky; top:24px;}
.sidebar-card{padding:28px;}
.sidebar-about p{color:var(--ink-muted); font-size:14px; font-weight:300; line-height:1.6; margin:12px 0 20px;}
.sidebar-cta{width:100%; justify-content:center; text-align:center; font-size:13px; padding:12px 20px;}
.sidebar-title{font-family:var(--font-display); font-size:20px; font-weight:600; color:var(--ink); margin:0 0 16px;}

.sidebar-list{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:12px;}
.sidebar-list li{display:flex; justify-content:space-between; align-items:center; border-bottom:1px solid var(--border); padding-bottom:12px;}
.sidebar-list li:last-child{border-bottom:none; padding-bottom:0;}
.sidebar-list a{color:var(--ink-muted); font-size:14px; transition:color .2s ease;}
.sidebar-list a:hover{color:var(--accent);}
.sidebar-count{font-size:11px; color:var(--accent); background:rgba(185,141,74,0.12); padding:2px 9px; border-radius:var(--radius-pill);}

.sidebar-recent{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:16px;}
.sidebar-recent a{display:flex; gap:12px; align-items:center;}
.sidebar-recent-media{width:60px; height:60px; border-radius:var(--radius-sm); overflow:hidden; flex-shrink:0; display:block;}
.sidebar-recent-media img{width:100%; height:100%; object-fit:cover;}
.sidebar-recent-media--placeholder{
  background:
    radial-gradient(60% 60% at 50% 50%, rgba(185,141,74,0.18), transparent 70%),
    linear-gradient(135deg, var(--surface) 0%, var(--bg) 55%, var(--support) 100%);
  position:relative;
}
.sidebar-recent-media--placeholder::after{
  content:'';
  position:absolute; inset:28%;
  border:1px solid rgba(185,141,74,0.4);
  border-radius:50%;
}
.sidebar-recent-body{display:flex; flex-direction:column; gap:4px; min-width:0;}
.sidebar-recent-title{
  font-family:var(--font-title); font-weight:400;
  font-size:14px; color:var(--ink); line-height:1.35;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
  transition:color .2s ease;
}
.sidebar-recent a:hover .sidebar-recent-title{color:var(--accent);}
.sidebar-recent-date{font-size:11px; color:var(--ink-muted); text-transform:uppercase; letter-spacing:0.05em;}

.sidebar-mantra{text-align:center; padding:32px 24px;}
.sidebar-om{font-family:var(--font-deva); font-size:38px; color:var(--accent); display:block; margin-bottom:10px;}
.sidebar-mantra-text{font-family:var(--font-deva); font-size:16px; color:var(--ink); line-height:1.8; margin:0;}

@media (max-width:960px){.post-sidebar{position:static;}}
.comments-title{font-family:var(--font-display); font-size:26px; color:var(--ink); margin:0 0 24px;}
.comment-list{list-style:none; margin:0 0 32px; padding:0; display:flex; flex-direction:column; gap:20px;}
.comment-list .comment-body{border-top:1px solid var(--border); padding-top:16px;}
.comment-author{font-size:14px; color:var(--ink); font-weight:600;}
.comment-meta{font-size:12px; color:var(--ink-muted);}
.comment-form p{margin:0 0 18px;}
.comment-form label{display:block; font-size:12px; letter-spacing:0.05em; text-transform:uppercase; color:var(--accent); margin-bottom:8px;}
.comment-form input[type=text],
.comment-form input[type=email],
.comment-form input[type=url],
.comment-form textarea{
  width:100%; background:rgba(244,237,224,0.05); color:var(--ink);
  border:1px solid var(--border); border-radius:var(--radius-sm);
  padding:12px 16px; font-family:var(--font-body); font-size:14px;
  transition:border-color .2s ease, background .2s ease;
}
.comment-form textarea{min-height:140px; resize:vertical;}
.comment-form input:focus,.comment-form textarea:focus{
  outline:none; border-color:var(--accent); background:rgba(244,237,224,0.08);
}
.comment-form .form-submit input{
  width:auto; cursor:pointer; background:rgba(244,237,224,0.08);
  border:1px solid var(--border-strong); border-radius:var(--radius-pill);
  padding:12px 28px; font-weight:600;
}
.comment-form .form-submit input:hover{border-color:var(--accent); color:var(--accent);}

/* ---------- Footer ---------- */
.site-footer{padding:40px 0; border-top:1px solid var(--border); position:relative; z-index:1;}
.site-footer .container{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px;}
.site-footer p{color:var(--ink-muted); font-size:13px; margin:0;}

/* ---------- Reveal (gated by prefers-reduced-motion) ---------- */
.reveal{opacity:0; transform:translateY(14px); transition:opacity .6s ease, transform .6s ease;}
html.js .reveal.is-visible{opacity:1; transform:translateY(0);}
html:not(.js) .reveal{opacity:1; transform:none;}
@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1 !important; transform:none !important; transition:none !important;}
  .post-card,.post-card-media img,.read-more svg,.glass-pill{transition:none !important;}
}
.lang-switcher { position: relative; }
.lang-switcher-toggle {
	display: inline-flex; align-items: center; gap: 8px;
	font-family: var(--font-body);
	font-size: 13px; font-weight: 500;
	padding: 8px 16px;
	border-radius: var(--radius-pill);
	border: 1px solid var(--border-strong);
	background: rgba(244,237,224,0.08);
	backdrop-filter: blur(14px);
	-webkit-backdrop-filter: blur(14px);
	color: var(--ink);
	cursor: pointer;
	transition: border-color .2s ease, color .2s ease;
}
.lang-switcher-toggle:hover { border-color: var(--accent); color: var(--accent); }
.lang-switcher-toggle svg { transition: transform .2s ease; flex-shrink: 0; }
.lang-switcher.is-open .lang-switcher-toggle svg { transform: rotate(180deg); }

.lang-switcher-menu {
	list-style: none; margin: 0; padding: 8px;
	position: absolute; top: calc(100% + 8px); right: 0;
	min-width: 140px;
	background: rgba(11,10,9,0.92);
	backdrop-filter: blur(18px);
	-webkit-backdrop-filter: blur(18px);
	border: 1px solid var(--border-strong);
	border-radius: var(--radius-md);
	box-shadow: 0 8px 32px rgba(0,0,0,0.4);
	opacity: 0; visibility: hidden; transform: translateY(-6px);
	transition: opacity .2s ease, transform .2s ease, visibility .2s;
	z-index: 20;
}
.lang-switcher.is-open .lang-switcher-menu {
	opacity: 1; visibility: visible; transform: translateY(0);
}
.lang-switcher-menu li { margin: 0; }
.lang-switcher-menu a {
	display: block; padding: 8px 12px; border-radius: var(--radius-sm);
	color: var(--ink-muted); font-size: 13px;
	transition: background .15s ease, color .15s ease;
}
.lang-switcher-menu a:hover { background: rgba(244,237,224,0.08); color: var(--accent); }