/*
Theme Name: Oana Monica Nae
Theme URI: https://oanamonicanae.ro/
Author: construita pentru Oana Monica Nae
Description: Tema personala: jurnal literar, poezii, podcasturi, fotografii. Tot textul se editeaza din panou.
Version: 1.9.11
Requires at least: 6.0
Requires PHP: 7.4
License: GPL-2.0-or-later
Text Domain: oana
*/


:root{
  --ink:#2a1440; --ink2:#5d4d6e; --ink3:#8b7d99;
  --paper:#fdfaf6; --paper2:#f6f0ea; --line:#e9e0e6;
  --violet:#8a63ab; --rose:#c9788f; --gold:#c9982f;
  --blue:#4a86b4; --green:#5a9c85; --coral:#df7a4c;
  --shadow:0 10px 30px -14px rgba(42,20,64,.28);
  --shadow-lg:0 26px 60px -28px rgba(42,20,64,.42);
  --r:22px;
  --fd:"Marcellus",Georgia,serif;
  --fb:"Quicksand",system-ui,sans-serif;
  --fv:normal; --fw:400;
  --ds:1.04; --bs:1;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; background:var(--paper); color:var(--ink);
  font-family:var(--fb); font-size:calc(var(--bs)*17px); line-height:1.72;
  font-weight:400; -webkit-font-smoothing:antialiased;
}
body::before{
  content:""; position:fixed; inset:0; z-index:-1; pointer-events:none;
  background:
    radial-gradient(58vw 52vw at 8% -6%, rgba(160,120,200,.20), transparent 62%),
    radial-gradient(50vw 46vw at 96% 4%, rgba(224,150,110,.16), transparent 60%),
    radial-gradient(62vw 58vw at 50% 108%, rgba(120,160,200,.17), transparent 62%),
    radial-gradient(40vw 40vw at 88% 62%, rgba(214,170,60,.10), transparent 62%);
}
h1,h2,h3,h4{font-family:var(--fd); font-weight:var(--fw); line-height:1.14;
  letter-spacing:-.012em; margin:0;
  font-variation-settings:var(--fv);}
a{color:inherit}
/* height:auto pentru ca WordPress pune width/height pe imagini */
img{max-width:100%; height:auto; display:block}
button{font:inherit; color:inherit; border:0; background:none; cursor:pointer}
.wrap{width:min(1180px,92vw); margin-inline:auto}
.narrow{width:min(760px,92vw); margin-inline:auto}
.wide{width:min(1420px,94vw); margin-inline:auto}

