
:root{--g0:#0a1a0f;--g1:#0f2318;--g2:#163020;--g3:#1e4229;--g4:#2d6140;--g5:#37734e;--g6:#56a870;--g7:#8ecfa0;--g8:#c2e8cc;--g9:#eaf6ed;--cream:#f7f5f0;--ink:#0f1a13;--muted:#4a6254;--border:rgba(45,97,64,0.12);--border-strong:rgba(45,97,64,0.25);--serif:'Playfair Display',Georgia,serif;--sans:'DM Sans',system-ui,sans-serif;--mono:'DM Mono',monospace}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
body{font-family:var(--sans);background:var(--cream);color:var(--ink);font-size:16px;line-height:1.7;-webkit-font-smoothing:antialiased}
nav{position:fixed;top:0;left:0;right:0;z-index:100;background:rgba(247,245,240,0.92);backdrop-filter:blur(18px);border-bottom:1px solid var(--border)}
.nav-inner{max-width:1280px;margin:0 auto;padding:0 40px;height:64px;display:flex;align-items:center;justify-content:space-between;gap:40px}
.nav-logo{display:flex;align-items:center;gap:10px;text-decoration:none}
.logo-mark{width:32px;height:32px;background:var(--g3);border-radius:6px;display:flex;align-items:center;justify-content:center}
.logo-text{font-family:var(--serif);font-size:18px;font-weight:600;color:var(--g1);letter-spacing:-0.02em}.logo-text span{color:var(--g5)}
.nav-links{display:flex;align-items:center;gap:4px;list-style:none}
.nav-links a{font-size:13.5px;color:var(--muted);text-decoration:none;padding:6px 14px;border-radius:100px;transition:all 0.2s}
.nav-links a:hover{color:var(--g2);background:var(--g9)}
.nav-cta{font-size:13px;font-weight:500;color:var(--cream)!important;background:var(--g3)!important;padding:8px 18px!important;border-radius:100px!important}
.article-page{max-width:800px;margin:0 auto;padding:100px 40px 80px}
.breadcrumb{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--muted);margin-bottom:28px;font-family:var(--mono)}
.breadcrumb a{color:var(--muted);text-decoration:none}.breadcrumb span{color:var(--border-strong)}
.article-cat{font-family:var(--mono);font-size:10px;letter-spacing:0.1em;text-transform:uppercase;color:var(--g5);margin-bottom:16px;display:block}
h1{font-family:var(--serif);font-size:clamp(28px,3.5vw,46px);font-weight:600;line-height:1.15;letter-spacing:-0.025em;color:var(--g0);margin-bottom:20px}
.article-lead{font-size:18px;font-weight:300;color:var(--muted);line-height:1.75;margin-bottom:28px}
.byline{display:flex;align-items:center;gap:16px;padding:16px 0;border-top:1px solid var(--border);border-bottom:1px solid var(--border);margin-bottom:40px;font-size:13px;color:var(--muted)}
.byline strong{color:var(--g2);font-weight:500}.byline-sep{color:var(--border-strong)}
.data-box{background:var(--g1);border-radius:12px;padding:24px 28px;margin:36px 0;display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.data-value{font-family:var(--serif);font-size:28px;font-weight:600;color:var(--g7);line-height:1;margin-bottom:4px}
.data-label{font-size:11px;color:rgba(142,207,160,0.6);font-weight:300;letter-spacing:0.03em}
.article-body{font-size:17px;line-height:1.85;color:#1a2e22;font-weight:300}
.article-body h2{font-family:var(--serif);font-size:24px;font-weight:600;color:var(--g0);margin:44px 0 18px;letter-spacing:-0.015em;line-height:1.3}
.article-body h3{font-family:var(--serif);font-size:19px;font-weight:600;color:var(--g1);margin:32px 0 14px}
.article-body p{margin-bottom:22px}
.article-body strong{font-weight:500;color:var(--g1)}
.article-body a{color:var(--g4);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.article-body blockquote{border-left:3px solid var(--g5);margin:32px 0;padding:18px 24px;background:var(--g9);border-radius:0 10px 10px 0;font-family:var(--serif);font-style:italic;font-size:18px;color:var(--g2);line-height:1.6}
.article-body ul,.article-body ol{padding-left:20px;margin-bottom:22px}.article-body li{margin-bottom:8px}
.price-table{width:100%;border-collapse:collapse;margin:28px 0;font-size:14px}
.price-table th{background:var(--g2);color:var(--g8);padding:10px 14px;text-align:left;font-weight:500;font-size:12px;letter-spacing:0.04em}
.price-table td{padding:10px 14px;border-bottom:1px solid var(--border)}
.price-table tr:nth-child(even) td{background:rgba(234,246,237,0.5)}
.up{color:#2d8c45;font-weight:500}.down{color:#c0392b;font-weight:500}
.tag-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:40px;padding-top:28px;border-top:1px solid var(--border)}
.tag{font-size:12px;padding:5px 12px;border:1px solid var(--border-strong);border-radius:100px;color:var(--muted);text-decoration:none;transition:all 0.2s}
.tag:hover{background:var(--g9);color:var(--g2)}
.related{margin-top:60px;padding-top:40px;border-top:1px solid var(--border)}
.related-title{font-family:var(--mono);font-size:11px;letter-spacing:0.1em;text-transform:uppercase;color:var(--g5);margin-bottom:24px}
.related-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.related-card{background:#fff;border:1px solid var(--border);border-radius:12px;padding:18px;text-decoration:none;color:inherit;transition:all 0.2s;display:block}
.related-card:hover{border-color:var(--g7);background:var(--g9)}
.related-cat{font-family:var(--mono);font-size:10px;letter-spacing:0.08em;text-transform:uppercase;color:var(--g5);margin-bottom:8px;display:block}
.related-card h4{font-family:var(--serif);font-size:15px;line-height:1.35;color:var(--g0);font-weight:400}
footer{background:var(--g0);color:var(--g7);padding:48px 40px;margin-top:80px;text-align:center;font-size:13px;font-weight:300}
footer a{color:var(--g6);text-decoration:none;margin:0 12px}
.footer-logo{font-family:var(--serif);font-size:20px;color:var(--g8);margin-bottom:16px}.footer-logo span{color:var(--g6)}
@media(max-width:768px){.article-page{padding:90px 20px 60px}.data-box{grid-template-columns:1fr 1fr}.related-grid{grid-template-columns:1fr}.nav-inner{padding:0 20px}.nav-links{display:none}}
