/* Blog hub + single post — from blog-hub.html + blog-post.html mockups (#66/#67); chrome stripped, deduped. */
/* --- from blog-hub.html --- */
h1, h2, h3 {font-family:"DM Serif Display",Georgia,serif; line-height:1.1; margin:0; color:var(--head-brown);}
.section--night h2, .section--night h3, .section--dusk h2, .section--dusk h3, .hero h1 {color:#F6EFDD;}
p {margin:0;}
a {color:inherit; text-decoration:none;}
img {max-width:100%; display:block;}
:focus-visible {outline:2px solid var(--gold-base); outline-offset:3px; border-radius:2px;}
.wrap {max-width:1180px; margin:0 auto; padding:0 24px; position:relative; z-index:2;}
.eyebrow {font-size:13.5px; font-weight:600; letter-spacing:.2em; text-transform:uppercase; color:var(--gold-hover);}
.section--night .eyebrow, .section--dusk .eyebrow, .hero .eyebrow {color:var(--gold-soft);}
.section {padding:80px 0; position:relative;}
.section--warm {background:var(--parch);}
.section--warm::before {content:""; position:absolute; top:0; left:0; right:0; height:140px; background:radial-gradient(620px 150px at 50% 0,rgba(201,154,59,.16),transparent 70%), linear-gradient(180deg,rgba(18,20,28,.20),transparent); pointer-events:none;}
.section--night {background:var(--night); color:#F2E8D4;}
.section--dusk {background:linear-gradient(180deg,var(--dusk),var(--night-2)); color:#F2E8D4;}
.bokeh {position:absolute; inset:0; overflow:hidden; pointer-events:none; z-index:1;}
.bokeh i {position:absolute; border-radius:50%; filter:blur(7px); opacity:.5;}
.btn {display:inline-flex; align-items:center; justify-content:center; gap:9px; font-weight:600; font-size:15px; padding:14px 26px; border-radius:999px; border:1.5px solid transparent; cursor:pointer; font-family:inherit; transition:background .18s,color .18s,border-color .18s,transform .18s;}
.btn:active {transform:translateY(1px);}
.btn-gold {background:var(--gold-base); color:#3A2A0C;}
.btn-gold:hover {background:var(--gold-hover); color:#fff3de;}
.btn-ghost {background:transparent; color:#F3E9D2; border-color:rgba(243,233,210,.45);}
.btn-ghost:hover {border-color:var(--gold-soft); color:#fff;}
.btn-dark {background:var(--head-brown); color:#F6EFDD;}
.btn-dark:hover {background:#2a1c10;}
.btn-lg {padding:16px 30px; font-size:16px;}
@keyframes tw {0%,100%{opacity:1;}45%{opacity:.45;}70%{opacity:.85;}}
.ico {width:26px; height:26px; display:block;}
.ico-sm {width:20px; height:20px; display:block; color:var(--gold-hover); filter:drop-shadow(0 0 2px rgba(201,154,59,.4));}
.icowrap {width:58px; height:58px; border-radius:50%; display:grid; place-items:center; flex:none;
    color:var(--gold-hover);
    background:radial-gradient(circle at 34% 30%,#ffffff,var(--gold-50));
    border:1px solid var(--gold-soft);
    box-shadow:0 8px 20px -10px rgba(201,154,59,.55), 0 0 0 5px rgba(201,154,59,.05);}
.icowrap .ico {filter:drop-shadow(0 0 3px rgba(201,154,59,.45));}
.section--night .icowrap, .section--dusk .icowrap {color:var(--gold-soft);
    background:radial-gradient(circle at 34% 30%,rgba(230,207,150,.20),rgba(201,154,59,.05));
    border:1px solid rgba(230,207,150,.42);
    box-shadow:0 0 24px rgba(201,154,59,.32), inset 0 0 14px rgba(230,207,150,.12);}
.section--night .icowrap .ico, .section--dusk .icowrap .ico {filter:drop-shadow(0 0 7px rgba(230,207,150,.75));}
.hero {position:relative; overflow:hidden; color:#F6EFDD;}
.hero-bg {position:absolute; inset:0; background:radial-gradient(1000px 540px at 22% -10%,rgba(201,154,59,.22),transparent 60%), radial-gradient(720px 500px at 86% 6%,rgba(185,28,28,.16),transparent 62%), linear-gradient(180deg,#181B24,#14161E 62%,#0E1016);}
.hero-grid {position:relative; z-index:3; display:grid; grid-template-columns:1.02fr .98fr; gap:50px; align-items:center; padding:54px 0 60px;}
.hero-inner {max-width:560px;}
.hero-media {aspect-ratio:5/4; border-radius:20px; background:var(--hero-img,none) center/cover no-repeat, var(--glow-tile); border:1px solid rgba(230,207,150,.2); box-shadow:0 36px 80px -34px rgba(0,0,0,.7); position:relative; overflow:hidden;}
.hero-media::after {content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 58%,rgba(20,16,10,.34));}
.crumbs {font-size:14px; color:#B6A988; letter-spacing:.04em; margin-bottom:6px;}
.crumbs a:hover {color:var(--gold-soft);}
.crumbs span {color:#6f6650;}
.hero h1 {font-size:clamp(33px,4.8vw,56px); letter-spacing:-.01em; margin-top:14px; text-shadow:0 2px 40px rgba(0,0,0,.5);}
.hero .lede {font-size:clamp(16px,1.6vw,18.5px); color:#E7DCC6; margin:20px 0 0; max-width:600px;}
.hero-cta {display:flex; gap:13px; flex-wrap:wrap; margin-top:30px;}
.hero-trust {display:flex; gap:9px 22px; flex-wrap:wrap; margin-top:26px; font-size:13px; color:#CDBF9F;}
.hero-trust span {display:inline-flex; align-items:center; gap:8px;}
.hero-trust .dot {width:5px;height:5px;border-radius:50%;background:var(--gold-base);}
.head-block {max-width:680px; margin:0 auto 48px; text-align:center;}
.head-block h2 {font-size:clamp(27px,3.4vw,42px); margin-top:12px;}
.head-block p {color:var(--text-muted); margin-top:13px; font-size:16px;}
.section--night .head-block p, .section--dusk .head-block p {color:#C9BCA1;}
.split {display:grid; grid-template-columns:1.15fr .85fr; gap:46px; align-items:start;}
.split .lead-line {font-family:"DM Serif Display"; font-size:18px; color:var(--head-brown); line-height:1.4;}
.split p {color:var(--text-muted); font-size:15.5px;}
.split p + p {margin-top:14px;}
.glance {background:var(--parch-raised); border:1px solid var(--parch-border); border-radius:18px; padding:26px 26px; box-shadow:0 22px 50px -34px rgba(40,28,14,.4);}
.glance h3 {font-size:19px; color:var(--head-brown); margin-bottom:14px;}
.glance .row {display:flex; gap:13px; align-items:flex-start; padding:12px 0; border-top:1px solid var(--parch-divider);}
.glance .row:first-of-type {border-top:0;}
.glance .row b {display:block; font-size:14.5px; color:var(--head-brown);}
.glance .row span {font-size:13px; color:var(--text-muted);}
.scards {display:grid; grid-template-columns:repeat(3,1fr); gap:22px;}
.scard {background:var(--parch-raised); border:1px solid var(--parch-border); border-radius:18px; padding:30px 28px; transition:transform .18s, box-shadow .18s;}
.scard:hover {transform:translateY(-4px); box-shadow:0 26px 50px -30px rgba(40,28,14,.45);}
.scard .icowrap {margin-bottom:18px;}
.scard h3 {font-size:21px; color:var(--head-brown); margin-bottom:9px;}
.scard p {font-size:14.5px; color:var(--text-muted);}
.scard .more {display:inline-flex; gap:6px; margin-top:16px; color:var(--gold-hover); font-weight:600; font-size:14px;}
.why {display:grid; grid-template-columns:repeat(3,1fr); gap:36px 30px;}
.wcard {display:flex; gap:18px; align-items:flex-start;}
.wcard h3 {font-size:18px; color:#F6EFDD; margin-bottom:6px;}
.wcard p {font-size:14px; color:#C9BCA1;}
.gal {display:grid; grid-template-columns:repeat(4,1fr); grid-auto-rows:150px; gap:14px; grid-auto-flow:dense;}
.gal a {position:relative; border-radius:14px; overflow:hidden; background:var(--img,none) center/cover no-repeat, var(--glow-tile); box-shadow:0 18px 40px -28px rgba(40,28,14,.4); text-decoration:none;}
.gal a::after {content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 42%,rgba(20,16,10,.55)); transition:opacity .25s;}
.gal a:hover::after {opacity:.6;}
.gal .tall {grid-row:span 2;}
.gal .wide {grid-column:span 2;}
.cap {position:absolute; left:12px; bottom:12px; z-index:2; font-size:11.5px; letter-spacing:.02em; color:#F3E9D2; background:rgba(20,16,10,.5); border:1px solid rgba(230,207,150,.28); padding:4px 11px; border-radius:999px; backdrop-filter:blur(3px); display:inline-flex; align-items:center; gap:7px;}
.cap::before {content:""; width:6px; height:6px; border-radius:50%; background:#FFE7B0; box-shadow:0 0 6px 1px rgba(255,221,150,.9);}
.review-solo {max-width:760px; margin:46px auto 0; text-align:center;}
.review-solo .stars {color:var(--gold-base); letter-spacing:4px; font-size:17px;}
.review-solo p {font-family:"DM Serif Display"; font-size:clamp(19px,2.3vw,26px); color:var(--head-brown); line-height:1.45; margin:16px 0 14px;}
.review-solo .who {color:var(--text-muted); font-size:14px;}
.steps {display:grid; grid-template-columns:repeat(4,1fr); gap:26px;}
.step {position:relative; padding-top:12px;}
.step .n {font-family:"DM Serif Display"; font-size:46px; color:var(--gold-soft); line-height:1;}
.step h3 {font-size:20px; margin:12px 0 9px;}
.step p {font-size:14.5px; color:#C9BCA1;}
.step::before {content:""; position:absolute; top:22px; left:48px; right:-13px; height:1px; background:linear-gradient(90deg,var(--night-line),transparent);}
.step:last-child::before {display:none;}
.areas {display:flex; flex-wrap:wrap; gap:10px; justify-content:center; max-width:920px; margin:0 auto;}
.pill {font-size:13.5px; color:#e7ddca; border:1px solid rgba(230,207,150,.28); border-radius:999px; padding:8px 16px; transition:border-color .15s,color .15s,background .15s;}
.pill:hover {border-color:var(--gold-soft); color:#fff; background:rgba(201,154,59,.12);}
.pill[aria-current] {background:rgba(201,154,59,.16); border-color:var(--gold-soft); color:#fff;}
.faq {max-width:790px; margin:0 auto;}
.faq details {border-bottom:1px solid var(--parch-divider); padding:6px 0;}
.faq summary {list-style:none; cursor:pointer; padding:18px 40px 18px 4px; position:relative; font-family:"DM Serif Display"; font-size:19px; color:var(--head-brown);}
.faq summary::-webkit-details-marker {display:none;}
.faq summary::after {content:"+"; position:absolute; right:8px; top:50%; transform:translateY(-50%); font-family:"DM Sans"; font-size:24px; color:var(--gold-base);}
.faq details[open] summary::after {content:"–";}
.faq .ans {padding:0 4px 20px; color:var(--text-muted); font-size:15.5px; max-width:720px;}
.final {text-align:center; position:relative; overflow:hidden;}
.final .glow-bg {position:absolute; inset:0; background:radial-gradient(720px 400px at 50% 0,rgba(201,154,59,.26),transparent 60%), radial-gradient(620px 380px at 50% 120%,rgba(185,28,28,.18),transparent 60%);}
.final h2 {font-size:clamp(30px,4.4vw,50px); color:#fff;}
.final p {color:#D8CBB0; margin:16px auto 0; max-width:560px; font-size:16.5px;}
.final-cta {display:flex; gap:13px; justify-content:center; flex-wrap:wrap; margin-top:28px;}
.final .resp {margin-top:16px; font-size:13px; color:#B6A988;}
@media(max-width:980px) {
  .hero-grid {grid-template-columns:1fr; gap:30px;}
  .hero-media {aspect-ratio:16/10;}
  .split {grid-template-columns:1fr; gap:30px;}
  .scards, .gal {grid-template-columns:1fr 1fr;}
  .why {grid-template-columns:1fr 1fr;}
  .steps {grid-template-columns:1fr 1fr;}
  .step::before {display:none;}
  .section {padding:62px 0;}
}
@media(max-width:560px) {
  .scards, .why {grid-template-columns:1fr;}
  .steps {grid-template-columns:1fr;}
  .gal {grid-template-columns:1fr; grid-auto-rows:200px;}
  .gal .tall, .gal .wide {grid-column:auto; grid-row:auto;}
  .hero-cta .btn {flex:1;}
}
.choose {display:grid; grid-template-columns:repeat(2,1fr); gap:20px; max-width:920px; margin:0 auto;}
.ccard {display:flex; gap:20px; align-items:flex-start; background:rgba(255,247,230,.04); border:1px solid rgba(230,207,150,.18); border-radius:18px; padding:28px 26px; transition:transform .18s,border-color .18s,box-shadow .18s;}
.ccard:hover {transform:translateY(-4px); border-color:rgba(230,207,150,.4); box-shadow:0 0 30px rgba(201,154,59,.18);}
.ccard h3 {font-size:20px; color:#F6EFDD; margin-bottom:7px;}
.ccard p {font-size:14px; color:#C9BCA1;}
.ccard .more {display:inline-flex; gap:6px; margin-top:13px; color:var(--gold-soft); font-weight:600; font-size:13.5px;}
.choose-cta {text-align:center; margin-top:38px; color:#C9BCA1; font-size:15.5px;}
.choose-cta a {color:var(--gold-soft); font-weight:600;}
.choose-2nd {text-align:center; margin-top:12px; font-size:13.5px; color:#9c917c;}
.choose-2nd a {color:var(--gold-soft); font-weight:600;}
@media(max-width:680px) {
  .choose {grid-template-columns:1fr;}
}
.choose-cta {text-align:center; margin-top:38px; color:#C9BCA1; font-size:15px;}
.hero-simple {position:relative; text-align:center; padding:clamp(48px,5.5vw,74px) 0 clamp(42px,5vw,64px);}
.hero-simple .lede {margin-left:auto; margin-right:auto;}
.post-tag {display:inline-block; font-size:11px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--gold-hover); background:var(--gold-50); border:1px solid var(--parch-border); padding:5px 12px; border-radius:999px;}
.featured {display:grid; grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr); background:var(--parch-raised); border:1px solid var(--parch-border); border-radius:20px; overflow:hidden; box-shadow:0 26px 60px -34px rgba(40,28,14,.45); margin-bottom:44px; text-decoration:none;}
.featured .thumb {min-height:330px; background:var(--img,none) center/cover no-repeat, var(--glow-tile);}
.featured .body {padding:40px 44px; display:flex; flex-direction:column; justify-content:center;}
.featured h2 {font-size:clamp(24px,2.7vw,33px); color:var(--head-brown); margin:16px 0 12px; line-height:1.25;}
.featured p {color:var(--text-muted); font-size:15.5px; line-height:1.6;}
.featured .meta, .post-card .meta {margin-top:16px; font-size:12.5px; color:var(--text-muted); letter-spacing:.02em;}
.post-grid {display:grid; grid-template-columns:repeat(3,1fr); gap:26px;}
.post-card {display:flex; flex-direction:column; background:var(--parch-raised); border:1px solid var(--parch-border); border-radius:16px; overflow:hidden; text-decoration:none; transition:transform .2s, box-shadow .2s;}
.post-card:hover {transform:translateY(-3px); box-shadow:0 24px 54px -34px rgba(40,28,14,.5);}
.post-card .thumb {aspect-ratio:16/10; background:var(--img,none) center/cover no-repeat, var(--glow-tile);}
.post-card .body {padding:22px 24px 24px; display:flex; flex-direction:column; flex:1;}
.post-card h3 {font-size:18px; color:var(--head-brown); margin:12px 0 8px; line-height:1.32;}
.post-card p {font-size:13.5px; color:var(--text-muted); line-height:1.55; flex:1;}
@media(max-width:900px) {
  .post-grid {grid-template-columns:1fr 1fr;}
  .featured {grid-template-columns:minmax(0,1fr);}
  /* #262 -- featured thumb matches the card thumbs below */
  .featured .thumb {aspect-ratio:16/10; min-height:0;}
  .featured .body {padding:24px 24px 26px;}
}
@media(max-width:600px) {
  .post-grid {grid-template-columns:1fr;}
}
.post-head {max-width:760px; margin:0 auto; text-align:center;}
.post-head h1 {font-size:clamp(30px,4.4vw,48px); line-height:1.12; margin:16px 0 16px;}
.post-head .meta {color:var(--text-muted); font-size:13.5px; letter-spacing:.02em;}
.post-hero-img {max-width:1000px; margin:36px auto 0; aspect-ratio:16/8; border-radius:20px; background:var(--img,none) center/cover no-repeat, var(--glow-tile); border:1px solid var(--parch-border); box-shadow:0 34px 80px -40px rgba(40,28,14,.5);}
.article {max-width:720px; margin:0 auto;}
.article .lead {font-family:"DM Serif Display"; font-size:20px; line-height:1.55; color:var(--head-brown); margin-bottom:24px;}
.article p {font-size:16.5px; line-height:1.78; color:var(--text-base); margin-bottom:20px;}
.article h2 {font-family:"DM Serif Display"; font-size:26px; color:var(--head-brown); margin:38px 0 14px;}
.article h3 {font-size:19px; color:var(--head-brown); margin:26px 0 9px;}
.article ul {margin:0 0 22px 4px; list-style:none;}
.article li {position:relative; padding-left:26px; margin-bottom:11px; line-height:1.7; color:var(--text-base);}
.article li::before {content:"✦"; position:absolute; left:0; top:1px; color:var(--gold-base);}
.article blockquote {border-left:3px solid var(--gold-base); padding:4px 0 4px 22px; margin:28px 0; font-family:"DM Serif Display"; font-style:italic; font-size:20px; color:var(--head-brown); line-height:1.5;}
.article a {color:var(--gold-hover); text-decoration:underline; text-underline-offset:2px;}
.article img {width:100%; border-radius:14px; margin:26px 0;}
.post-cta {max-width:720px; margin:40px auto 0; background:linear-gradient(135deg,var(--parch-raised),#fff); border:1px solid var(--parch-border); border-left:4px solid var(--gold-base); border-radius:16px; padding:28px 32px; text-align:center;}
.post-cta h3 {font-size:20px; color:var(--head-brown); margin-bottom:8px;}
.post-cta p {color:var(--text-muted); font-size:14.5px; margin-bottom:18px;}
/* --- from blog-post.html --- */
@keyframes tw {0%,100%{opacity:1;}45%{opacity:.45;}70%{opacity:.85;}}
