/* ENRJI inner pages + blog. Loaded after enrji-portfolio.css; reuses its tokens (--choc, --caramel, --cream ...). */
.pg-skip{position:absolute;left:-999px;top:0;background:var(--caramel);color:#fff;padding:10px 16px;z-index:99}.pg-skip:focus{left:12px;top:12px}
/* nav additions: active state, mobile menu */
.pf-nav nav a.on{color:var(--caramel)}
.pg-menu{display:none;background:none;border:2px solid var(--choc);border-radius:999px;width:44px;height:44px;cursor:pointer;position:relative}
.pg-menu span,.pg-menu span:before,.pg-menu span:after{position:absolute;left:11px;width:18px;height:2px;background:var(--choc);content:"";transition:transform .3s,top .3s}
.pg-menu span{top:20px}.pg-menu span:before{left:0;top:-6px}.pg-menu span:after{left:0;top:6px}
.pg-open .pg-menu span{background:transparent}.pg-open .pg-menu span:before{top:0;transform:rotate(45deg)}.pg-open .pg-menu span:after{top:0;transform:rotate(-45deg)}
@media(max-width:820px){
  .pg-menu{display:block}.pf-navin .pf-btn.sm{display:none}
  .pf-nav nav{display:flex;position:fixed;inset:68px 0 auto 0;flex-direction:column;gap:0;background:var(--cream);border-bottom:2px solid var(--choc);clip-path:inset(0 0 100% 0);transition:clip-path .45s cubic-bezier(.7,0,.2,1)}
  .pf-nav nav a{padding:16px 24px;border-top:1px solid rgba(50,24,15,.12);font-size:15px}
  .pg-open .pf-nav nav{clip-path:inset(0 0 0 0)}
}
/* breadcrumbs */
.pg-crumbs{font:700 12px var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--tan);margin-bottom:22px;display:flex;flex-wrap:wrap;gap:8px}
.pg-crumbs a{text-decoration:none;opacity:.8}.pg-crumbs a:hover{opacity:1;color:var(--caramel)}
/* page hero (variant of pf-hero) */
.pg-hero{background:radial-gradient(110% 90% at 80% 0%,var(--roast),var(--choc) 65%);color:var(--cream);overflow:hidden;position:relative}
.pg-hero .pf-wrap{padding-top:64px;padding-bottom:70px;position:relative;z-index:2}
.pg-hero h1{font-size:clamp(52px,9vw,138px);max-width:13ch}.pg-hero h1 em{font-style:normal;color:var(--caramel)}
.pg-hero p.pg-sub{max-width:600px;color:var(--tan);font-size:19px;margin:22px 0 0}
.pg-hero.light{background:var(--tan);color:var(--ink)}.pg-hero.light .pg-crumbs{color:var(--roast)}.pg-hero.light p.pg-sub{color:var(--roast)}
.pg-hero-art{position:absolute;right:4%;bottom:-6%;width:min(34vw,380px);z-index:1;filter:drop-shadow(0 26px 30px rgba(0,0,0,.45));animation:pgFloat 6s ease-in-out infinite}
@media(max-width:820px){.pg-hero-art{position:relative;right:auto;bottom:auto;width:min(64%,260px);margin:20px auto -40px}}
@keyframes pgFloat{0%,100%{transform:translateY(0) rotate(-4deg)}50%{transform:translateY(-16px) rotate(3deg)}}
.pg-sun{position:absolute;width:520px;height:520px;right:-140px;top:-160px;border-radius:50%;border:2px dashed rgba(184,108,53,.35);animation:pgSpin 60s linear infinite;z-index:0}
.pg-sun:after{content:"";position:absolute;inset:60px;border-radius:50%;border:2px solid rgba(184,108,53,.2)}
@keyframes pgSpin{to{transform:rotate(360deg)}}
/* split-word headline animation */
.pg-split .w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.06em}.pg-split .w>i{display:inline-block;font-style:inherit;transform:translateY(105%);transition:transform .9s cubic-bezier(.2,.8,.2,1)}
.pg-split.go .w>i{transform:none}
/* generic content */
.pg-sec{padding:84px 0}.pg-sec.alt{background:var(--tan)}.pg-sec.dk{background:var(--choc);color:var(--cream)}.pg-sec.rd{background:var(--roast);color:var(--cream)}
.pg-sec h2{font-size:clamp(40px,5.6vw,80px);margin-bottom:22px}.pg-sec h2 em{font-style:normal;color:var(--caramel)}
.pg-sec h3{font-size:28px;margin:0 0 10px}
.pg-prose{max-width:760px}.pg-prose p,.pg-prose li{font-size:18px}.pg-prose h2{font-size:clamp(34px,4.4vw,56px);margin:46px 0 14px}.pg-prose h3{font-size:26px;margin:30px 0 8px;color:var(--caramel)}
.pg-prose a{color:var(--caramel);text-underline-offset:3px}.pg-prose ul{padding-left:20px}.pg-prose li{margin:6px 0}
.pg-updated{font:700 12px var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--caramel)}
.pg-two{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center}
.pg-three{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.pg-four{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
@media(max-width:900px){.pg-four{grid-template-columns:1fr 1fr}}
@media(max-width:820px){.pg-two,.pg-three{grid-template-columns:1fr}}
.pg-card{background:var(--cream);color:var(--ink);border:2px solid var(--choc);border-radius:18px;padding:26px;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s}
.pg-card:hover{transform:translateY(-6px);box-shadow:8px 8px 0 var(--choc)}
.pg-card .n{font:500 54px/1 var(--disp);color:var(--caramel);display:block;margin-bottom:8px}
.pg-card p{margin:0}
.pg-stat{text-align:center;border:2px solid currentColor;border-radius:999px;aspect-ratio:1;display:grid;place-content:center;padding:10px}
.pg-stat b{font:500 clamp(46px,6vw,76px)/1 var(--disp);display:block}.pg-stat span{font-size:14px;opacity:.85}
.pg-img{border-radius:18px;border:2px solid var(--choc);overflow:hidden;background:var(--choc)}.pg-img img{width:100%;height:auto}
.pg-cta{background:var(--caramel);color:var(--choc);text-align:center;padding:90px 0;position:relative;overflow:hidden}
.pg-cta h2{font-size:clamp(48px,8vw,120px);margin-bottom:18px}.pg-cta p{max-width:540px;margin:0 auto 26px;font-size:18px}
.pg-cta .pf-btn{background:var(--choc)}
.pf-btn.ghost{background:transparent;border:2px solid currentColor;color:inherit}
/* marquee variants */
.pf-marquee.rev div{animation-direction:reverse}.pf-marquee.dk{background:var(--choc);color:var(--cream)}
/* animations: data-anim="up|left|right|zoom|blur|wipe|flip|tilt" ; data-stagger on a parent */
[data-anim]{transition:opacity .9s cubic-bezier(.2,.8,.2,1),transform .9s cubic-bezier(.2,.8,.2,1),filter .9s,clip-path 1.1s cubic-bezier(.7,0,.2,1);transition-delay:var(--d,0s)}
[data-anim=up]{opacity:0;transform:translateY(40px)}
[data-anim=left]{opacity:0;transform:translateX(-60px)}
[data-anim=right]{opacity:0;transform:translateX(60px)}
[data-anim=zoom]{opacity:0;transform:scale(.86)}
[data-anim=blur]{opacity:0;filter:blur(14px)}
[data-anim=wipe]{clip-path:inset(0 100% 0 0)}
[data-anim=flip]{opacity:0;transform:perspective(900px) rotateX(28deg) translateY(30px);transform-origin:50% 100%}
[data-anim=pop]{opacity:0;transform:scale(.6) rotate(-8deg)}
[data-anim].in{opacity:1;transform:none;filter:none}[data-anim=wipe].in{clip-path:inset(0 -10% 0 0)}
.pg-card[data-anim].in:hover{transform:translateY(-6px)}
/* FAQ accordion */
.pg-faq details{border-bottom:2px solid var(--choc);padding:4px 0}
.pg-faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:20px;align-items:center;padding:20px 0;font:500 clamp(24px,2.6vw,34px)/1.05 var(--disp);text-transform:uppercase}
.pg-faq summary::-webkit-details-marker{display:none}
.pg-faq summary:after{content:"+";font:400 34px var(--body);color:var(--caramel);transition:transform .35s;flex:none}
.pg-faq details[open] summary:after{transform:rotate(45deg)}
.pg-faq .a{overflow:hidden;transition:height .4s cubic-bezier(.2,.8,.2,1)}.pg-faq .a p{margin:0 0 20px;max-width:720px;font-size:17px}
/* forms */
.pg-form{display:grid;gap:14px;max-width:620px}.pg-form label{font:700 12px var(--body);letter-spacing:.14em;text-transform:uppercase;display:grid;gap:6px}
.pg-form input,.pg-form select,.pg-form textarea{font:400 17px var(--body);padding:14px 16px;border:2px solid var(--choc);border-radius:12px;background:#fff;color:var(--ink);width:100%}
.pg-form input:focus,.pg-form select:focus,.pg-form textarea:focus{outline:3px solid var(--caramel);outline-offset:1px}
.pg-form .row{display:grid;grid-template-columns:1fr 1fr;gap:14px}@media(max-width:600px){.pg-form .row{grid-template-columns:1fr}}
.pg-form button{border:0;cursor:pointer;justify-self:start}
.pg-note{font-size:14px;opacity:.8}
/* product rows on shop */
.pg-prod{display:grid;grid-template-columns:200px 1fr auto;gap:26px;align-items:center;padding:26px 0;border-bottom:2px solid var(--choc)}
.pg-prod img{height:190px;width:auto;margin:auto;transition:transform .5s cubic-bezier(.2,.8,.2,1)}.pg-prod:hover img{transform:rotate(-6deg) scale(1.06)}
.pg-prod h3{font-size:40px;margin-bottom:6px}
@media(max-width:700px){.pg-prod{grid-template-columns:1fr;text-align:center}.pg-prod .pf-chips{justify-content:center}}
/* brand swatches */
.pg-swatch{border-radius:18px;border:2px solid var(--choc);overflow:hidden;cursor:pointer;background:none;padding:0;text-align:left;font:inherit;color:inherit;transition:transform .35s}
.pg-swatch:hover{transform:translateY(-6px) rotate(-1deg)}
.pg-swatch i{display:block;height:150px}.pg-swatch div{padding:14px 16px;background:var(--cream);color:var(--ink)}.pg-swatch b{display:block;font:500 26px var(--disp);text-transform:uppercase}.pg-swatch small{font-size:13px;opacity:.8}
.pg-toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,120px);background:var(--choc);color:var(--cream);padding:12px 20px;border-radius:999px;font:700 13px var(--body);letter-spacing:.1em;z-index:60;transition:transform .4s cubic-bezier(.2,.8,.2,1)}.pg-toast.show{transform:translate(-50%,0)}
.pg-type{border:2px solid var(--choc);border-radius:18px;padding:30px;background:var(--cream)}.pg-type .big{font:500 clamp(70px,10vw,150px)/.85 var(--disp);text-transform:uppercase;display:block}
/* process timeline */
.pg-steps{position:relative;padding-left:46px}.pg-steps:before{content:"";position:absolute;left:14px;top:6px;bottom:6px;width:3px;background:rgba(184,108,53,.3)}
.pg-steps .bar{position:absolute;left:14px;top:6px;width:3px;height:0;background:var(--caramel)}
.pg-steps li{list-style:none;position:relative;margin:0 0 40px}.pg-steps li:before{content:"";position:absolute;left:-41px;top:6px;width:20px;height:20px;border-radius:50%;background:var(--cream);border:3px solid var(--caramel)}
.pg-steps h3{font-size:32px;color:var(--caramel)}
/* site footer for inner pages */
.pg-foot{background:var(--ink);color:var(--tan);padding:70px 0 26px;font-size:15px}
.pg-foot .cols{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:30px}
.pg-foot h4{font:500 24px var(--disp);text-transform:uppercase;color:var(--cream);margin:0 0 14px}
.pg-foot a{display:block;text-decoration:none;padding:4px 0;color:var(--tan)}.pg-foot a:hover{color:var(--caramel)}
.pg-foot img.logo{height:42px;width:auto;filter:invert(93%) sepia(9%) saturate(300%) hue-rotate(340deg);margin-bottom:14px}
.pg-foot .bot{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;border-top:1px solid rgba(233,213,184,.2);margin-top:44px;padding-top:20px;font-size:13px}
@media(max-width:820px){.pg-foot .cols{grid-template-columns:1fr 1fr}}
/* added link row inside portfolio footer */
.pf-foot .pg-links{display:flex;flex-wrap:wrap;gap:16px}.pf-foot .pg-links a{text-decoration:none}.pf-foot .pg-links a:hover{color:var(--caramel)}
/* ===== BLOG ===== */
.bl-filters{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 34px}
.bl-filters button{font:700 12px var(--body);letter-spacing:.12em;text-transform:uppercase;padding:10px 16px;border:2px solid var(--choc);border-radius:999px;background:transparent;color:var(--choc);cursor:pointer;transition:background .25s,color .25s}
.bl-filters button.on,.bl-filters button:hover{background:var(--choc);color:var(--cream)}
.bl-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
@media(max-width:980px){.bl-grid{grid-template-columns:1fr 1fr}}@media(max-width:640px){.bl-grid{grid-template-columns:1fr}}
.bl-card{display:flex;flex-direction:column;text-decoration:none;color:var(--ink);background:var(--cream);border:2px solid var(--choc);border-radius:20px;overflow:hidden;transform-style:preserve-3d;transition:transform .2s ease-out,box-shadow .3s,opacity .4s}
.bl-card:hover{box-shadow:10px 10px 0 var(--caramel)}
.bl-card .th{aspect-ratio:16/10;background:var(--choc);display:grid;place-items:center;overflow:hidden;position:relative}
.bl-card .th img{height:86%;width:auto;object-fit:contain;transition:transform .6s cubic-bezier(.2,.8,.2,1)}.bl-card:hover .th img{transform:scale(1.08) rotate(-4deg)}
.bl-card .th.c1{background:radial-gradient(circle at 30% 20%,#5a2c1c,var(--choc))}.bl-card .th.c2{background:radial-gradient(circle at 70% 30%,#c98446,#8a4a22)}.bl-card .th.c3{background:radial-gradient(circle at 50% 0%,#c3342b,#6d130e)}.bl-card .th.c4{background:var(--tan)}
.bl-card .bd{padding:22px;display:flex;flex-direction:column;gap:10px;flex:1}
.bl-card .tag{font:700 11px var(--body);letter-spacing:.16em;text-transform:uppercase;color:var(--caramel)}
.bl-card h3{font-size:30px;line-height:.95}.bl-card p{margin:0;font-size:15px;opacity:.85}
.bl-card .meta{margin-top:auto;font-size:13px;opacity:.7}
.bl-card.hide{display:none}
.bl-feature{display:grid;grid-template-columns:1.1fr 1fr;border:2px solid var(--choc);border-radius:24px;overflow:hidden;text-decoration:none;color:var(--cream);background:var(--choc);margin-bottom:34px}
.bl-feature .th{background:radial-gradient(circle at 40% 40%,var(--caramel),var(--roast) 70%);display:grid;place-items:center;min-height:340px}.bl-feature .th img{width:70%;height:auto;animation:pgFloat 7s ease-in-out infinite}
.bl-feature .bd{padding:40px;display:flex;flex-direction:column;justify-content:center;gap:14px}.bl-feature h2{font-size:clamp(40px,4.6vw,66px)}
@media(max-width:820px){.bl-feature{grid-template-columns:1fr}}
/* blog post: editorial layout with theme switch (light / dark / warm) */
.bp{--bg:#fff;--fg:#1d1410;--mut:#6b5a50;--line:#e8dfd6;--acc:var(--caramel);--panel:#faf6f1}
.bp[data-theme=dark]{--bg:#17100c;--fg:#f2ebe3;--mut:#b9a99c;--line:#3a2a22;--panel:#211711}
.bp[data-theme=warm]{--bg:#f5f2e9;--fg:#241610;--mut:#6d5546;--line:#e2d3bd;--panel:#efe6d6}
.bp{background:var(--bg);color:var(--fg);transition:background .4s,color .4s}
.bp-progress{position:fixed;top:0;left:0;height:4px;background:var(--caramel);width:0;z-index:40}
.bp-head{max-width:760px;margin:0 auto;padding:60px 24px 10px}
.bp-head .cat{font:700 12px var(--body);letter-spacing:.18em;text-transform:uppercase;color:var(--acc)}
.bp-head h1{font-size:clamp(50px,8vw,100px);margin:14px 0 16px;color:var(--fg)}
.bp-head .dek{font-size:21px;line-height:1.45;color:var(--mut);margin:0 0 18px}
.bp-head .by{font-size:14px;color:var(--mut);display:flex;flex-wrap:wrap;gap:6px 16px;padding-bottom:20px;border-bottom:1px solid var(--line)}
.bp-cover{max-width:980px;margin:30px auto 0;padding:0 24px}
.bp-cover .box{border-radius:22px;overflow:hidden;aspect-ratio:21/10;display:grid;place-items:center;background:radial-gradient(circle at 30% 30%,var(--roast),var(--choc));position:relative}
.bp-cover .box img{height:88%;width:auto;filter:drop-shadow(0 20px 30px rgba(0,0,0,.5))}
.bp-cover figcaption{font-size:13px;color:var(--mut);margin-top:10px;text-align:center}
.bp-body{max-width:760px;margin:0 auto;padding:30px 24px 40px;font-size:19px;line-height:1.7}
.bp-body p{margin:0 0 20px}.bp-body a{color:var(--acc);text-underline-offset:3px}
.bp-body h2{font-size:clamp(36px,4.6vw,54px);margin:54px 0 16px;color:var(--fg);scroll-margin-top:90px}
.bp-body h2 .no{color:var(--acc);margin-right:10px}
.bp-body h3{font-size:28px;margin:30px 0 10px;color:var(--fg)}
.bp-body ul,.bp-body ol{padding-left:22px;margin:0 0 20px}.bp-body li{margin:6px 0}
.bp-body>p:first-of-type:first-letter{float:left;font:500 92px/.8 var(--disp);color:var(--acc);margin:8px 12px 0 0}
.bp-toc{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:22px 26px;margin:0 0 34px}
.bp-toc b{font:700 12px var(--body);letter-spacing:.16em;text-transform:uppercase;color:var(--acc)}
.bp-toc ol{margin:12px 0 0;padding-left:22px}.bp-toc a{color:var(--fg);text-decoration:none;font-size:17px}.bp-toc a:hover,.bp-toc a.on{color:var(--acc)}
.bp-quote{border-left:4px solid var(--acc);padding:6px 0 6px 22px;margin:30px 0;font:500 clamp(28px,3.4vw,40px)/1.05 var(--disp);text-transform:uppercase;color:var(--fg)}
.bp-callout{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:20px 24px;margin:26px 0;font-size:17px}.bp-callout b{color:var(--acc)}
.bp-table{width:100%;border-collapse:collapse;font-size:16px;margin:10px 0 24px}.bp-table th,.bp-table td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--line)}.bp-table th{font:700 12px var(--body);letter-spacing:.1em;text-transform:uppercase;color:var(--mut)}
.bp-wide{overflow-x:auto}
/* bar chart infographic */
.bp-chart{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:24px;margin:28px 0}
.bp-chart h4{font:500 26px var(--disp);text-transform:uppercase;margin:0 0 16px;color:var(--fg)}
.bp-chart .r{display:grid;grid-template-columns:150px 1fr 70px;gap:12px;align-items:center;margin:10px 0;font-size:15px}
.bp-chart .t{height:22px;background:var(--line);border-radius:999px;overflow:hidden}.bp-chart .t i{display:block;height:100%;width:0;background:var(--acc);border-radius:999px;transition:width 1.4s cubic-bezier(.2,.8,.2,1)}
.bp-chart .r.hi .t i{background:var(--pack-red,#a91f18)}
.bp-chart.in .t i{width:var(--w)}
.bp-chart .v{text-align:right;font-weight:700}.bp-chart figcaption{font-size:13px;color:var(--mut);margin-top:12px}
@media(max-width:600px){.bp-chart .r{grid-template-columns:96px 1fr 56px;font-size:13px}}
.bp-fin{text-align:center;font:500 54px var(--disp);text-transform:uppercase;color:var(--acc);margin:40px 0 10px}
.bp-author{max-width:760px;margin:0 auto 30px;padding:24px;display:flex;gap:18px;align-items:center;border:1px solid var(--line);border-radius:18px;background:var(--panel)}
.bp-author img{width:64px;height:64px;border-radius:50%;background:var(--choc);padding:10px}
.bp-author p{margin:2px 0 0;font-size:15px;color:var(--mut)}
.bp-sources{max-width:760px;margin:0 auto;padding:0 24px 30px;font-size:15px;color:var(--mut)}.bp-sources a{color:var(--acc)}
.bp-more{background:var(--panel);border-top:1px solid var(--line);padding:60px 0}
.bp-more h2{font-size:clamp(40px,5vw,64px);margin-bottom:24px;color:var(--fg)}
.bp-theme{position:fixed;right:18px;bottom:18px;z-index:30;display:flex;gap:4px;background:var(--panel);border:1px solid var(--line);border-radius:999px;padding:5px;box-shadow:0 8px 24px rgba(0,0,0,.12)}
.bp-theme button{border:0;background:transparent;color:var(--fg);font:700 11px var(--body);letter-spacing:.1em;text-transform:uppercase;padding:8px 12px;border-radius:999px;cursor:pointer}
.bp-theme button.on{background:var(--acc);color:#fff}
@media(prefers-reduced-motion:reduce){[data-anim]{opacity:1!important;transform:none!important;filter:none!important;clip-path:none!important}.pg-split .w>i{transform:none}.bp-chart .t i{width:var(--w)}}
/* fixes: link colour inheritance + hidden toast */
.pf a.pf-btn{color:#fff}.pf a.pf-btn.ghost{color:inherit}.pg-cta a.pf-btn{color:var(--cream)}
.bl-feature h2,.bl-feature p{color:var(--cream)}.bl-feature p{opacity:.85}
.bl-card h3{color:var(--ink)}.bp .bl-card h3{color:var(--ink)}
.pg-toast{visibility:hidden;opacity:0;transition:transform .4s cubic-bezier(.2,.8,.2,1),opacity .3s,visibility .3s}.pg-toast.show{visibility:visible;opacity:1}
.bp-head h1,.bp-body h2,.bp-body h3,.bp-more h2,.bp-chart h4{color:var(--fg)}
.pg-sec.dk h2,.pg-sec.rd h2,.pg-sec.dk h3,.pg-sec.rd h3,.pg-hero h1{color:var(--cream)}.pg-hero.light h1{color:var(--ink)}
.pg-sec.dk h2 em,.pg-sec.rd h2 em,.pg-hero h1 em{color:var(--caramel)}
.pg-cta h2{color:var(--choc)}
