/*
Theme Name: Shansi
Theme URI: https://shansi.example
Author: Shansi
Description: A magazine theme for women, built on three levels — Soul, Mind and Body. Burgundy, blue and green over white and black. English-first. Designed for the Shansi publication.
Version: 1.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: shansi
*/

:root{
  --burgundy:#6E1B2C;--blue:#1C3F7C;--green:#175C46;
  --soul:#6E1B2C;--mind:#1C3F7C;--body:#175C46;
  --white:#FFFFFF;--paper:#F7F6F2;--black:#16151A;--ink:#16151A;
  --line:rgba(22,21,26,.14);--grid:#16151A;
  --display:"Fraunces",Georgia,serif;--body-f:"Hanken Grotesk",system-ui,sans-serif;--geo:"Noto Serif Georgian",serif;
}
*{box-sizing:border-box;}
body{margin:0;font-family:var(--body-f);background:var(--paper);color:var(--ink);line-height:1.6;-webkit-text-size-adjust:100%;}
a{color:inherit;text-decoration:none;}
img{max-width:100%;height:auto;display:block;}
.container{max-width:1160px;margin:0 auto;padding:0 24px;}
.eyebrow{font-family:var(--body-f);font-weight:600;font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;}
.skip-link{position:absolute;left:-9999px;}
.skip-link:focus{left:8px;top:8px;background:#fff;padding:8px 14px;z-index:200;}

/* header */
.site-head{position:sticky;top:0;z-index:90;background:var(--white);border-bottom:1px solid var(--ink);}
.head-top{max-width:1160px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;padding:15px 24px;gap:16px;}
.brand{display:flex;align-items:baseline;gap:10px;}
.brand .geo{font-family:var(--geo);color:var(--burgundy);font-size:1.2rem;line-height:1;}
.brand .word{font-family:var(--display);font-weight:500;font-size:1.55rem;letter-spacing:.16em;color:var(--ink);}
.head-tools{display:flex;align-items:center;gap:16px;font-size:.78rem;}
.search{font-weight:600;opacity:.5;background:none;border:none;font-family:var(--body-f);cursor:pointer;}
.subscribe{font-family:var(--body-f);font-weight:600;font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;background:var(--burgundy);color:var(--white);padding:9px 17px;border-radius:2px;}
.head-nav{border-top:1px solid var(--line);}
.head-nav ul{max-width:1160px;margin:0 auto;display:flex;gap:30px;padding:0 24px;list-style:none;flex-wrap:wrap;}
.head-nav li{position:relative;}
.head-nav > ul > li > a{display:block;font-family:var(--body-f);font-weight:700;font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;padding:13px 0;opacity:.7;}
.head-nav > ul > li:hover > a,.head-nav a:focus{opacity:1;}
/* colour the three realm parents by menu item slug/class if present */
.head-nav .realm-soul > a{color:var(--soul);opacity:1;}
.head-nav .realm-mind > a{color:var(--mind);opacity:1;}
.head-nav .realm-body > a{color:var(--body);opacity:1;}
.head-nav ul ul{display:none;position:absolute;top:100%;left:-14px;background:var(--white);border:1px solid var(--ink);min-width:170px;padding:6px 0;z-index:20;}
.head-nav li:hover > ul,.head-nav li:focus-within > ul{display:block;}
.head-nav ul ul a{display:block;font-weight:500;font-size:.82rem;letter-spacing:.02em;padding:8px 16px;text-transform:none;opacity:.85;}
.head-nav ul ul a:hover{background:var(--paper);opacity:1;}

/* hero */
.hero{display:grid;grid-template-columns:1.15fr .85fr;border-bottom:1px solid var(--ink);}
.hero-img{min-height:440px;position:relative;background:var(--burgundy) center/cover no-repeat;background-image:radial-gradient(80% 70% at 28% 20%,rgba(255,255,255,.14),transparent 60%);}
.hero-txt{padding:46px 44px;display:flex;flex-direction:column;justify-content:center;background:var(--white);border-left:1px solid var(--ink);}
.hero-txt .eyebrow{color:var(--soul);}
.hero-txt h1{font-family:var(--display);font-weight:400;font-size:clamp(2.1rem,4.5vw,3.4rem);line-height:1.06;margin:14px 0 16px;}
.hero-txt h1 a{color:inherit;}
.hero-txt .dek{font-family:var(--display);font-style:italic;font-size:1.12rem;line-height:1.5;opacity:.82;max-width:34ch;}
.hero-txt .byline{font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;opacity:.55;margin-top:22px;}

/* triptych */
.tri-intro{text-align:center;padding:44px 24px 26px;}
.tri-intro .eyebrow{color:var(--burgundy);}
.tri-intro h2{font-family:var(--display);font-weight:400;font-size:clamp(1.5rem,4vw,2.1rem);line-height:1.2;margin-top:10px;}
.triptych{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--grid);border-top:1px solid var(--ink);border-bottom:1px solid var(--ink);}
.tri{padding:34px 26px 30px;color:var(--white);background-image:radial-gradient(70% 60% at 24% 16%,rgba(255,255,255,.08),transparent 60%);}
.tri.soul{background-color:var(--soul);}
.tri.mind{background-color:var(--mind);}
.tri.body{background-color:var(--body);}
.tri .geo{font-family:var(--geo);font-size:.9rem;opacity:.7;letter-spacing:.12em;}
.tri .name{font-family:var(--display);font-weight:400;font-size:2.1rem;line-height:1;margin:4px 0 8px;}
.tri .name a{color:inherit;}
.tri .line{font-family:var(--display);font-style:italic;font-size:1.05rem;opacity:.92;}
.tri .subs{margin-top:16px;font-family:var(--body-f);font-weight:600;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;opacity:.82;line-height:1.9;}
.tri .subs a{color:inherit;}

