:root {
    --tl-ink: #3f352b;
    --tl-brown: #5a4a35;
    --tl-gold: #b89968;
    --tl-gold-dark: #8e7349;
    --tl-cream: #faf7f1;
    --tl-line: #e8dfd1;
}
body.home footer.site-footer,
body.blog-page footer.site-footer,
body.blog-article footer.site-footer { margin-top:0; }

.skip-link {
    position: fixed;
    left: 16px;
    top: -80px;
    z-index: 100000;
    padding: 12px 18px;
    background: var(--tl-brown);
    color: #fff;
    border-radius: 4px;
}
.skip-link:focus { top: 16px; color: #fff; }
.footer-links { display:flex; justify-content:center; gap:12px; margin:0 0 10px; }
.footer-links a { color:#d4b88c; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }

.home-eyebrow,
.blog-eyebrow {
    margin: 0 0 12px;
    color: var(--tl-gold-dark);
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: 2.4px;
    text-transform: uppercase;
}
.hero-section .home-title {
    max-width: 930px;
    margin: 0 auto 18px;
    color: var(--tl-brown);
    font-size: clamp(2rem, 5vw, 3.15rem);
    font-weight: 400;
    line-height: 1.15;
    text-align: center;
}
.home-hero-lead {
    max-width: 780px;
    margin: 0 auto 36px;
    color: #5e554c;
    font-size: 1.05rem;
    text-align: center;
}
.seo-overview { padding: 78px 0; background: var(--tl-cream); }
.seo-overview-grid { display:grid; grid-template-columns:minmax(0, 1.25fr) minmax(280px, .75fr); gap:52px; align-items:start; }
.seo-kicker { color:var(--tl-gold-dark); font-size:.78rem; font-weight:700; letter-spacing:2px; text-transform:uppercase; }
.seo-overview h2,
.home-blog h2 { color:var(--tl-brown); font-size:clamp(1.75rem, 4vw, 2.35rem); line-height:1.25; font-weight:400; }
.seo-overview p { color:#554d45; line-height:1.85; }
.seo-checklist { margin:0; padding:28px; list-style:none; background:#fff; border:1px solid var(--tl-line); border-radius:14px; box-shadow:0 18px 48px rgba(90,74,53,.08); }
.seo-checklist li { position:relative; padding:0 0 18px 28px; color:#554d45; }
.seo-checklist li:last-child { padding-bottom:0; }
.seo-checklist li::before { content:'✓'; position:absolute; left:0; top:0; color:var(--tl-gold-dark); font-weight:900; }
.home-blog { padding:80px 0; background:#fff; }
.section-heading { max-width:760px; margin:0 auto 42px; text-align:center; }
.section-heading p { color:#665e56; }
.home-faq-list { max-width:780px; margin:0 auto 38px; text-align:left; }
.home-faq-list details { margin-bottom:10px; background:#fff; border:1px solid var(--tl-line); border-radius:8px; }
.home-faq-list summary { padding:17px 20px; color:var(--tl-brown); font-weight:700; cursor:pointer; }
.home-faq-list p { margin:0; padding:0 20px 18px; color:#655d55; }

.blog-grid { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:24px; }
.blog-card { display:flex; min-height:100%; flex-direction:column; overflow:hidden; color:inherit; background:#fff; border:1px solid var(--tl-line); border-radius:14px; box-shadow:0 16px 44px rgba(68,51,34,.07); transition:transform .25s ease, box-shadow .25s ease; }
.blog-card:hover { color:inherit; transform:translateY(-5px); box-shadow:0 22px 54px rgba(68,51,34,.13); }
.blog-cover { position:relative; aspect-ratio:16 / 9; overflow:hidden; background:#f3e5cf; }
.blog-cover img { width:100%; height:100%; object-fit:cover; transition:transform .45s ease; }
.blog-card:hover .blog-cover img { transform:scale(1.035); }
.blog-card-body { display:flex; flex:1; flex-direction:column; padding:24px; }
.blog-card-meta { margin-bottom:10px; color:var(--tl-gold-dark); font-size:.76rem; font-weight:700; letter-spacing:1px; text-transform:uppercase; }
.blog-card h2,
.blog-card h3 { margin:0 0 12px; color:var(--tl-brown); font-size:1.25rem; line-height:1.35; }
.blog-card p { margin:0 0 18px; color:#655d55; line-height:1.7; }
.blog-card-link { margin-top:auto; color:var(--tl-gold-dark); font-size:.85rem; font-weight:800; letter-spacing:.8px; text-transform:uppercase; }

.blog-hero { padding:82px 0 72px; background:linear-gradient(135deg, #faf7f1 0%, #f3e5cf 100%); text-align:center; }
.blog-hero h1 { max-width:900px; margin:0 auto 18px; color:var(--tl-brown); font-size:clamp(2.2rem, 5vw, 3.8rem); font-weight:400; line-height:1.15; }
.blog-hero p { max-width:760px; margin:0 auto; color:#62584e; font-size:1.08rem; }
.blog-index { padding:70px 0 90px; }
.blog-index .blog-grid { grid-template-columns:repeat(2, minmax(0, 1fr)); max-width:980px; margin:0 auto; }

.breadcrumbs { margin:0 0 28px; color:#75695d; font-size:.86rem; }
.breadcrumbs ol { display:flex; flex-wrap:wrap; gap:8px; margin:0; padding:0; list-style:none; }
.breadcrumbs li:not(:last-child)::after { content:'›'; margin-left:8px; color:#aa967a; }
.breadcrumbs a { color:#75695d; text-decoration:underline; text-underline-offset:3px; }

.article-hero { padding:56px 0 50px; background:linear-gradient(135deg, #faf7f1, #f3e5cf); }
.article-hero-inner { max-width:930px; margin:0 auto; }
.article-hero h1 { max-width:860px; margin:12px 0 18px; color:var(--tl-brown); font-size:clamp(2.2rem, 5.4vw, 3.75rem); font-weight:400; line-height:1.12; }
.article-lead { max-width:780px; margin:0 0 22px; color:#564d44; font-size:1.12rem; line-height:1.75; }
.article-meta { display:flex; flex-wrap:wrap; gap:10px 24px; color:#75695d; font-size:.85rem; }
.article-layout { display:grid; grid-template-columns:minmax(0, 760px) minmax(220px, 290px); gap:70px; align-items:start; max-width:1130px; margin:0 auto; padding:66px 20px 90px; }
.article-content { color:#403a34; font-size:1.03rem; line-height:1.86; }
.article-content h2 { margin:46px 0 15px; color:var(--tl-brown); font-size:1.75rem; line-height:1.3; font-weight:500; }
.article-content h2:first-child { margin-top:0; }
.article-content p { margin:0 0 20px; }
.article-content ul { margin:0 0 26px; padding-left:22px; }
.article-content li { margin-bottom:10px; padding-left:5px; }
.article-feature-image { margin:0 0 42px; overflow:hidden; border-radius:14px; background:#f7ecd6; box-shadow:0 18px 46px rgba(68,51,34,.1); }
.article-feature-image img { width:100%; height:auto; }
.article-feature-image figcaption { padding:12px 18px; color:#70665c; font-size:.82rem; line-height:1.5; }
.article-note { margin:34px 0; padding:24px 26px; background:var(--tl-cream); border-left:4px solid var(--tl-gold); border-radius:0 8px 8px 0; color:#51483f; }
.article-sidebar { position:sticky; top:98px; }
.article-toc,
.article-cta { margin-bottom:24px; padding:24px; background:#fff; border:1px solid var(--tl-line); border-radius:12px; }
.article-toc strong,
.article-cta strong { display:block; margin-bottom:12px; color:var(--tl-brown); }
.article-toc ul { margin:0; padding:0; list-style:none; }
.article-toc li { margin:0 0 9px; }
.article-toc a { color:#665a4d; font-size:.9rem; text-decoration:underline; text-decoration-color:#d9c7ac; text-underline-offset:4px; }
.article-cta { background:var(--tl-brown); color:#efe6da; }
.article-cta strong { color:#fff; }
.article-cta a { display:inline-block; margin-top:10px; padding:10px 16px; background:var(--tl-gold); color:#fff; border-radius:3px; font-size:.8rem; font-weight:800; letter-spacing:1px; text-transform:uppercase; }
.article-faq { margin-top:52px; }
.article-faq details { margin-bottom:10px; border:1px solid var(--tl-line); border-radius:8px; background:#fff; }
.article-faq summary { padding:17px 20px; color:var(--tl-brown); font-weight:700; cursor:pointer; }
.article-faq details p { padding:0 20px 18px; margin:0; color:#5e554c; }
.article-sources { margin-top:48px; padding-top:28px; border-top:1px solid var(--tl-line); font-size:.91rem; }
.article-sources h2 { margin-top:0; font-size:1.35rem; }
.article-sources a { word-break:break-word; text-decoration:underline; text-underline-offset:3px; }
.article-disclaimer { margin-top:40px; padding:18px 20px; background:#f7f4ef; border-radius:8px; color:#6d6359; font-size:.88rem; }
.related-articles { padding:70px 0; background:var(--tl-cream); }
.related-articles h2 { margin:0 0 30px; color:var(--tl-brown); font-size:1.8rem; font-weight:400; text-align:center; }

@media (max-width: 900px) {
    .seo-overview-grid,
    .article-layout { grid-template-columns:1fr; }
    .article-layout { gap:36px; }
    .article-sidebar { position:static; }
    .blog-grid { grid-template-columns:repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 640px) {
    .blog-grid,
    .blog-index .blog-grid { grid-template-columns:1fr; }
    .blog-hero,
    .article-hero { padding:54px 0 46px; }
    .article-layout { padding-top:42px; }
    .blog-cover { min-height:160px; }
    .seo-overview,
    .home-blog { padding:58px 0; }
}