﻿.bd-hero { padding-bottom: 100px; }
.bd-hero-meta { display:flex; align-items:center; gap:12px; margin-bottom:16px; flex-wrap:wrap; }
.bd-category { display:inline-block; padding:5px 12px; background:rgba(214,177,106,0.18); color:#d6b16a; border-radius:999px; font-size:11px; font-weight:900; letter-spacing:0.08em; text-transform:uppercase; }
.bd-hero h1 { font-size:clamp(26px,4vw,46px); font-weight:900; color:#fffaf0; margin:0 0 14px; line-height:1.1; }
.bd-hero-sub { color:rgba(255,250,240,0.6); font-size:14px; display:flex; gap:16px; flex-wrap:wrap; }
.bd-hero-sub span { display:flex; align-items:center; gap:6px; }
.bd-layout { display:grid; grid-template-columns:1fr 340px; gap:36px; align-items:start; }
.bd-layout > * { min-width: 0; }
.bd-article {
    background:#fffaf0; border:1px solid rgba(21,23,26,0.08);
    border-radius:12px; overflow:hidden;
    box-shadow:0 20px 48px rgba(21,23,26,0.07);
}
.bd-cover { width:100%; height:360px; object-fit:cover; display:block; }
.bd-content { padding:36px; }
.bd-content h2 { font-size:22px; font-weight:850; color:#15171a; margin:28px 0 12px; }
.bd-content h3 { font-size:18px; font-weight:800; color:#15171a; margin:22px 0 10px; }
.bd-content p { font-size:15px; color:#6f736f; line-height:1.8; margin-bottom:16px; }
.bd-content ul { padding-left:20px; margin-bottom:16px; }
.bd-content ul li { font-size:15px; color:#6f736f; line-height:1.8; margin-bottom:6px; }
.bd-content strong { color:#15171a; }
.bd-highlight {
    padding:20px 24px; background:rgba(214,177,106,0.1);
    border-left:3px solid #d6b16a; border-radius:0 8px 8px 0;
    margin:24px 0; font-size:15px; color:#15171a; font-weight:600;
    line-height:1.7;
}
.bd-divider { border:none; border-top:1px solid rgba(21,23,26,0.08); margin:32px 0; }
.bd-author { display:flex; align-items:center; gap:16px; padding:22px 36px; border-top:1px solid rgba(21,23,26,0.07); background:rgba(21,23,26,0.02); }
.bd-author-avatar { width:52px; height:52px; border-radius:50%; background:linear-gradient(135deg,#d6b16a,#7a612f); display:flex; align-items:center; justify-content:center; font-size:18px; font-weight:900; color:#15171a; flex-shrink:0; }
.bd-author strong { display:block; font-size:14px; color:#15171a; font-weight:800; }
.bd-author span { font-size:12px; color:#73695a; }
.bd-sidebar { display:flex; flex-direction:column; gap:20px; }
.bd-sidebar-card { background:#fffaf0; border:1px solid rgba(21,23,26,0.08); border-radius:10px; padding:22px; box-shadow:0 4px 20px rgba(21,23,26,0.05); }
.bd-sidebar-card h3 { font-size:14px; font-weight:900; color:#15171a; text-transform:uppercase; letter-spacing:0.08em; margin:0 0 14px; }
.bd-related-item { display:flex; gap:12px; padding:10px 0; border-bottom:1px solid rgba(21,23,26,0.06); }
.bd-related-item:last-child { border-bottom:none; padding-bottom:0; }
.bd-related-thumb { width:60px; height:50px; border-radius:6px; object-fit:cover; flex-shrink:0; background:#d8d2c4; }
.bd-related-item h4 { font-size:13px; font-weight:700; color:#15171a; margin:0 0 4px; line-height:1.3; }
.bd-related-item span { font-size:11px; color:#73695a; }
.bd-tags { display:flex; flex-wrap:wrap; gap:8px; }
.bd-tag { padding:6px 12px; background:rgba(21,23,26,0.06); border-radius:999px; font-size:12px; font-weight:700; color:#6f736f; text-decoration:none; transition:all 0.2s; }
.bd-tag:hover { background:#15171a; color:#fffaf0; }
.bd-cta-card { background:#15171a; border-radius:10px; padding:24px; text-align:center; }
.bd-cta-card h3 { color:#fffaf0; font-size:16px; margin:0 0 8px; }
.bd-cta-card p { color:rgba(255,250,240,0.6); font-size:13px; margin:0 0 16px; }
.bd-cta-btn { display:block; padding:12px; background:#d6b16a; color:#15171a; border-radius:8px; font-weight:800; font-size:13px; text-decoration:none; transition:background 0.2s; }
.bd-cta-btn:hover { background:#7a612f; color:#fffaf0; }
.bd-breadcrumb { display:flex; align-items:center; gap:8px; font-size:12px; color:rgba(255,250,240,0.5); margin-bottom:16px; flex-wrap:wrap; }
.bd-breadcrumb a { color:rgba(255,250,240,0.5); text-decoration:none; transition:color 0.2s; }
.bd-breadcrumb a:hover { color:#d6b16a; }
.bd-breadcrumb span { color:rgba(255,250,240,0.3); }
@media(max-width:900px){ .bd-layout{grid-template-columns:1fr;} }