/* realm zones */
.realm{padding:56px 0 10px;}
.realm.soul{--accent:var(--soul);}
.realm.mind{--accent:var(--mind);}
.realm.body{--accent:var(--body);}
.realm-head{border-top:3px solid var(--accent);padding-top:18px;display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:12px;}
.realm-head .rname{font-family:var(--display);font-weight:400;font-size:2.4rem;line-height:1;color:var(--accent);}
.realm-head .rname a{color:inherit;}
.realm-head .rsubs{font-family:var(--body-f);font-weight:600;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;opacity:.6;}
.realm-head .rsubs a{color:inherit;}
.realm-head .rtag{width:100%;font-family:var(--display);font-style:italic;font-size:1.05rem;opacity:.7;margin-top:2px;}

.feature{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--ink);margin-top:26px;background:var(--white);}
.feature .fimg{min-height:280px;background:var(--accent) center/cover no-repeat;background-image:radial-gradient(80% 70% at 28% 20%,rgba(255,255,255,.14),transparent 60%);}
.feature .ftxt{padding:32px;display:flex;flex-direction:column;justify-content:center;}
.feature .fkick{font-weight:600;font-size:.64rem;letter-spacing:.18em;text-transform:uppercase;color:var(--accent);}
.feature h3{font-family:var(--display);font-weight:400;font-size:1.75rem;line-height:1.12;margin:10px 0 12px;}
.feature h3 a{color:inherit;}
.feature .fdek{font-family:var(--display);font-style:italic;opacity:.8;line-height:1.5;}
.feature .fby{font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;opacity:.55;margin-top:16px;}

.trio{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;margin-top:30px;}
.tcard .timg{height:150px;background:var(--accent) center/cover no-repeat;opacity:.95;background-image:radial-gradient(70% 60% at 26% 18%,rgba(255,255,255,.14),transparent 60%);margin-bottom:12px;}
.tcard .kmeta{font-weight:600;font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);}
.tcard h4{font-family:var(--display);font-weight:500;font-size:1.18rem;line-height:1.2;margin:5px 0 6px;}
.tcard h4 a{color:inherit;}
.tcard p{font-size:.83rem;opacity:.72;line-height:1.5;margin:0;}

