/* KRIyoga blog — megosztott stíluslap a /blog/ index és a poszt oldalak között.
   Ugyanazokat a design tokeneket használja, mint a főoldal (kriyoga-live-index.html). */
:root{
  --ink:#141210;
  --ink-deep:#0a0908;
  --taupe:#6b6255;
  --taupe-deep:#4f483d;
  --tan:#ede7d8;
  --tan-2:#e0d8c4;
  --text:#1c1815;
  --text-soft:#463f36;
  --text-mute:#5a5347;
  --text-faint:#726a5b;
  --text-ghost:#8f8777;
  --on-dark-soft:#e3ddcd;
  --on-dark-mute:#b3ab98;
  --on-dark-ghost:#d3cbb8;
  --line: rgba(28,24,21,0.14);
  --radius: 14px;
  --ease: cubic-bezier(.16,.84,.44,1);
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  font-family:'Work Sans', sans-serif;
  background:var(--tan);
  color:var(--ink);
  line-height:1.6;
  overflow-x:hidden;
}
h1,h2,h3,.serif{font-family:'Cormorant Garamond', serif; font-weight:600; letter-spacing:-0.01em;}
.eyebrow{
  font-family:'Work Sans', sans-serif; text-transform:uppercase; letter-spacing:.16em;
  font-size:.72rem; font-weight:600; color:var(--ink-deep);
}
a{color:inherit; text-decoration:none;}
img{max-width:100%; display:block;}
.wrap{max-width:1180px; margin:0 auto; padding:0 clamp(20px,5vw,64px);}
.wrap-narrow{max-width:760px; margin:0 auto; padding:0 clamp(20px,5vw,64px);}
#scrollSentinel{position:absolute; top:0; height:1px; width:1px;}

