:root{
  --ink:#211732; --plum:#3a2a5c; --ember:#eeae82; --mist:#efe8f7; --fog:#b6a4cf; --paper:#f8f3ec;
  --bg-light:#f6f1fb; --bg-light-alt:#efe3f7; --ink-light:#2f2246; --muted-light:#7c6a95;
  --purple:#8a63b8; --purple-deep:#6d4a9c; --card-shadow:rgba(80,50,120,0.16);
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{font-family:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif; background:var(--bg-light); color:var(--ink-light); line-height:1.6;}
a{color:inherit;}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--ember); outline-offset:3px;}

.site-header{display:flex; align-items:center; justify-content:space-between; gap:16px; padding:18px clamp(20px,5vw,56px); background:var(--ink); color:var(--mist); border-bottom:1px solid rgba(239,232,247,0.12);}
.brand{display:flex; align-items:center; gap:12px; text-decoration:none;}
.brand-logo{width:52px; height:52px; object-fit:contain; display:block;}
.brand-text{display:flex; flex-direction:column; line-height:1.15;}
.brand-name{font-family:'Cormorant Garamond',Georgia,serif; font-size:1.15rem; color:var(--mist); white-space:nowrap;}
.brand-sub{font-size:0.62rem; letter-spacing:0.16em; text-transform:uppercase; color:var(--fog); white-space:nowrap;}