/* section (category) hub */
.sec-masthead{color:var(--white);padding:52px 0;background-color:var(--accent,var(--burgundy));background-image:radial-gradient(90% 80% at 20% 10%,rgba(255,255,255,.12),transparent 55%);border-bottom:1px solid var(--ink);}
.sec-masthead .kick{font-family:var(--body-f);font-weight:600;font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;opacity:.8;}
.sec-masthead h1{font-family:var(--display);font-weight:400;font-size:clamp(2.4rem,6vw,3.6rem);line-height:1;margin:8px 0 14px;}
.sec-masthead p{font-family:var(--display);font-style:italic;font-size:1.15rem;max-width:52ch;opacity:.92;margin:0;}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;padding:44px 0 60px;}
.gcard .gimg{height:180px;margin-bottom:14px;background:var(--accent,var(--burgundy)) center/cover no-repeat;background-image:radial-gradient(70% 60% at 26% 18%,rgba(255,255,255,.14),transparent 60%);}
.gcard .meta{font-size:.64rem;letter-spacing:.14em;text-transform:uppercase;color:var(--accent,var(--burgundy));font-weight:600;}
.gcard h3{font-family:var(--display);font-weight:500;font-size:1.25rem;line-height:1.2;margin:6px 0 8px;}
.gcard h3 a{color:inherit;}
.gcard p{font-size:.85rem;opacity:.72;line-height:1.5;margin:0;}

/* single article */
.art-head{max-width:720px;margin:0 auto;padding:52px 24px 30px;text-align:center;}
.art-head .eyebrow{color:var(--accent,var(--burgundy));}
.art-head h1{font-family:var(--display);font-weight:400;font-size:clamp(2.1rem,5.2vw,3.1rem);line-height:1.1;margin:16px 0 18px;}
.art-head .dek{font-family:var(--display);font-style:italic;font-size:1.2rem;line-height:1.5;opacity:.82;max-width:42ch;margin:0 auto;}
.art-meta{display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap;margin-top:24px;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;opacity:.6;}
.art-meta .dot{width:4px;height:4px;border-radius:50%;background:var(--accent,var(--burgundy));}
.art-hero{max-width:1000px;margin:14px auto 0;padding:0 24px;}
.art-hero img{width:100%;max-height:480px;object-fit:cover;}
.art-body{max-width:640px;margin:0 auto;padding:40px 24px 20px;font-size:1.08rem;line-height:1.8;}
.art-body p{margin:0 0 1.3em;}
.art-body > p:first-of-type::first-letter{font-family:var(--display);font-weight:500;float:left;font-size:3.6rem;line-height:.78;padding:6px 10px 0 0;color:var(--accent,var(--burgundy));}
.art-body h2{font-family:var(--display);font-weight:500;font-size:1.55rem;line-height:1.2;margin:1.6em 0 .5em;}
.art-body h3{font-family:var(--display);font-weight:500;font-size:1.25rem;margin:1.4em 0 .4em;}
.art-body blockquote{font-family:var(--display);font-style:italic;font-weight:400;font-size:1.55rem;line-height:1.35;color:var(--accent,var(--burgundy));border-left:2px solid var(--accent,var(--burgundy));padding:6px 0 6px 24px;margin:1.6em 0;}
.art-body a{color:var(--blue);text-decoration:underline;text-underline-offset:3px;}
.art-body img{margin:1.4em auto;}
.art-body ul,.art-body ol{margin:0 0 1.3em 1.2em;}
.art-foot{max-width:640px;margin:20px auto 0;padding:0 24px;}
.author{display:flex;gap:16px;align-items:center;border-top:1px solid var(--ink);border-bottom:1px solid var(--ink);padding:22px 0;}
.author .av{width:56px;height:56px;border-radius:50%;flex:none;background:var(--accent,var(--green));overflow:hidden;background-image:radial-gradient(70% 60% at 30% 25%,rgba(255,255,255,.3),transparent 60%);}
.author .av img{width:100%;height:100%;object-fit:cover;border-radius:50%;}
.author .a-name{font-family:var(--display);font-weight:500;font-size:1.1rem;}
.author .a-bio{font-size:.82rem;opacity:.72;line-height:1.45;margin-top:2px;}
.related{max-width:1000px;margin:52px auto 0;padding:0 24px;}
.related h4{font-family:var(--body-f);font-weight:700;font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--accent,var(--burgundy));border-bottom:1px solid var(--ink);padding-bottom:10px;margin-bottom:20px;}
.related .r3{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;}
.related .rimg{height:130px;margin-bottom:12px;background:var(--accent,var(--burgundy)) center/cover no-repeat;background-image:radial-gradient(70% 60% at 26% 18%,rgba(255,255,255,.14),transparent 60%);}
.related h5{font-family:var(--display);font-weight:500;font-size:1.1rem;line-height:1.2;margin:0;}
.related .m{font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;color:var(--accent,var(--burgundy));font-weight:600;margin-bottom:4px;}

