:root{--deep-teal:#1E4951;--rich-gold:#D7BB51;--antique-gold:#AA8D3F;--charcoal:#171813;--cream:#F7F3EC;}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{font-family:'Manrope',sans-serif;color:var(--charcoal);background:#fff;line-height:1.5;}
img{max-width:100%;display:block;}







/* SCROLL-REVEAL ENTRANCE ANIMATIONS */
.js .reveal{opacity:0;transform:translateY(16px);transition:opacity .9s cubic-bezier(.16,1,.3,1),transform .9s cubic-bezier(.16,1,.3,1);}
.js .reveal.in-view{opacity:1;transform:translateY(0);}
@media (prefers-reduced-motion: reduce){.reveal{opacity:1!important;transform:none!important;transition:none!important;}}

/* HERO — identical to about.html / blog.html */
.hero{position:relative;height:100vh;height:100dvh;background:radial-gradient(circle, rgba(0,0,0,0) 0%, rgba(0,0,0,0.8) 100%), var(--hero-bg,none) center 30%/cover;display:flex;align-items:flex-end;padding:clamp(1.5rem,4vw,3.5rem) clamp(2.5rem,7vw,5.5rem);color:#fff;justify-content:flex-end;flex-direction:column;}
.hero-inner{max-width:1400px;margin:0 auto;width:100%;text-align:left;padding:0 clamp(1.5rem,5vw,3rem);padding-bottom:clamp(2rem,4vw,3.5rem);}
.hero h1,.hero .hero-title{font-family:'Playfair Display',serif;font-size:clamp(2.4rem,6.5vw,4.2rem);font-weight:500;margin-bottom:.4rem;text-shadow:0 2px 12px rgba(0,0,0,.25);opacity:0;animation:heroFadeUp .6s cubic-bezier(.16,1,.3,1) .05s forwards;}
.hero p{font-size:16px;font-family:'Manrope',sans-serif;font-weight:400;line-height:27px;max-width:480px;color:#fff;opacity:0;animation:heroFadeUp .6s cubic-bezier(.16,1,.3,1) .12s forwards;}
@keyframes heroFadeUp{from{opacity:0;transform:translateY(22px);}to{opacity:1;transform:translateY(0);}}
@media (prefers-reduced-motion: reduce){.hero h1,.hero .hero-title,.hero p{animation:none;opacity:1;}}

/* ARTICLE LAYOUT — Rule 2: no artificial min-height; content drives height */
.article-wrap{max-width:1500px;margin:0 auto;padding:clamp(3rem,6vw,5rem) clamp(2.5rem,7vw,5.5rem) clamp(4rem,7vw,6rem);display:grid;grid-template-columns:1fr 360px;gap:clamp(2.5rem,5vw,4.5rem);align-items:start;box-sizing:border-box;}
.article-meta{font-size:clamp(.8rem,1.4vw,.9rem);color:#6b6b66;margin-bottom:.9rem;}
.article-meta a{color:var(--deep-teal);text-decoration:none;font-weight:600;}
.article-title{font-family:'Playfair Display',serif;font-size:clamp(1.9rem,4.6vw,3.75rem);font-weight:500;line-height:1.22;letter-spacing:-.5px;color:var(--charcoal);margin-bottom:min(1.2rem, 2vh);}
.share-row{display:flex;align-items:center;gap:.8rem;margin-bottom:clamp(1.8rem,3vw,2.5rem);font-size:.85rem;color:#6b6b66;}
.share-row .share-icons{display:flex;gap:.55rem;}
.share-row a{width:30px;height:30px;border-radius:50%;background:var(--cream);display:flex;align-items:center;justify-content:center;color:var(--deep-teal);transition:all .3s;}
.share-row a svg{width:14px;height:14px;}
.share-row a:hover{background:var(--deep-teal);color:#fff;transform:translateY(-2px);}
.article-featured{width:100%;aspect-ratio:16/11;object-fit:cover;margin-bottom:clamp(1.8rem,3vw,2.5rem);}
.article-body p{font-size:16px;font-family:'Manrope',sans-serif;font-weight:400;line-height:27px;color:rgb(90, 90, 86);font-family:'Manrope',sans-serif;font-weight:400;line-height:27px;color:#4a4a45;line-height:1.9;margin-bottom:1.3rem;}

/* SIDEBAR — Rule 1: heading style on class, not tag */
.sidebar .section-heading{font-family:'Playfair Display',serif;font-size:clamp(1.4rem,2.4vw,1.9rem);font-weight:500;letter-spacing:-.3px;color:var(--charcoal);margin-bottom:clamp(1.6rem,3vw,2.2rem);}
.related-card{display:block;text-decoration:none;color:inherit;padding-bottom:clamp(1.4rem,2.5vw,1.8rem);margin-bottom:clamp(1.4rem,2.5vw,1.8rem);border-bottom:1px solid #eee;}
.related-card:last-child{border-bottom:none;margin-bottom:0;padding-bottom:0;}
.related-card-img{width:100%;aspect-ratio:16/10;overflow:hidden;margin-bottom:min(1rem, 2vh);}
.related-card-img img{width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.16,1,.3,1);}
.related-card:hover .related-card-img img{transform:scale(1.08);}
.related-card h3{font-family:'Playfair Display',serif;font-size:clamp(1rem,1.7vw,1.15rem);font-weight:600;line-height:1.35;margin-bottom:.5rem;color:var(--charcoal);}
.related-card p{font-size:16px;font-family:'Manrope',sans-serif;font-weight:400;line-height:27px;color:rgb(90, 90, 86);font-family:'Manrope',sans-serif;font-weight:400;line-height:27px;color:#6b6b66;line-height:1.6;margin-bottom:.8rem;}
.view-more{display:inline-flex;align-items:center;gap:.6rem;font-size:.85rem;font-weight:500;color:var(--deep-teal);text-decoration:none;width:fit-content;}
.view-more .vm-dash{width:22px;height:1px;background:var(--deep-teal);transition:background .3s ease,width .3s ease;}
.view-more .vm-circle{flex:none;width:26px;height:26px;border-radius:50%;border:1px solid var(--deep-teal);display:flex;align-items:center;justify-content:center;transition:background .3s ease,border-color .3s ease;}
.view-more svg{width:12px;height:12px;stroke:var(--deep-teal);fill:none;transition:stroke .3s ease,transform .3s ease;}
.view-more:hover{color:var(--antique-gold);}
.view-more:hover .vm-dash{background:var(--antique-gold);width:28px;}
.view-more:hover .vm-circle{border-color:var(--antique-gold);background:var(--antique-gold);}
.view-more:hover svg{stroke:#fff;transform:translateX(1px);}



/* RESPONSIVE */
@media (max-width:1024px){
  .article-wrap{grid-template-columns:1fr;}
  .sidebar{border-top:1px solid #eee;padding-top:2.5rem;margin-top:1rem;}
}

@media (max-width:480px){
  .hero{padding:1.5rem 1.25rem;justify-content:flex-end;flex-direction:column;}
  .hero p{max-width:100%;}
  .article-wrap{padding:2.5rem 1.25rem 3rem;}
  
}

/* REFERENCES */
.article-meta .meta-ref a{color:var(--deep-teal);text-decoration:underline;text-underline-offset:3px;}
.article-refs{margin-top:2rem;padding-top:1.4rem;border-top:1px solid rgba(23,24,19,.12);}
.article-refs h2{font-family:'Playfair Display',serif;font-size:1.2rem;font-weight:600;margin-bottom:.8rem;}
.article-refs ol{padding-left:1.2rem;}
.article-refs li{font-size:.9rem;line-height:1.7;color:#5a5a56;margin-bottom:.35rem;}
.article-refs a{color:var(--deep-teal);word-break:break-word;}
html,body{max-width:100%;overflow-x:hidden;}


@media (max-width:768px){.hero{background:radial-gradient(circle, rgba(0,0,0,0) 0%, rgba(0,0,0,0.8) 100%), var(--hero-bg-sm,var(--hero-bg,none)) center 30%/cover;}}