/* ---------- header ---------- */
header.site{
  position:sticky; top:0; z-index:60; padding:14px 0;
  background:rgba(253,250,246,.78); backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(233,224,230,.8);
}
.bar{display:flex; align-items:center; gap:22px; justify-content:space-between}
.brand img{height:38px; width:auto}
nav.main{display:flex; gap:4px; flex-wrap:wrap}
nav.main a{
  text-decoration:none; font-size:15px; font-weight:600; color:var(--ink2);
  padding:9px 15px; border-radius:999px; transition:.22s; white-space:nowrap;
}
nav.main a:hover{background:rgba(138,99,171,.10); color:var(--ink)}
nav.main a.on{background:var(--ink); color:#fff8f2}
.burger{display:none; font-size:22px; padding:6px 10px; border-radius:14px}

/* ---------- pages ---------- */
section.page{scroll-margin-top:120px; padding:56px 0 90px; animation:fade .5s ease both}
@keyframes fade{from{opacity:0; transform:translateY(10px)}to{opacity:1;transform:none}}

.eyebrow{font-size:12.5px; letter-spacing:.20em; text-transform:uppercase;
  font-weight:700; color:var(--violet)}
.ph1{font-size:calc(var(--ds)*clamp(36px,5.4vw,58px))}
.hl{animation:hl 2.4s ease}
@keyframes hl{0%,60%{background:rgba(201,152,47,.22)}100%{background:transparent}}
.lead{font-size:19.5px; color:var(--ink2); line-height:1.8}
.psub{font-family:var(--fd); font-size:calc(var(--ds)*21px); line-height:1.5;
  color:var(--ink2); margin:12px 0 0; max-width:760px}

/* ---------- hero ---------- */
.hero{padding:64px 0 18px; text-align:center}
.sr-only{position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden;
  clip:rect(0,0,0,0); white-space:nowrap; border:0}
.hero h1{font-size:calc(var(--ds)*clamp(38px,5.2vw,62px)); font-weight:500;
  font-variation-settings:var(--fv); letter-spacing:.005em}
.hero .credo{max-width:820px; margin:16px auto 0; font-family:var(--fd);
  font-size:calc(var(--ds)*clamp(24px,3vw,33px)); line-height:1.46; color:var(--ink)}
.hero .semn{margin:20px auto 0; font-size:13px; letter-spacing:.16em; text-transform:uppercase;
  color:var(--ink3)}
.hero .sub{max-width:640px; margin:26px auto 0; font-size:calc(var(--ds)*20px); color:var(--ink2);
  font-family:var(--fd); line-height:1.62}
.hero .cta{display:flex; gap:12px; justify-content:center; margin-top:34px; flex-wrap:wrap}
.btn{display:inline-block; text-decoration:none; padding:13px 26px; border-radius:999px;
  font-weight:700; font-size:15px; transition:.22s; border:1.5px solid transparent}
.btn-1{background:var(--ink); color:#fff8f2}
.btn-1:hover{transform:translateY(-2px); box-shadow:var(--shadow)}
.btn-2{border-color:rgba(42,20,64,.18); color:var(--ink)}
.btn-2:hover{background:rgba(138,99,171,.10); border-color:transparent}

/* ---------- section head ---------- */
.shead{display:flex; align-items:flex-end; justify-content:space-between; gap:24px;
  margin:0 0 26px; flex-wrap:wrap}
.shead h2{font-size:calc(var(--ds)*clamp(28px,3.6vw,40px))}
.shead .more{font-size:14.5px; font-weight:700; color:var(--violet); text-decoration:none}
.shead .more:hover{text-decoration:underline}
.sec{margin-top:76px}

/* ---------- cards ---------- */
.grid{display:grid; gap:26px; grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:980px){.grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.grid{grid-template-columns:1fr}}
.card{background:rgba(255,255,255,.72); border:1px solid rgba(255,255,255,.9);
  border-radius:var(--r); overflow:hidden; text-decoration:none; display:flex;
  flex-direction:column; box-shadow:var(--shadow); transition:.28s}
.card:hover{transform:translateY(-5px); box-shadow:var(--shadow-lg)}
.card .ph{overflow:hidden; background:var(--paper2)}
.card .ph img{width:100%; height:auto; display:block; transition:.6s}
.ph-quote{flex:4 1 auto; min-height:190px; position:relative; display:flex; align-items:center;
  padding:26px 30px 30px; overflow:hidden}
.ph-quote q{quotes:none; font-family:var(--fd);
  font-size:calc(var(--ds)*17px); line-height:1.6; color:#3a2450; opacity:.92}
.ph-quote::before{content:"“"; position:absolute; top:-18px; left:16px;
  font-family:var(--fd); font-size:96px; line-height:1; opacity:.16}
.g-violet{background:linear-gradient(145deg,#f1e9f7,#e0d1ee)}
.g-rose{background:linear-gradient(145deg,#fbeaef,#f3d5df)}
.g-gold{background:linear-gradient(145deg,#faf1dc,#f0e2bd)}
.g-blue{background:linear-gradient(145deg,#e6f0f8,#d3e3f0)}
.g-green{background:linear-gradient(145deg,#e6f3ed,#d1e7dc)}
.g-coral{background:linear-gradient(145deg,#fcebe0,#f6d8c5)}
.card:hover .ph img{transform:scale(1.05)}
.card .bd{padding:18px 20px 22px; display:flex; flex-direction:column; gap:9px; flex:1}
.card h3{font-size:calc(var(--ds)*20.5px); line-height:1.26}
.card p{margin:0; font-size:14.6px; color:var(--ink2); line-height:1.66}
.card .dt{font-size:12.5px; color:var(--ink3); font-weight:600; margin-top:auto; padding-top:6px}
.dot-nou{display:inline-block; width:7px; height:7px; border-radius:50%;
  background:var(--coral); vertical-align:middle; margin-left:5px}

.chip{display:inline-block; font-size:11.5px; font-weight:800; letter-spacing:.05em;
  padding:5px 11px; border-radius:999px; text-transform:uppercase; width:fit-content;
  text-decoration:none; transition:.2s}
a.chip:hover{filter:brightness(.94); transform:translateY(-1px)}
.chip-violet{background:rgba(138,99,171,.14); color:#6c4a89}
.chip-rose{background:rgba(201,120,143,.16); color:#a8546c}
.chip-gold{background:rgba(201,152,47,.18); color:#8a6510}
.chip-blue{background:rgba(74,134,180,.16); color:#356a94}
.chip-green{background:rgba(90,156,133,.18); color:#3d7963}
.chip-coral{background:rgba(223,122,76,.16); color:#b7562b}

/* ---------- category cards ---------- */
.cats{display:grid; gap:18px; grid-template-columns:repeat(auto-fit,minmax(232px,1fr))}
.catcard{position:relative; text-decoration:none; border-radius:var(--r); padding:26px 24px 22px;
  min-height:168px; display:flex; flex-direction:column; justify-content:flex-end; gap:6px;
  overflow:hidden; transition:.28s; box-shadow:var(--shadow); border:1px solid rgba(255,255,255,.7)}
.catcard:hover{transform:translateY(-5px); box-shadow:var(--shadow-lg)}
.catcard-n{position:absolute; top:16px; right:22px; font-family:var(--fd);
  font-size:44px; opacity:.30; line-height:1}
.catcard-t{font-family:var(--fd); font-size:calc(var(--ds)*22px); line-height:1.2; font-weight:500}
.catcard-go{font-size:12.5px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; opacity:.62}
.cat-violet{background:linear-gradient(155deg,#efe6f6,#e2d3ee); color:#4a2a63}
.cat-rose{background:linear-gradient(155deg,#fbe9ee,#f4d7e0); color:#7d3a4f}
.cat-gold{background:linear-gradient(155deg,#faf0d9,#f2e2bd); color:#6d5010}
.cat-blue{background:linear-gradient(155deg,#e4eff7,#d3e4f1); color:#25506f}
.cat-green{background:linear-gradient(155deg,#e4f2ec,#d2e8dd); color:#2c5c4a}
.cat-coral{background:linear-gradient(155deg,#fceade,#f7d9c6); color:#8d4322}

/* ---------- filter bar ---------- */
.filters{padding:6px 0 0; margin-bottom:30px; position:relative}
.pills{display:flex; gap:5px; flex-wrap:nowrap; align-items:center;
  overflow-x:auto; scrollbar-width:none; -ms-overflow-style:none;
  scroll-snap-type:x proximity; -webkit-overflow-scrolling:touch}
.pills > *{scroll-snap-align:start}
.pills::-webkit-scrollbar{display:none}
.pill{font-size:12.5px; font-weight:700; padding:8px 11px; border-radius:999px; white-space:nowrap;
  background:rgba(255,255,255,.8); border:1px solid var(--line); color:var(--ink2); transition:.2s}
.pill:hover{border-color:var(--violet); color:var(--ink)}
.pill.on{background:var(--ink); color:#fff8f2; border-color:var(--ink)}
.count{font-size:14px; color:var(--ink3); margin:0 0 20px; font-weight:600}
.loadmore{display:block; margin:44px auto 0}

/* ---------- despre ---------- */
.about{display:grid; gap:46px; grid-template-columns:minmax(0,.82fr) minmax(0,1.35fr); align-items:start}
.about .pic{border-radius:26px; overflow:hidden; box-shadow:var(--shadow-lg)}
@media(min-width:861px) and (min-height:720px){
  .about .pic{position:sticky; top:100px}
}
.prose p{margin:0 0 20px; color:#3d2a4e; font-size:calc(var(--bs)*17px); line-height:1.8}
.prose p:first-of-type{color:var(--ink2)}

/* ---------- poezii ---------- */
.tabs{display:flex; gap:8px; margin:0 0 34px; flex-wrap:wrap}
.poem-chapter{margin-bottom:56px}
.poem-chapter h3{font-size:15px; letter-spacing:.18em; text-transform:uppercase;
  font-family:var(--fb); font-weight:800; color:var(--violet); margin-bottom:20px;
  display:flex; align-items:center; gap:14px}
.poem-chapter h3::after{content:""; flex:1; height:1px; background:var(--line)}
.poem-grid{display:grid; gap:24px; grid-template-columns:repeat(auto-fill,minmax(310px,1fr))}
.poem-solo{grid-template-columns:minmax(0,620px); justify-content:center}
.poem-solo .poem-body{text-align:center}
.poem{background:rgba(255,255,255,.66); border:1px solid rgba(255,255,255,.9);
  border-radius:var(--r); padding:30px 30px 22px; box-shadow:var(--shadow);
  display:flex; flex-direction:column; transition:.28s}
.poem:hover{transform:translateY(-4px); box-shadow:var(--shadow-lg)}
.poem-body{font-family:var(--fd); font-size:16.2px; line-height:1.72;
  color:#33203f; flex:1}
/* o strofa = un paragraf, cu <br> intre versuri */
.poem-body p{margin:0 0 1.15em}
.poem-body p:last-child{margin-bottom:0}
.poem-body p:empty{margin:0; height:1.15em}
.poem-body p.br{margin:0; height:1.15em}
.poem-foot{margin-top:22px; padding-top:14px; border-top:1px solid var(--line);
  display:flex; justify-content:space-between; align-items:baseline; gap:12px}
.poem-title{font-size:13px; letter-spacing:.16em; text-transform:lowercase;
  font-weight:800; color:var(--violet); font-variant:small-caps}
.poem-meta{font-size:12.5px; color:var(--ink3); font-weight:600}
.bookbox{display:grid; gap:30px; grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  align-items:center; background:linear-gradient(150deg,#efe6f6,#fbeee3);
  border-radius:26px; padding:36px 38px; margin-bottom:52px; box-shadow:var(--shadow)}
.bookbox{align-items:center; grid-template-columns:minmax(0,1.35fr) minmax(0,.65fr)}
.coperta img{width:100%; height:auto; max-width:290px; margin-inline:auto; border-radius:8px;
  box-shadow:0 18px 44px -18px rgba(42,20,64,.55)}
.bookbox h2{font-size:32px; margin-bottom:12px}

/* ---------- podcast ---------- */
.arh{display:grid; gap:10px; grid-template-columns:repeat(auto-fill,minmax(330px,1fr))}
.arh button{display:flex; gap:12px; align-items:baseline; text-align:left; padding:11px 14px;
  border-radius:14px; border:1px solid var(--line); background:rgba(255,255,255,.55);
  transition:.2s; width:100%}
.arh button:hover{background:#fff; border-color:var(--violet)}
.arh .nr{font-family:var(--fd); font-size:15px; color:var(--violet); font-weight:700;
  white-space:nowrap; min-width:52px}
.arh .who{font-size:14.5px; color:var(--ink2); line-height:1.45}
.arh-sez{grid-column:1/-1; margin:22px 0 4px; font-size:11.5px; letter-spacing:.16em;
  text-transform:uppercase; font-weight:800; color:var(--ink3)}
.pods{display:grid; gap:24px; grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}
.pod{text-align:left; background:rgba(255,255,255,.72); border:1px solid rgba(255,255,255,.9);
  border-radius:var(--r); overflow:hidden; box-shadow:var(--shadow); transition:.28s;
  display:flex; flex-direction:column}
.pod:hover{transform:translateY(-5px); box-shadow:var(--shadow-lg)}
.pod-thumb{position:relative; display:block; aspect-ratio:16/9; overflow:hidden; background:#2a1440}
.pod-thumb img{width:100%; height:100%; object-fit:cover; transition:.6s}
.pod:hover .pod-thumb img{transform:scale(1.06)}
.play{position:absolute; inset:0; margin:auto; width:58px; height:58px; border-radius:50%;
  background:rgba(253,250,246,.92); box-shadow:0 8px 24px rgba(0,0,0,.28); transition:.25s}
.play::after{content:""; position:absolute; inset:0; margin:auto; width:0; height:0;
  border-left:17px solid var(--ink); border-top:11px solid transparent;
  border-bottom:11px solid transparent; transform:translateX(3px)}
.pod:hover .play{transform:scale(1.09)}
.pod-body{padding:16px 20px 22px; display:flex; flex-direction:column; gap:10px}
.pod-title{font-family:var(--fd); font-size:18.5px; line-height:1.3}

/* ---------- galerie ---------- */
.gal{display:flex; gap:18px; align-items:flex-start}
.galcol{flex:1 1 0; min-width:0; display:flex; flex-direction:column; gap:18px}
.frame{border-radius:18px; overflow:hidden; position:relative; display:flex;
  align-items:center; justify-content:center; border:1px dashed rgba(138,99,171,.30);
  background:linear-gradient(150deg,rgba(255,255,255,.62),rgba(240,232,244,.72))}
.frame span{font-size:11.5px; font-weight:700; letter-spacing:.1em; text-transform:uppercase;
  color:var(--ink3); opacity:.62}
.frame.tint-1{background:linear-gradient(150deg,#f2eaf8,#e4d6f0)}
.frame.tint-2{background:linear-gradient(150deg,#fbeaef,#f4d8e1)}
.frame.tint-3{background:linear-gradient(150deg,#e7f1f8,#d6e5f1)}
.frame.tint-4{background:linear-gradient(150deg,#faf2de,#f1e4c2)}
.frame.tint-5{background:linear-gradient(150deg,#e7f3ee,#d4e8de)}
.frame.tint-6{background:linear-gradient(150deg,#fcece2,#f7dbc9)}
.shot{padding:0; border:0; border-radius:18px; box-shadow:var(--shadow);
  transition:.3s; display:block; width:100%; background:var(--paper2);
  margin:0; position:relative; line-height:0; cursor:zoom-in;
  overflow:hidden; -ms-overflow-style:none; scrollbar-width:none}
.shot::-webkit-scrollbar{display:none; width:0; height:0}
.shot img{width:100%; height:auto; display:block; transition:.6s; border-radius:18px}
.shot:hover{transform:translateY(-4px); box-shadow:var(--shadow-lg)}
.shot:hover img{transform:scale(1.05)}
.galmore{display:flex; justify-content:center; margin-top:30px}
.galstrip{display:grid; gap:18px; grid-template-columns:repeat(3,minmax(0,1fr))}
.galstrip a{display:block; border-radius:18px; overflow:hidden; box-shadow:var(--shadow);
  aspect-ratio:4/3; transition:.3s}
.galstrip a:hover{transform:translateY(-4px); box-shadow:var(--shadow-lg)}
.galstrip img{width:100%; height:100%; object-fit:cover; display:block; transition:.6s}
.galstrip a:hover img{transform:scale(1.05)}
@media(max-width:760px){.galstrip{grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px}}
@media(max-width:760px){.gal{gap:12px} .galcol{gap:12px}}

/* banda de categorii pe ecran mic: se vede ca se poate trage cu degetul */
.filters{position:relative}
@media(max-width:900px){
  .pills{padding-right:40px}
  .filters::after{content:""; position:absolute; right:0; top:6px; height:38px; width:46px;
    pointer-events:none; border-radius:0 999px 999px 0;
    background:linear-gradient(to right, rgba(253,250,246,0), rgba(253,250,246,.96) 72%)}
}

/* ---------- telefon si tableta ---------- */
@media(max-width:900px){
  section.page{padding:34px 0 70px}
  .sec{margin-top:52px}
  .hero{padding:30px 0 10px}
  .about{gap:26px}
}
@media(max-width:620px){
  /* pe telefon fundalul antetului trebuie sa fie opac: textul trecea prin el */
  header.site{background:rgba(253,250,246,.97)}
  .brand img{height:30px}
  .bar{gap:10px}
  .shead{flex-direction:column; align-items:flex-start; gap:8px; margin-bottom:20px}
  .shead .more{font-size:14px}
  .hero .credo{font-size:calc(var(--ds)*21px); line-height:1.5; margin-top:12px}
  .hero .cta{margin-top:26px}
  .btn{padding:12px 22px; font-size:14.5px}
  .filters{margin-bottom:22px}
  /* banda de categorii: se vede ca se poate trage cu degetul */
  .psub{font-size:calc(var(--ds)*17.5px)}
  .lead{font-size:17.5px}
  .poem-body{font-size:15.4px}
  .foot-cols{grid-template-columns:1fr 1fr; gap:24px}
}
@media(max-width:400px){
  .brand img{height:26px}
  .foot-cols{grid-template-columns:1fr}
}

/* ---------- pagina unui text ---------- */
.art{width:min(880px,94vw); margin-inline:auto}
.art .back{display:block; font-size:14px; font-weight:700; color:var(--violet);
  text-decoration:none; margin-bottom:26px}
.art .back:hover{text-decoration:underline}
.art h1{font-size:calc(var(--ds)*clamp(32px,4.6vw,52px)); line-height:1.14; margin:12px 0 14px}
.art .meta{display:flex; gap:12px; align-items:center; flex-wrap:wrap;
  font-size:13.5px; color:var(--ink3); font-weight:600; margin-bottom:30px}
.art figure{margin:0 0 38px; border-radius:24px; overflow:hidden;
  box-shadow:var(--shadow-lg)}
.art figure img{width:100%; height:auto; display:block}
.art .body{font-size:calc(var(--bs)*18.5px); line-height:1.78; color:#3a2a49}
.art .body p{margin:0 0 19px}
.art .body p.dash{text-indent:0; color:#4a3757}
.art .end{margin:52px 0 0; text-align:center; font-family:var(--fd);
  font-size:26px; color:var(--violet); opacity:.5}
.art .out{margin:36px 0 0; padding:22px 26px; border-radius:20px;
  background:rgba(255,255,255,.7); border:1px solid rgba(255,255,255,.9); box-shadow:var(--shadow)}
.art .out p{margin:0 0 14px; font-size:15px; color:var(--ink2)}
.nav2{display:grid; gap:16px; grid-template-columns:1fr 1fr; margin:56px 0 0}
.nav2 a{text-decoration:none; padding:20px 22px; border-radius:20px;
  background:rgba(255,255,255,.7); border:1px solid rgba(255,255,255,.9);
  box-shadow:var(--shadow); transition:.26s}
.nav2 a:hover{transform:translateY(-3px); box-shadow:var(--shadow-lg)}
.nav2 span{display:block; font-size:11.5px; font-weight:800; letter-spacing:.1em;
  text-transform:uppercase; color:var(--ink3); margin-bottom:6px}
.nav2 b{font-family:var(--fd); font-weight:var(--fw); font-size:calc(var(--ds)*18px); line-height:1.3}
.nav2 .r{text-align:right}
.nav2 .cat2{grid-column:1 / -1; text-align:center;
  background:rgba(138,99,171,.11); border-color:rgba(138,99,171,.22)}
.nav2 .cat2:hover{background:rgba(138,99,171,.16)}
.nav2 .cat2 span{margin-bottom:4px}
@media(max-width:640px){.nav2{grid-template-columns:1fr} .nav2 .r{text-align:left}}

/* ---------- note ---------- */
.note{background:rgba(255,255,255,.62); border:1px dashed rgba(138,99,171,.42);
  border-radius:18px; padding:18px 22px; font-size:14.5px; color:var(--ink2); margin-bottom:30px}

/* ---------- contact / elsewhere ---------- */
.tiles{display:grid; gap:18px; grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}
.tiles-3{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.elsewhere{gap:12px}
.elsewhere a{font-size:14.5px; padding:10px 19px}
.tile{display:block; text-decoration:none; background:rgba(255,255,255,.7); border-radius:20px;
  padding:24px; border:1px solid rgba(255,255,255,.9); box-shadow:var(--shadow); transition:.26s}
.tile:hover{transform:translateY(-4px); box-shadow:var(--shadow-lg)}
.tile b{display:block; font-family:var(--fd); font-size:19px; font-weight:500; margin-bottom:5px}
.tile span{font-size:14px; color:var(--ink2)}
.sociallist{display:flex; gap:10px; flex-wrap:wrap; margin-top:14px}
.sociallist a{text-decoration:none; font-size:14px; font-weight:700; padding:9px 17px;
  border-radius:999px; background:rgba(255,255,255,.8); border:1px solid var(--line); transition:.2s}
.sociallist a:hover{background:var(--ink); color:#fff8f2; border-color:var(--ink)}

/* ---------- footer ---------- */
footer.site{margin-top:60px; padding:0 0 34px; background:rgba(255,255,255,.5);
  border-top:1px solid var(--line)}
.foot-quote{text-align:center; padding:56px 0 46px; position:relative}
.foot-quote::before{content:""; position:absolute; left:50%; top:0; width:64px; height:1px;
  background:var(--violet); opacity:.45; transform:translateX(-50%)}
.foot-quote blockquote{margin:0 auto; max-width:620px; font-family:var(--fd);
  font-size:calc(var(--ds)*21px); line-height:1.5; color:var(--ink)}
.foot-quote cite{display:block; margin-top:14px; font-style:normal; font-size:12px;
  letter-spacing:.16em; text-transform:uppercase; font-weight:700; color:var(--ink3)}
.foot-quote cite i{font-style:normal; text-transform:none; letter-spacing:.04em}
.foot-cols{display:grid; gap:34px; padding:34px 0 30px; border-top:1px solid var(--line);
  grid-template-columns:1.3fr 1fr 1fr 1fr}
.foot-logo{height:34px; width:auto; margin-bottom:14px}
.foot-mail{font-size:14.5px; color:var(--ink2); text-decoration:none; font-weight:600}
.foot-mail:hover{color:var(--violet)}
.foot-h{margin:0 0 12px; font-size:11.5px; letter-spacing:.16em; text-transform:uppercase;
  font-weight:800; color:var(--violet)}
.foot-nav{display:flex; flex-direction:column; gap:9px}
.foot-nav a{font-size:14.5px; color:var(--ink2); text-decoration:none; width:fit-content}
.foot-nav a:hover{color:var(--ink); text-decoration:underline}
.foot-bottom{display:flex; justify-content:space-between; align-items:center; gap:16px;
  flex-wrap:wrap; padding-top:22px; border-top:1px solid var(--line);
  font-size:13px; color:var(--ink3)}
.foot-bottom a{color:var(--ink3); text-decoration:none; font-weight:700}
.foot-bottom a:hover{color:var(--violet)}
@media(max-width:860px){.foot-cols{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.foot-cols{grid-template-columns:1fr}}

/* ---------- căutare pe tot site-ul ---------- */
.hact{display:flex; align-items:center; gap:6px}
.iconbtn{width:40px; height:40px; border-radius:999px; display:grid; place-items:center;
  color:var(--ink2); border:1px solid var(--line); background:rgba(255,255,255,.7); transition:.2s}
.iconbtn:hover{background:var(--ink); color:#fff8f2; border-color:var(--ink)}
.srch{position:fixed; inset:0; z-index:90; display:none; padding:10vh 20px 20px;
  background:rgba(28,12,42,.42); backdrop-filter:blur(6px)}
.srch.on{display:block}
.srch-box{width:min(720px,94vw); margin-inline:auto; background:var(--paper);
  border-radius:26px; box-shadow:var(--shadow-lg); overflow:hidden}
.srch-top{display:flex; align-items:center; gap:12px; padding:16px 20px;
  border-bottom:1px solid var(--line); color:var(--ink3)}
.srch-top input{flex:1; font:inherit; font-size:18px; border:0; background:none;
  color:var(--ink); outline:none}
.srch-top button{font-size:11.5px; font-weight:800; letter-spacing:.08em; text-transform:uppercase;
  color:var(--ink3); border:1px solid var(--line); border-radius:999px; padding:5px 10px}
.srch-res{max-height:60vh; overflow:auto; padding:8px 0 12px}
.sgrp{font-size:11.5px; font-weight:800; letter-spacing:.14em; text-transform:uppercase;
  color:var(--violet); padding:14px 22px 6px}
.srch-res a{display:flex; gap:12px; align-items:baseline; justify-content:space-between;
  padding:10px 22px; text-decoration:none; transition:.15s}
.srch-res a:hover,.srch-res a.sel{background:rgba(138,99,171,.10)}
.srch-res b{font-family:var(--fd); font-weight:var(--fw); font-size:17.5px; line-height:1.3}
.srch-res span{font-size:12.5px; color:var(--ink3); white-space:nowrap; font-weight:600}
.srch-empty{padding:26px 22px; color:var(--ink3)}

/* ---------- lightbox ---------- */
.lb{position:fixed; inset:0; z-index:100; display:none; place-items:center; overflow:hidden;
  background:rgba(28,12,42,.86); backdrop-filter:blur(8px); padding:24px}
.lb.on{display:grid}
.lb-inner{display:flex; align-items:center; justify-content:center;
  max-width:92vw; max-height:88vh; overflow:hidden}
.lb-inner img{max-width:92vw; max-height:88vh; width:auto; height:auto; display:block;
  object-fit:contain; border-radius:14px}
.lb-inner iframe{width:100%; aspect-ratio:16/9; border:0; border-radius:16px}
.lb-cap{color:#f4e9df; text-align:center; margin-top:14px; font-size:15px}
.lb-x{position:fixed; top:18px; right:22px; color:#f4e9df; font-size:30px; line-height:1;
  padding:8px 14px; border-radius:14px}
.lb-x:hover{background:rgba(255,255,255,.14)}
.lb-nav{position:fixed; top:50%; transform:translateY(-50%); z-index:101; width:52px; height:52px;
  border-radius:999px; display:none; place-items:center; color:#f4e9df; font-size:26px;
  background:rgba(255,255,255,.12); backdrop-filter:blur(6px); transition:.2s}
.lb-nav:hover{background:rgba(255,255,255,.26)}
.lb.on .lb-nav.show{display:grid}
#lbp{left:18px} #lbn{right:18px}
@media(max-width:640px){#lbp{left:6px} #lbn{right:6px} .lb-nav{width:44px; height:44px}}

@media(max-width:860px){
  .about{grid-template-columns:1fr}
  .about .pic{position:static; max-width:460px}
  .bookbox{grid-template-columns:1fr; padding:28px 24px}
  nav.main{display:none; position:absolute; top:100%; left:0; right:0; flex-direction:column;
    background:var(--paper); padding:12px 6vw 20px; border-bottom:1px solid var(--line)}
  nav.main.open{display:flex}
  .burger{display:block}
  header.site{position:sticky}
}


/* ---------- adaugat pentru WordPress ---------- */
.brand-text{font-family:var(--fd); font-size:24px; letter-spacing:.06em; text-transform:uppercase}
.narrow-prose{max-width:760px}
.prose h2,.prose h3{margin:34px 0 14px}
.prose ul,.prose ol{margin:0 0 20px; padding-left:22px; color:#3d2a4e}
.prose li{margin:0 0 8px}
.prose img,.art .body img{max-width:100%; height:auto; border-radius:18px}
.prose blockquote,.art .body blockquote{margin:0 0 22px; padding:2px 0 2px 20px;
  border-left:2px solid var(--violet); color:var(--ink2)}
.art .body h2,.art .body h3{margin:36px 0 14px}
.art .body ul,.art .body ol{margin:0 0 20px; padding-left:22px}
.art .body figure{margin:0 0 26px}
.oana-pag{margin:48px 0 0}
.oana-pag .nav-links{display:flex; gap:8px; justify-content:center; flex-wrap:wrap}
.oana-pag .page-numbers{display:inline-block; min-width:42px; text-align:center;
  padding:10px 14px; border-radius:999px; text-decoration:none; font-size:14.5px; font-weight:700;
  background:rgba(255,255,255,.8); border:1px solid var(--line); color:var(--ink2); transition:.2s}
.oana-pag .page-numbers:hover{border-color:var(--violet); color:var(--ink)}
.oana-pag .page-numbers.current{background:var(--ink); color:#fff8f2; border-color:var(--ink)}
.oana-pag .dots{background:none; border-color:transparent}
.pill{display:inline-block; text-decoration:none}
.wp-block-image{margin:0 0 26px}
.alignwide{width:min(1180px,94vw); margin-inline:auto}
.screen-reader-text{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0)}
.brand{text-decoration:none; display:inline-flex; align-items:center}
.brand-text{color:var(--ink)}

/* ---------- telefon: corecturi dupa verificarea pe 390px ---------- */
@media(max-width:620px){
  /* galeria statea tot pe trei coloane: poze de 110px latime, adica nimic.
     Structura vine din PHP, asa ca desfac coloanele si le reasez cate doua. */
  .gal{display:block}
  .galcol{display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-bottom:12px}
  .galcol:last-child{margin-bottom:0}

  /* tinte de atins mai generoase si litere care nu cer lupa */
  .chip{font-size:12px; padding:6px 12px}
  .foot-h{font-size:12px}
  .brand{display:inline-flex; align-items:center; min-height:44px}
  .foot-cols a{display:inline-block; padding:2px 0}
  .sociallist a{padding:6px 0}
}

/* Categoriile stateau intr-o banda care se trage cu degetul: pe telefon si pe
   tableta cinci din sapte ramaneau ascunse. Pe randuri se vad toate deodata. */
@media(max-width:900px){
  .pills{flex-wrap:wrap; overflow-x:visible; padding-right:0; gap:6px}
  .filters::after{display:none}
  .pill{padding:10px 13px; font-size:13px}
}


/* ===== Mozaic: fiecare caseta e cat continutul ei (1.9.8) =====
   Inainte, casetele se intindeau cat cea mai inalta din rand si ramanea alb
   dedesubt. Acum inaltimea e libera si golurile se inchid. Clasa .mozaic o pune
   app.js dupa ce masoara casetele, deci fara JavaScript pagina arata ca inainte.
   Citirea ramane cronologica pe orizontala: 1-2-3, apoi 4-5-6. */
.grid.mozaic{align-items:start; grid-auto-rows:8px}

/* Pe prima pagina sunt doar noua texte, asa ca un mozaic cu inaltimi libere lasa
   o coloana mult mai scurta si o gaura mare in coltul de jos. Acolo fotografia
   primeste inaltime fixa si rezumatul se opreste la trei randuri, deci casetele
   ies aproape egale si sectiunea se termina drept. Pe blog raman intregi. */
body.home .grid .card .ph{height:320px}
body.home .grid .card .ph img{height:100%; object-fit:cover; object-position:50% 12%}
/* Cadrul sta lipit de partea de sus a fotografiei, nu la mijloc: la pozele in
   picioare oamenii sunt in treimea de sus, deci asa nu se taie nicio fata. */
body.home .grid .card p{display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden}
@media(max-width:620px){ body.home .grid .card .ph{height:240px} }