/* generic page */
.page-body{max-width:720px;margin:0 auto;padding:52px 24px;}
.page-body h1{font-family:var(--display);font-weight:400;font-size:2.4rem;margin-bottom:20px;}
.page-body{font-size:1.05rem;line-height:1.8;}

/* newsletter band */
.band{background:var(--black);color:var(--white);text-align:center;padding:56px 24px;margin-top:60px;position:relative;}
.band::before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--soul) 0 33.33%,var(--mind) 33.33% 66.66%,var(--body) 66.66% 100%);}
.band .geo{font-family:var(--geo);color:var(--white);font-size:2rem;line-height:1;}
.band h3{font-family:var(--display);font-weight:400;font-size:clamp(1.6rem,4.4vw,2.3rem);margin:12px 0 10px;}
.band p{opacity:.82;max-width:42ch;margin:0 auto 20px;font-size:.95rem;}
.band form,.band .field{display:flex;gap:8px;max-width:430px;margin:0 auto;}
.band input{flex:1;border:none;padding:13px 16px;font-family:var(--body-f);background:var(--white);color:var(--ink);}
.band button,.band .go{background:var(--burgundy);color:var(--white);border:none;padding:13px 22px;font-family:var(--body-f);font-weight:700;font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;cursor:pointer;}

/* footer */
.site-foot{background:var(--black);color:var(--white);padding:50px 0 40px;}
.foot-grid{max-width:1160px;margin:0 auto;padding:0 24px;display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr 1fr;gap:26px;}
.foot-grid .geo{font-family:var(--geo);color:var(--white);font-size:2rem;line-height:1;}
.foot-grid .tag{font-family:var(--display);font-style:italic;opacity:.8;margin-top:10px;font-size:.92rem;max-width:24ch;}
.foot-col h6{font-family:var(--body-f);font-weight:700;font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;margin-bottom:12px;}
.fc-soul h6{color:#C77784;} .fc-mind h6{color:#7B9BD0;} .fc-body h6{color:#6FB39C;}
.foot-col.fc-plain h6{color:rgba(255,255,255,.6);}
.foot-col a{display:block;font-size:.84rem;opacity:.7;padding:5px 0;}
.foot-col a:hover{opacity:1;}
.foot-base{max-width:1160px;margin:34px auto 0;padding:18px 24px 0;border-top:1px solid rgba(255,255,255,.18);display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;font-size:.7rem;letter-spacing:.08em;opacity:.5;}

/* pagination + misc */
.pagination{max-width:1160px;margin:0 auto 60px;padding:0 24px;display:flex;gap:10px;font-weight:600;font-size:.8rem;}
.pagination a,.pagination span{border:1px solid var(--ink);padding:8px 14px;}
.pagination .current{background:var(--ink);color:var(--white);}

@media (max-width:860px){
  .hero{grid-template-columns:1fr;}
  .hero-txt{border-left:none;border-top:1px solid var(--ink);}
  .hero-img{min-height:280px;}
  .feature{grid-template-columns:1fr;}
  .trio,.grid3,.related .r3{grid-template-columns:1fr;}
  .foot-grid{grid-template-columns:1fr 1fr;}
  .head-nav > ul{gap:20px;overflow-x:auto;}
}
@media (max-width:600px){
  .triptych{grid-template-columns:1fr;}
  .hero-txt{padding:30px 22px;}
  .realm-head .rname{font-size:2rem;}
  .foot-grid{grid-template-columns:1fr;}
}
