/* WAZWOOD Blog Styles — wazwood-blog.css */
:root{
  --forest:#0F3D2E;--forest-d:#092618;--burgundy:#5B0F1F;
  --ivory:#FAF7F2;--gold:#C8A96B;--sage:#A7B89A;--wood:#7A5A3A;
  --ff-h:'Playfair Display',Georgia,serif;--ff-b:'Poppins',sans-serif;
}

/* ── BREADCRUMB ───────────────────────── */
.blog-bc{background:#FAF7F2;border-bottom:1px solid rgba(15,61,46,.08);padding:14px 48px;font-family:var(--ff-b);font-size:11px;font-weight:400;letter-spacing:.5px;color:rgba(15,61,46,.55)}
.blog-bc a{color:var(--forest);text-decoration:none;transition:color .2s}
.blog-bc a:hover{color:var(--gold)}
.blog-bc span{color:rgba(15,61,46,.4);margin:0 8px}
@media(max-width:768px){.blog-bc{padding:12px 24px}}

/* ── ARTICLE HERO ─────────────────────── */
.art-hero{position:relative;min-height:64vh;display:flex;align-items:flex-end;overflow:hidden}
.art-hero-bg{position:absolute;inset:0;background-size:cover;background-position:center;background-repeat:no-repeat;transform:scale(1.04);transition:transform 8s ease}
.art-hero:hover .art-hero-bg{transform:scale(1)}
.art-hero-ov{position:absolute;inset:0;background:linear-gradient(135deg,rgba(9,38,24,.85) 0%,rgba(15,61,46,.7) 50%,rgba(9,38,24,.8) 100%)}
.art-hero-fade{position:absolute;bottom:0;left:0;right:0;height:160px;background:linear-gradient(to bottom,transparent,#FAF7F2)}
.art-hero-content{position:relative;z-index:2;max-width:900px;margin:0 auto;padding:80px 48px 72px;width:100%}
.art-eyebrow{display:inline-flex;align-items:center;gap:10px;font-family:var(--ff-b);font-size:9px;font-weight:600;letter-spacing:4px;text-transform:uppercase;color:var(--gold);margin-bottom:20px}
.art-eyebrow::before{content:'';display:block;width:32px;height:1px;background:var(--gold)}
.art-h1{font-family:var(--ff-h);font-size:clamp(28px,4.5vw,54px);font-weight:700;color:#FAF7F2;line-height:1.2;letter-spacing:-.01em;margin:0 0 20px}
.art-meta{font-family:var(--ff-b);font-size:11px;font-weight:400;letter-spacing:1.5px;color:rgba(250,247,242,.55);display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.art-meta-dot{width:3px;height:3px;border-radius:50%;background:var(--gold);display:inline-block}
@media(max-width:768px){
  .art-hero-content{padding:60px 24px 56px}
  .art-h1{font-size:28px}
}

/* ── ARTICLE LAYOUT ───────────────────── */
.art-layout{background:#FAF7F2}
.art-main{max-width:860px;margin:0 auto;padding:64px 48px 80px}
@media(max-width:768px){.art-main{padding:40px 24px 60px}}

/* ── ARTICLE INTRO ────────────────────── */
.art-intro{font-family:var(--ff-b);font-size:17px;font-weight:300;color:rgba(15,61,46,.8);line-height:1.85;margin:0 0 48px;padding:0 0 40px;border-bottom:1px solid rgba(15,61,46,.1)}

/* ── ARTICLE TYPOGRAPHY ───────────────── */
.art-h2{font-family:var(--ff-h);font-size:clamp(22px,3vw,32px);font-weight:700;color:var(--forest);margin:52px 0 18px;letter-spacing:-.01em;line-height:1.25}
.art-h2:first-of-type{margin-top:0}
.art-h3{font-family:var(--ff-b);font-size:14px;font-weight:600;letter-spacing:2.5px;text-transform:uppercase;color:var(--burgundy);margin:32px 0 14px}
.art-p{font-family:var(--ff-b);font-size:15px;font-weight:300;color:rgba(15,61,46,.75);line-height:1.9;margin:0 0 20px}
.art-list{font-family:var(--ff-b);font-size:14px;font-weight:300;color:rgba(15,61,46,.75);line-height:1.8;margin:0 0 20px;padding-left:0;list-style:none}
.art-list li{position:relative;padding-left:24px;margin-bottom:8px}
.art-list li::before{content:'';position:absolute;left:0;top:10px;width:6px;height:6px;border-radius:50%;background:var(--gold)}

/* ── PULL QUOTE ───────────────────────── */
.pull-quote{margin:40px 0;padding:32px 40px;border-left:4px solid var(--gold);background:rgba(15,61,46,.04);border-radius:0 8px 8px 0}
.pull-quote p{font-family:var(--ff-h);font-size:clamp(17px,2.5vw,22px);font-weight:400;font-style:italic;color:var(--forest);line-height:1.6;margin:0}
@media(max-width:768px){.pull-quote{padding:24px 28px;margin:28px 0}}

/* ── COMPARISON TABLE ─────────────────── */
.comp-tbl-wrap{overflow-x:auto;margin:28px 0 36px;border-radius:12px;box-shadow:0 4px 24px rgba(15,61,46,.08)}
.comp-tbl{width:100%;border-collapse:collapse;font-family:var(--ff-b);font-size:13px;background:#fff;border-radius:12px;overflow:hidden}
.comp-tbl thead tr{background:var(--forest)}
.comp-tbl thead th{padding:16px 20px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;font-size:10px;color:#FAF7F2;text-align:left;white-space:nowrap}
.comp-tbl thead th:first-child{width:32%;min-width:160px}
.comp-tbl thead th:not(:first-child){text-align:center}
.comp-tbl tbody tr{border-bottom:1px solid rgba(15,61,46,.07);transition:background .2s}
.comp-tbl tbody tr:hover{background:rgba(15,61,46,.025)}
.comp-tbl tbody tr:last-child{border-bottom:none}
.comp-tbl td{padding:13px 20px;color:rgba(30,30,30,.75);vertical-align:middle;line-height:1.4}
.comp-tbl td:not(:first-child){text-align:center}
.comp-tbl td:first-child{font-weight:500;color:var(--forest);font-size:12px;letter-spacing:.3px}
.comp-tbl .yes{color:#0F3D2E;font-weight:500}
.comp-tbl .no{color:#8B1A2B;font-weight:500}
.comp-tbl .warn{color:#7A5A3A;font-weight:500}
.comp-tbl .hdr-waz{background:rgba(200,169,107,.12)!important;font-weight:700}
@media(max-width:600px){
  .comp-tbl{font-size:12px}
  .comp-tbl td,.comp-tbl th{padding:10px 12px}
}

/* ── SPEC TABLE ───────────────────────── */
.spec-tbl-wrap{overflow-x:auto;margin:24px 0 36px;border-radius:12px;box-shadow:0 4px 24px rgba(15,61,46,.08)}
.spec-tbl-art{width:100%;border-collapse:collapse;font-family:var(--ff-b);font-size:13px;background:#fff;border-radius:12px;overflow:hidden}
.spec-tbl-art thead tr{background:var(--forest)}
.spec-tbl-art thead th{padding:14px 20px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;font-size:10px;color:#FAF7F2;text-align:left}
.spec-tbl-art tbody tr{border-bottom:1px solid rgba(15,61,46,.07);transition:background .2s}
.spec-tbl-art tbody tr:hover{background:rgba(15,61,46,.025)}
.spec-tbl-art tbody tr:last-child{border-bottom:none}
.spec-tbl-art td{padding:12px 20px;color:rgba(30,30,30,.75);vertical-align:middle;line-height:1.4}
.spec-tbl-art td:first-child{font-weight:500;color:var(--forest);font-size:12px;letter-spacing:.3px;width:35%}
.spec-tbl-art td:last-child{font-family:var(--ff-b);font-size:11px;color:rgba(15,61,46,.4);text-align:right}
.spec-tbl-art td:nth-child(2){font-weight:500;color:rgba(30,30,30,.8)}

/* ── COST COMPARISON BLOCK ────────────── */
.cost-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin:28px 0 36px}
.cost-card{border-radius:12px;padding:28px 30px;position:relative;overflow:hidden}
.cost-card.cost-ply{background:rgba(91,15,31,.05);border:1px solid rgba(91,15,31,.12)}
.cost-card.cost-waz{background:rgba(15,61,46,.06);border:1px solid rgba(15,61,46,.15)}
.cost-card-title{font-family:var(--ff-b);font-size:10px;font-weight:700;letter-spacing:3px;text-transform:uppercase;margin-bottom:16px}
.cost-card.cost-ply .cost-card-title{color:var(--burgundy)}
.cost-card.cost-waz .cost-card-title{color:var(--forest)}
.cost-row{display:flex;justify-content:space-between;align-items:flex-start;padding:8px 0;border-bottom:1px solid rgba(15,61,46,.07);gap:12px}
.cost-row:last-child{border-bottom:none;margin-top:8px;padding-top:12px}
.cost-label{font-family:var(--ff-b);font-size:12px;color:rgba(30,30,30,.65);line-height:1.4}
.cost-val{font-family:var(--ff-b);font-size:12px;font-weight:600;white-space:nowrap}
.cost-card.cost-ply .cost-total .cost-val{color:var(--burgundy)}
.cost-card.cost-waz .cost-total .cost-val{color:var(--forest)}
.cost-save{background:rgba(15,61,46,.08);border:1px solid rgba(15,61,46,.15);border-radius:8px;padding:16px 20px;text-align:center;margin-top:24px}
.cost-save p{font-family:var(--ff-b);font-size:13px;font-weight:500;color:var(--forest);margin:0}
.cost-save strong{color:var(--gold)}
@media(max-width:600px){
  .cost-grid{grid-template-columns:1fr}
}

/* ── FAQ ──────────────────────────────── */
.art-faq{margin:48px 0 0}
.art-faq-title{font-family:var(--ff-h);font-size:26px;font-weight:700;color:var(--forest);margin:0 0 28px;padding:0 0 20px;border-bottom:1px solid rgba(15,61,46,.1)}
.art-faq-item{border-bottom:1px solid rgba(15,61,46,.08);padding:0}
.art-faq-q{font-family:var(--ff-b);font-size:14px;font-weight:600;color:var(--forest);padding:18px 44px 18px 0;cursor:pointer;position:relative;line-height:1.5;user-select:none}
.art-faq-q::after{content:'';position:absolute;right:4px;top:50%;transform:translateY(-50%) rotate(0deg);width:18px;height:18px;border:1.5px solid rgba(15,61,46,.3);border-radius:50%;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10' fill='none'%3E%3Cpath d='M2 3.5L5 6.5L8 3.5' stroke='%230F3D2E' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center;transition:transform .3s}
.art-faq-item.open .art-faq-q::after{transform:translateY(-50%) rotate(180deg)}
.art-faq-a{font-family:var(--ff-b);font-size:14px;font-weight:300;color:rgba(15,61,46,.7);line-height:1.85;max-height:0;overflow:hidden;transition:max-height .35s ease,padding .35s ease}
.art-faq-item.open .art-faq-a{max-height:300px;padding:0 0 18px}

/* ── ARTICLE CTA ──────────────────────── */
.art-cta{background:var(--forest);padding:64px 48px;text-align:center;margin:0}
.art-cta h2{font-family:var(--ff-h);font-size:clamp(24px,3vw,36px);font-weight:700;color:#FAF7F2;margin:0 0 14px}
.art-cta p{font-family:var(--ff-b);font-size:14px;font-weight:300;color:rgba(250,247,242,.65);margin:0 0 32px;max-width:540px;margin-left:auto;margin-right:auto;line-height:1.7}
.art-cta-btns{display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap}
@media(max-width:768px){.art-cta{padding:48px 24px}.art-cta-btns{flex-direction:column}}

/* ── RELATED BLOG CARDS ───────────────── */
.blog-related{padding:72px 48px;background:#FAF7F2;max-width:1200px;margin:0 auto}
.blog-related-title{font-family:var(--ff-h);font-size:28px;font-weight:700;color:var(--forest);margin:0 0 8px}
.blog-related-sub{font-family:var(--ff-b);font-size:12px;letter-spacing:2px;text-transform:uppercase;color:var(--gold);margin:0 0 36px}
.blog-rel-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.blog-rel-card{background:#fff;border-radius:12px;overflow:hidden;box-shadow:0 4px 24px rgba(15,61,46,.07);transition:transform .3s,box-shadow .3s;text-decoration:none;display:flex;flex-direction:column}
.blog-rel-card:hover{transform:translateY(-6px);box-shadow:0 16px 48px rgba(15,61,46,.12)}
.blog-rel-img{width:100%;height:180px;object-fit:cover;display:block}
.blog-rel-body{padding:24px;flex:1;display:flex;flex-direction:column}
.blog-rel-tag{font-family:var(--ff-b);font-size:9px;font-weight:700;letter-spacing:3px;text-transform:uppercase;color:var(--gold);margin-bottom:10px}
.blog-rel-title{font-family:var(--ff-h);font-size:17px;font-weight:600;color:var(--forest);line-height:1.35;margin:0 0 10px}
.blog-rel-desc{font-family:var(--ff-b);font-size:12px;font-weight:300;color:rgba(15,61,46,.6);line-height:1.7;flex:1;margin:0 0 16px}
.blog-rel-link{font-family:var(--ff-b);font-size:10px;font-weight:600;letter-spacing:2px;text-transform:uppercase;color:var(--forest);display:inline-flex;align-items:center;gap:6px;transition:gap .3s,color .2s;margin-top:auto}
.blog-rel-link:hover{color:var(--gold);gap:10px}
@media(max-width:900px){
  .blog-rel-grid{grid-template-columns:repeat(2,1fr)}
  .blog-related{padding:48px 24px}
}
@media(max-width:600px){
  .blog-rel-grid{grid-template-columns:1fr}
}

/* ── ARTICLE DIVIDER ──────────────────── */
.art-divider{width:60px;height:2px;background:var(--gold);margin:40px 0}

/* ── BLOG INDEX (optional) ────────────── */
.blog-index-hero{background:var(--forest);padding:100px 48px 80px;text-align:center}
.blog-index-hero h1{font-family:var(--ff-h);font-size:clamp(32px,5vw,60px);font-weight:700;color:#FAF7F2;margin:0 0 16px}
.blog-index-hero p{font-family:var(--ff-b);font-size:15px;font-weight:300;color:rgba(250,247,242,.65);max-width:540px;margin:0 auto}
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;max-width:1200px;margin:0 auto;padding:72px 48px}
@media(max-width:900px){.blog-grid{grid-template-columns:repeat(2,1fr);padding:48px 24px}}
@media(max-width:600px){.blog-grid{grid-template-columns:1fr}}