.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;}
.main-nav{display:flex; align-items:center; gap:18px;}
.main-nav a{font-size:0.85rem; text-decoration:none; color:var(--mist); opacity:.85; white-space:nowrap;}
.main-nav a:hover,.main-nav a[aria-current]{opacity:1; color:var(--ember);}
.nav-dropdown{position:relative;}
.nav-dd-toggle{display:flex; align-items:center; gap:4px; background:none; border:0; color:var(--mist); font:inherit; font-size:0.85rem; opacity:.85; cursor:pointer; padding:0;}
.nav-dd-toggle:hover,.nav-dd-toggle[aria-expanded="true"]{opacity:1; color:var(--ember);}
.nav-dd-toggle svg{width:11px; height:11px; transition:transform .2s ease;}
.nav-dd-toggle[aria-expanded="true"] svg{transform:rotate(180deg);}
.nav-dd-menu{position:absolute; top:calc(100% + 16px); left:50%; transform:translateX(-50%) translateY(-6px); background:var(--ink); border:1px solid rgba(239,232,247,0.14); border-radius:14px; padding:8px; min-width:190px; box-shadow:0 20px 40px -20px rgba(0,0,0,0.5); opacity:0; pointer-events:none; transition:opacity .18s ease, transform .18s ease; z-index:6;}
.nav-dd-menu.is-open{opacity:1; pointer-events:auto; transform:translateX(-50%) translateY(0);}
.nav-dd-menu a{display:block; padding:9px 12px; border-radius:8px; font-size:0.85rem; color:var(--mist); opacity:.85; text-decoration:none; white-space:nowrap;}
.nav-dd-menu a:hover{opacity:1; background:rgba(239,232,247,0.08); color:var(--ember);}
.ig-link span{display:none;}
.ig-link{display:flex; align-items:center; gap:7px; font-size:0.8rem; text-decoration:none; color:var(--fog); padding:7px 12px; border:1px solid rgba(239,232,247,0.18); border-radius:999px; transition:color .2s ease, border-color .2s ease; opacity:1 !important;}
.ig-link:hover{color:var(--mist); border-color:rgba(239,232,247,0.4);}
.ig-link svg{width:15px; height:15px; flex-shrink:0;}
.wa-link{border-color:rgba(37,211,102,0.35);}
.wa-link:hover{border-color:#25d366; color:#25d366;}
.nav-toggle{display:none; flex-direction:column; justify-content:center; gap:5px; width:40px; height:40px; background:none; border:0; cursor:pointer; padding:8px; flex-shrink:0;}
.nav-toggle .bar{display:block; width:100%; height:2px; background:var(--mist); border-radius:2px; transition:transform .2s ease, opacity .2s ease;}
.nav-toggle[aria-expanded="true"] .bar:nth-child(1){transform:translateY(7px) rotate(45deg);}
.nav-toggle[aria-expanded="true"] .bar:nth-child(2){opacity:0;}
.nav-toggle[aria-expanded="true"] .bar:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
@media(max-width:1300px){
  .nav-toggle{display:flex;}
  .main-nav{
    position:absolute; top:100%; left:0; right:0;
    flex-direction:column; align-items:flex-start; gap:4px;
    background:var(--ink); border-bottom:1px solid rgba(239,232,247,0.12);
    padding:10px clamp(20px,5vw,56px) 20px;
    max-height:0; overflow:hidden; opacity:0;
    transition:max-height .28s ease, opacity .2s ease;
  }
  .main-nav.is-open{max-height:420px; overflow-y:auto; opacity:1;}
  .main-nav a{padding:10px 0; width:100%; font-size:0.92rem;}
  .main-nav .ig-link,.main-nav .wa-link{margin-top:6px; width:auto;}
  .main-nav .ig-link span{display:inline;}
    .nav-dropdown{width:100%;}
    .nav-dd-toggle{width:100%; padding:10px 0; font-size:0.92rem; justify-content:space-between;}
    .nav-dd-menu{position:static; transform:none; opacity:1; pointer-events:none; max-height:0; overflow:hidden; background:none; border:0; box-shadow:none; padding:0 0 0 14px; min-width:0; transition:max-height .22s ease;}
    .nav-dd-menu.is-open{pointer-events:auto; max-height:220px; transform:none;}
    .nav-dd-menu a{padding:9px 0; opacity:.75;}
}
.site-header{position:relative;}

.page-hero{background:var(--ink); color:var(--mist); text-align:center; padding:64px clamp(20px,5vw,56px) 72px;}
.eyebrow{font-size:0.78rem; letter-spacing:0.18em; text-transform:uppercase; color:var(--ember); margin:0 0 12px;}
.page-hero h1{font-family:'Cormorant Garamond',Georgia,serif; font-weight:500; font-size:clamp(2.2rem,5vw,3.6rem); margin:0 0 14px; line-height:1.15;}
.page-hero p{max-width:52ch; margin:0 auto; color:var(--fog);}

.wrap{max-width:1120px; margin:0 auto; padding:56px clamp(20px,5vw,40px) 72px;}
.filters{display:flex; flex-wrap:wrap; gap:10px; justify-content:center; margin:0 0 36px;}
.chip{padding:9px 18px; border-radius:999px; border:1px solid rgba(122,90,168,0.25); background:#fff; color:var(--ink-light); font:inherit; font-size:0.88rem; cursor:pointer; transition:all .18s ease;}
.chip:hover{border-color:var(--purple);}
.chip.active{background:var(--purple); border-color:var(--purple); color:#fff;}

.post-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:26px;}
.post-card{display:flex; flex-direction:column; background:#fff; border-radius:20px; overflow:hidden; text-decoration:none; box-shadow:0 18px 40px -26px var(--card-shadow); transition:transform .2s ease;}
.post-card:hover{transform:translateY(-4px);}
.post-cover{aspect-ratio:16/9; background:linear-gradient(160deg,var(--bg-light-alt),#e2d3f0); background-size:cover; background-position:center; display:flex; align-items:center; justify-content:center; font-size:2.4rem;}
.post-card-body{padding:22px 24px 26px; display:flex; flex-direction:column; gap:8px; flex:1;}
.tag{align-self:flex-start; font-size:0.72rem; letter-spacing:0.08em; text-transform:uppercase; background:var(--bg-light-alt); color:var(--purple-deep); padding:4px 10px; border-radius:999px;}
.post-card h3{margin:0; font-weight:500; font-size:1.2rem; line-height:1.3;}
.post-card p{margin:0; color:var(--muted-light); font-size:0.92rem;}
.post-date{font-size:0.78rem; color:var(--muted-light); margin-top:auto; padding-top:8px;}
.empty{text-align:center; color:var(--muted-light); padding:40px 0;}

.article{max-width:1040px; margin:0 auto;}
.article > .article-body{max-width:680px;}
.cover-banner{width:100%; aspect-ratio:2.1/1; overflow:hidden; background:var(--bg-light-alt); margin-bottom:36px;}
.cover-banner:empty{display:none; margin-bottom:0;}
.cover-banner img{width:100%; height:100%; object-fit:cover; object-position:50% 30%; display:block;}
@media(max-width:700px){ .cover-banner{aspect-ratio:1.5/1;} }
.article .back{display:inline-block; margin-bottom:24px; color:var(--purple-deep); text-decoration:none; font-size:0.9rem;}
.article h1{font-family:'Cormorant Garamond',Georgia,serif; font-weight:500; font-size:clamp(2rem,4.6vw,3rem); line-height:1.2; margin:10px 0 10px;}
.article .meta{color:var(--muted-light); font-size:0.85rem; margin-bottom:26px;}
.article-body{font-size:1.05rem; line-height:1.85;}
.article-body::after{content:''; display:block; clear:both;}
.article-body h2{font-family:'Cormorant Garamond',Georgia,serif; font-weight:500; font-size:1.7rem; margin:2em 0 .5em;}
.article-body blockquote{margin:1.6em 0; padding:6px 0 6px 20px; border-left:3px solid var(--purple); color:var(--purple-deep); font-style:italic;}
.article-body a{color:var(--purple-deep);}

.subscribe{background:var(--ink); color:var(--mist); text-align:center; padding:64px clamp(20px,5vw,40px);}
.subscribe h2{font-family:'Cormorant Garamond',Georgia,serif; font-weight:500; margin:0 0 8px; font-size:clamp(1.7rem,3.4vw,2.3rem);}
.subscribe p{color:var(--fog); margin:0 auto 24px; max-width:46ch;}
.sub-form{display:flex; flex-wrap:wrap; gap:10px; justify-content:center; max-width:560px; margin:0 auto;}
.sub-form input{flex:1 1 180px; padding:13px 18px; border-radius:999px; border:1px solid rgba(239,232,247,0.25); background:rgba(255,255,255,0.08); color:var(--mist); font:inherit;}
.sub-form input::placeholder{color:var(--fog);}
.btn-solid{padding:13px 26px; border-radius:999px; border:0; background:var(--paper); color:var(--ink); font:inherit; font-weight:500; cursor:pointer;}
.btn-solid:hover{background:#fff;}
.btn-solid:disabled{opacity:.6; cursor:default;}
.sub-msg{min-height:1.4em; margin:14px 0 0; font-size:0.92rem;}
.sub-msg.ok{color:#b8e6c8;} .sub-msg.err{color:#f3b1b1;}

.site-footer{background:var(--ink); color:var(--fog); border-top:1px solid rgba(239,232,247,0.12); padding:56px clamp(20px,5vw,56px) 34px;}
.site-footer a{color:var(--mist); text-decoration:none;}
.footer-inner{display:flex; flex-direction:column; align-items:center; text-align:center; gap:16px;}
.footer-tagline{font-style:italic; color:var(--fog); font-size:0.9rem; margin:0; max-width:40ch;}
.footer-nav{display:flex; flex-wrap:wrap; justify-content:center; gap:22px; margin:2px 0;}
.footer-nav a{font-size:0.85rem; letter-spacing:0.04em; opacity:0.85; transition:opacity .2s ease;}
.footer-nav a:hover{opacity:1; text-decoration:underline;}
.footer-social{display:flex; flex-wrap:wrap; justify-content:center; gap:10px; margin-top:2px;}
.footer-ig span{display:inline !important;}
.footer-copy{font-size:0.72rem; color:var(--fog); opacity:0.7; margin:10px 0 0;}

.article-body figure{margin:1.8em 0;} .article-body figure img,.article-body figure video{width:100%; border-radius:14px; display:block;}
.article-columns{display:grid; grid-template-columns:3fr 2fr; gap:32px; align-items:start;}
.article-columns .article-text{min-width:0;}
.article-media{position:sticky; top:24px; min-width:0;}
.article-media figure{margin:0 0 20px;}
.article-media img,.article-media video{width:100%; border-radius:14px; display:block;}
.more-writings-heading{font-family:'Cormorant Garamond',Georgia,serif; font-size:1.2rem; font-weight:600; color:var(--ink-light); margin:0 0 12px;}
.mw-item{display:flex; gap:10px; align-items:center; text-decoration:none; padding:10px 0; border-top:1px solid rgba(122,90,168,0.14);}
.mw-item:first-of-type{border-top:0; padding-top:0;}
.mw-thumb{width:48px; height:48px; border-radius:10px; background-size:cover; background-position:center; background-color:var(--bg-light-alt); flex-shrink:0; display:flex; align-items:center; justify-content:center; font-size:1.1rem;}
.mw-info{display:flex; flex-direction:column; gap:3px; min-width:0;}
.mw-title{font-size:0.85rem; font-weight:500; color:var(--ink-light); line-height:1.32; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;}
.mw-mood{font-size:0.66rem; letter-spacing:0.06em; text-transform:uppercase; color:var(--purple);}
@media(max-width:700px){ .article-columns{display:block;} .article-media{position:static; width:100%; margin:0 0 24px;} }

.author-hero{padding:64px clamp(20px,5vw,56px) 8px; background:var(--bg-light);}
.about-inner{max-width:1000px; margin:0 auto; display:grid; grid-template-columns:340px 1fr; gap:60px; align-items:start; padding:0 clamp(20px,5vw,40px) 80px;}
@media(max-width:860px){ .about-inner{grid-template-columns:1fr; gap:40px; text-align:center;} }
.author-photo-wrap{position:relative; max-width:340px; margin:0 auto;}
.author-photo-frame{aspect-ratio:4/5; border-radius:28px; background:linear-gradient(160deg,var(--bg-light-alt),#e2d3f0); display:flex; align-items:center; justify-content:center; box-shadow:0 24px 48px -28px var(--card-shadow); overflow:hidden;}
.author-photo-frame img{width:100%; height:100%; object-fit:cover; display:block;}
.author-mascot-perch{position:absolute; bottom:-20px; right:-20px; width:88px; height:76px; background:var(--bg-light); border-radius:46% 44% 48% 42% / 50% 46% 54% 50%; box-shadow:0 16px 30px -16px var(--card-shadow); display:flex; align-items:center; justify-content:center;}
.author-mascot-perch img{width:56px; height:56px; object-fit:contain;}
.author-heading{font-family:'Cormorant Garamond',Georgia,serif; font-weight:500; font-size:clamp(2rem,3.8vw,2.9rem); margin:0 0 20px; color:var(--ink-light);}
.author-quote{font-style:italic; font-size:1.15rem; line-height:1.6; color:var(--purple-deep); border-left:3px solid var(--purple); padding-left:20px; margin:0 0 24px; text-align:left;}
@media(max-width:860px){ .author-quote{margin-left:auto; margin-right:auto; max-width:46ch;} }
.author-body{font-size:1.02rem; line-height:1.8; color:var(--ink-light); margin:0 0 20px; max-width:60ch;}
@media(max-width:860px){ .author-body{margin-left:auto; margin-right:auto;} }
.author-signature{font-style:italic; color:var(--muted-light); margin:0 0 32px;}
.author-cta{display:flex; flex-wrap:wrap; gap:14px;}
@media(max-width:860px){ .author-cta{justify-content:center;} }
.hisla-break{display:flex; align-items:center; justify-content:center; gap:14px; margin:2.6em 0; text-align:center;}
.hisla-break img{width:56px; height:56px; object-fit:contain; filter:drop-shadow(0 10px 18px rgba(80,50,120,.22));}
.hisla-break span{font-style:italic; color:var(--muted-light); font-size:0.92rem; max-width:32ch;}
.hisla-inline{display:inline-block; width:26px; height:26px; object-fit:contain; vertical-align:-6px; margin-left:4px;}
.btn-purple{display:inline-block; padding:13px 26px; border-radius:999px; background:var(--purple); color:#fff; text-decoration:none; font-weight:500; font-size:0.92rem; transition:background .2s ease;}
.btn-purple:hover{background:var(--purple-deep);}
.btn-outline-light{display:inline-block; padding:13px 26px; border-radius:999px; border:1px solid rgba(122,90,168,0.35); color:var(--purple-deep); text-decoration:none; font-weight:500; font-size:0.92rem; transition:border-color .2s ease;}
.btn-outline-light:hover{border-color:var(--purple);}