/* NAV */
header{
  position:fixed; top:0; left:0; right:0; z-index:100;
  padding:22px 0; transition:background .4s var(--ease), padding .4s var(--ease), backdrop-filter .4s;
  background:rgba(243,244,236,.80);
  backdrop-filter:blur(24px) saturate(1.4);
  -webkit-backdrop-filter:blur(24px) saturate(1.4);
  border-bottom:1px solid rgba(255,255,255,.4);
}
header.scrolled{
  padding:14px 0;
  box-shadow:0 8px 32px -16px rgba(10,9,8,.18);
}
nav{display:flex; align-items:center; justify-content:space-between;}
.logo{font-family:'Cormorant Garamond', serif; font-size:1.5rem; font-weight:700; letter-spacing:.01em; color:var(--ink); display:inline-flex; align-items:center; gap:9px;}
.logo-icon{width:30px; height:30px; border-radius:6px; object-fit:cover; display:block;}
.nav-links{display:flex; gap:2.2rem; align-items:center;}
.nav-links a{font-size:.92rem; position:relative; padding-bottom:4px;}
.login-badge{position:relative; display:inline-flex; align-items:center; gap:7px; color:var(--ink); margin-left:18px; cursor:pointer; -webkit-tap-highlight-color:transparent;}
.login-badge-avatar{width:26px; height:26px; border-radius:50%; background:var(--ink); color:var(--tan); display:flex; align-items:center; justify-content:center; font-family:'Cormorant Garamond', serif; font-weight:600; font-size:.82rem; flex-shrink:0; transition:background .2s var(--ease), color .2s var(--ease);}
.login-badge-avatar.is-guest{background:#fff; color:var(--taupe); border:1.5px solid var(--line);}
.login-badge-avatar svg{width:14px; height:14px; fill:currentColor;}
.login-badge-name{font-size:.82rem; max-width:120px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
@media (max-width:480px){ .login-badge-name{display:none;} .login-badge{margin-left:10px;} }
.login-menu{
  position:absolute; top:calc(100% + 12px); right:0; background:#fff; border:1px solid var(--line);
  border-radius:12px; box-shadow:0 20px 44px -20px rgba(10,9,8,.32); min-width:180px; padding:6px;
  display:none; flex-direction:column; z-index:80;
}
.login-menu.is-open{display:flex;}
.login-menu a{display:block; padding:10px 13px; border-radius:8px; font-size:.86rem; color:var(--ink); text-decoration:none; white-space:nowrap;}
.login-menu a:hover{background:var(--tan-2);}
.login-menu a.danger{color:#a04a24;}
.nav-links a:not(.btn)::after{
  content:''; position:absolute; left:0; bottom:0; width:0; height:1px; background:var(--ink);
  transition:width .3s var(--ease);
}
.nav-links a:not(.btn):hover::after{width:100%;}
.lang-switch{font-size:.8rem; font-weight:600; letter-spacing:.04em; opacity:.7;}
.lang-switch:hover{opacity:1;}
.btn{
  display:inline-flex; align-items:center; gap:8px;
  background:var(--taupe); color:var(--tan); padding:11px 22px;
  font-size:.86rem; font-weight:500; border:1px solid var(--taupe);
  border-radius:var(--radius); cursor:pointer; transition:all .3s var(--ease);
}
.btn:hover{background:var(--taupe-deep); transform:translateY(-1px);}
.btn-outline{background:transparent; color:var(--ink); border:1px solid var(--ink);}
.btn-outline:hover{background:var(--ink); color:var(--tan);}
.btn-clay{background:var(--ink); border-color:var(--ink);}
.btn-clay:hover{background:var(--ink-deep);}
.menu-toggle{display:none; background:none; border:none; font-size:1.4rem; cursor:pointer;}

@media (max-width:900px){
  .nav-links{position:fixed; top:0; right:0; height:100vh; width:78vw; max-width:320px;
    background:rgba(243,244,236,.85);
    backdrop-filter:blur(28px) saturate(1.3);
    -webkit-backdrop-filter:blur(28px) saturate(1.3);
    border-left:1px solid rgba(255,255,255,.4);
    flex-direction:column; align-items:flex-start; padding:100px 30px; gap:1.8rem; transform:translateX(100%);
    transition:transform .4s var(--ease); box-shadow:-10px 0 40px rgba(0,0,0,.15);}
  .nav-links.open{transform:translateX(0);}
  .menu-toggle{display:block;}
}

/* SECTION SHARED */
.page-head{padding:150px 0 60px;}
section{padding:100px 0;}
.section-head{max-width:640px; margin-bottom:56px;}
.section-head h2{font-size:clamp(2.1rem,3.4vw,3rem); margin-top:14px; font-weight:600; line-height:1.14;}
.reveal{opacity:0; transform:translateY(32px) scale(.986); transition:opacity 1.3s var(--ease), transform 1.3s var(--ease);}
.reveal.in{opacity:1; transform:none;}
.breath-line{
  font-family:'Cormorant Garamond',serif; font-style:italic; font-weight:600;
  font-size:clamp(1.1rem,2vw,1.4rem); line-height:1.2; color:var(--taupe-deep);
  max-width:34ch; margin:0 0 14px; opacity:.95;
}
.breath-divider{display:flex; justify-content:center; padding:0 0 24px; color:var(--ink); opacity:.65;}
.breath-divider svg{width:104px; height:22px; display:block;}

/* BLOG INDEX */
.blog-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:24px;}
.blog-card{
  background:#fff; border-radius:20px; padding:30px 26px; display:flex; flex-direction:column; gap:14px;
  box-shadow:0 2px 10px -4px rgba(10,9,8,.08);
  transition:transform .35s var(--ease), box-shadow .35s var(--ease);
}
.blog-card:hover{transform:translateY(-5px); box-shadow:0 26px 46px -22px rgba(10,9,8,.28);}
.blog-card h3{font-size:1.3rem; line-height:1.24;}
.blog-card p{font-size:.92rem; color:var(--text-mute); font-weight:300; flex-grow:1;}
.blog-card .read-more{font-size:.85rem; font-weight:500; color:var(--ink); border-bottom:1px solid var(--ink); align-self:flex-start; padding-bottom:2px;}
@media (max-width:900px){ .blog-grid{grid-template-columns:1fr 1fr;} }
@media (max-width:640px){ .blog-grid{grid-template-columns:1fr;} }

/* BLOG POST */
.article-eyebrow{margin-bottom:16px;}
.article h1{font-size:clamp(2rem,4.2vw,3rem); line-height:1.16; margin-bottom:34px;}
.article .body-text{font-size:1.06rem; font-weight:300; color:var(--text-soft); max-width:68ch; margin-bottom:22px;}
/* Két visszalink is lehet egy oldalon (pl. egy blogposztnál "Főoldal" ÉS
   "Vissza a bloghoz") — Levi kérésére minden kis aloldalról legyen egyértelmű
   visszaút a főoldalra is, nem csak a szülő-listaoldalra. */
.back-links{display:flex; flex-wrap:wrap; gap:18px; margin-bottom:28px;}
.back-links .back-link{margin-bottom:0;}
.back-link{display:inline-block; margin-bottom:28px; font-size:.85rem; color:var(--text-faint); border-bottom:1px solid var(--line); padding-bottom:2px;}
.back-link:hover{color:var(--ink); border-color:var(--ink);}
.article-cta{
  margin-top:56px; background:var(--ink); color:var(--tan); border-radius:22px; padding:40px clamp(26px,4vw,50px);
  text-align:center;
}
.article-cta p{font-family:'Cormorant Garamond',serif; font-weight:600; font-size:1.4rem; margin-bottom:22px; color:var(--tan);}
.article-cta .btn{background:var(--tan); color:var(--ink); border-color:var(--tan);}
.article-cta .btn:hover{background:#fff; border-color:#fff;}

/* CTA BAND (share with homepage) */
.cta-band{background:var(--ink); color:var(--tan); text-align:center; position:relative; overflow:hidden;}
.cta-band h2{font-size:clamp(2.1rem,4vw,3.4rem); max-width:680px; margin:0 auto 30px; line-height:1.16;}
.cta-band .btn{background:var(--tan); color:var(--ink); border-color:var(--tan);}
.cta-band .btn:hover{background:var(--ink-deep); border-color:var(--ink-deep); color:var(--tan);}
.breath-line.on-dark{color:var(--on-dark-soft);}
.breath-line.centered{text-align:center; margin:0 auto 18px;}

/* FOOTER */
footer{background:var(--ink); color:var(--on-dark-mute); padding:80px 0 30px; font-size:.88rem;}
.footer-grid{display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:40px; padding-bottom:50px; border-bottom:1px solid rgba(243,244,236,.1);}
.footer-logo{width:56px; height:56px; margin-bottom:14px; border-radius:6px;}
footer h4{color:var(--tan); font-family:'Cormorant Garamond',serif; font-weight:600; margin-bottom:18px; font-size:1.15rem;}
footer ul{list-style:none;}
footer li{margin-bottom:10px;}
footer a:hover{color:var(--tan);}
.social-row{display:flex; gap:10px; margin-bottom:20px; flex-wrap:wrap;}
.social-icon{
  width:40px; height:40px; border-radius:50%; border:1px solid rgba(243,244,236,.18);
  display:flex; align-items:center; justify-content:center; color:var(--on-dark-mute);
  transition:all .3s var(--ease); flex-shrink:0;
}
.social-icon svg{width:17px; height:17px; fill:currentColor; transition:transform .3s var(--ease);}
.social-icon:hover{background:var(--tan); border-color:var(--tan); color:var(--ink); transform:translateY(-2px);}
.social-icon:hover svg{transform:scale(1.08);}
.footer-contact-text{font-size:.85rem;}
.footer-contact-text a{display:block; margin-bottom:6px;}
.footer-bottom{display:flex; justify-content:space-between; padding-top:26px; flex-wrap:wrap; gap:12px; font-size:.78rem;}

@media (max-width:900px){
  .footer-grid{grid-template-columns:1fr 1fr;}
}
@media (max-width:520px){
  .footer-grid{grid-template-columns:1fr;}
  section{padding:70px 0;}
  .page-head{padding:120px 0 40px;}
}
