/* Standchi — Malzeme detay sayfaları ortak stili (monokrom) */
* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { font-family:'Crimson Text', serif; background:#ffffff; color:#222; line-height:1.6; }
a { text-decoration:none; color:inherit; }
h1, h2, h3, h4, .logo { font-family:'Cinzel', serif; }
img { max-width:100%; display:block; }

.tonal-bar { height:8px; background:linear-gradient(to right,#050505 0%,#2b2b2b 16%,#4a4a4a 32%,#6e6e6e 48%,#949494 64%,#bcbcbc 80%,#e4e4e4 100%); }

/* NAV */
.nav { position:sticky; top:0; z-index:100; display:flex; align-items:center; justify-content:space-between; padding:20px 48px; background:#f4f4f4; border-bottom:1px solid #dcdcdc; }
.nav .logo-slot { display:flex; align-items:center; gap:12px; }
.nav .logo-mark { width:44px; height:44px; border:1.4px solid #222; border-radius:50%; display:flex; align-items:center; justify-content:center; font-family:'Cinzel',serif; font-size:0.78rem; letter-spacing:1px; color:#222; flex-shrink:0; }
.nav .logo { font-size:1.05rem; font-weight:700; letter-spacing:3px; color:#111; }
.nav ul { list-style:none; display:flex; gap:26px; font-size:0.95rem; letter-spacing:0.5px; color:#5c5c5c; }
.nav ul a:hover, .nav ul a.active { color:#111; }

/* HERO */
.m-hero { background:#141414; color:#eee; padding:60px 48px 54px; }
.m-hero .crumb { font-size:0.78rem; letter-spacing:0.5px; color:#8f8f8f; margin-bottom:20px; }
.m-hero .crumb a:hover { color:#fff; }
.m-hero .label { font-size:0.78rem; letter-spacing:2.5px; text-transform:uppercase; color:#9c9c9c; margin-bottom:14px; }
.m-hero h1 { font-size:2.5rem; font-weight:700; color:#f5f5f5; line-height:1.25; }
.m-hero p { margin-top:18px; max-width:680px; font-size:1.06rem; color:#b6b6b6; }

/* LAYOUT + YAN MENÜ */
.m-layout { max-width:1180px; margin:0 auto; display:grid; grid-template-columns:230px 1fr; gap:44px; padding:0 48px; align-items:start; }
.m-side { position:sticky; top:92px; border:1px solid #e2e2e2; padding:14px 0; }
.m-side-title { font-family:'Cinzel',serif; font-size:0.78rem; letter-spacing:1px; text-transform:uppercase; color:#141414; padding:2px 18px 12px; border-bottom:1px solid #ececec; }
.m-side a { display:block; padding:8px 18px; font-size:0.92rem; color:#555; border-left:3px solid transparent; }
.m-side a:hover { color:#111; background:#f6f6f6; }
.m-side a.active { color:#111; font-weight:700; border-left-color:#141414; background:#f4f4f4; }

/* İÇERİK */
.m-wrap { max-width:900px; margin:0 auto; padding:56px 48px 20px; }
.m-layout .m-wrap { max-width:none; margin:0; padding:44px 0 20px; }
.m-wrap section { margin-bottom:46px; }
.m-wrap h2 { font-size:1.7rem; color:#141414; margin-bottom:16px; padding-bottom:10px; border-bottom:1px solid #e2e2e2; }
.m-wrap h3 { font-size:1.15rem; color:#2a2a2a; margin:22px 0 8px; }
.m-wrap p { font-size:1.02rem; color:#3a3a3a; margin-bottom:12px; }
.m-wrap ul { margin:8px 0 12px 20px; }
.m-wrap li { margin-bottom:7px; font-size:1.0rem; color:#3a3a3a; }
.m-wrap strong { color:#111; }
.m-related p a { color:#111; text-decoration:underline; }

/* TABLO */
.m-table { width:100%; border-collapse:collapse; margin-top:8px; font-size:0.97rem; }
.m-table th, .m-table td { text-align:left; padding:11px 14px; border-bottom:1px solid #e4e4e4; vertical-align:top; }
.m-table th { background:#f4f4f4; font-family:'Cinzel',serif; font-weight:700; font-size:0.8rem; letter-spacing:0.5px; text-transform:uppercase; color:#333; width:34%; }

/* İKİLİ */
.m-pros { display:grid; grid-template-columns:1fr 1fr; gap:22px; }
.m-pros .box { border:1px solid #e2e2e2; padding:20px 22px; }
.m-pros .box h3 { margin-top:0; }
.m-pros .box.pro { border-left:3px solid #141414; }
.m-pros .box.con { border-left:3px solid #b0b0b0; }
.m-pros ul { margin-left:18px; }

/* GÖRSELLER */
.m-figs { display:grid; grid-template-columns:repeat(2,1fr); gap:16px 16px; margin-top:8px; align-items:start; }
.m-figs figure.wide { grid-column:1 / -1; }
.m-figs img { width:100%; height:auto; aspect-ratio:4/3; object-fit:cover; }
.m-figs figure.wide img { aspect-ratio:16/7; }
.m-figs figure { margin:0; }
.m-figs figcaption { font-size:0.85rem; color:#777; margin-top:7px; }
.ph-img { aspect-ratio:4/3; background:linear-gradient(135deg,#3a3a3a 0%,#6e6e6e 45%,#9c9c9c 75%,#c4c4c4 100%); display:flex; align-items:center; justify-content:center; color:rgba(255,255,255,0.75); font-size:0.85rem; letter-spacing:0.5px; text-align:center; padding:16px; }
figure.wide .ph-img { aspect-ratio:16/7; }

/* CTA */
.m-cta { background:#141414; color:#eee; text-align:center; padding:52px 48px; margin-top:20px; }
.m-cta h2 { font-size:1.7rem; color:#f5f5f5; margin-bottom:12px; }
.m-cta p { color:#b0b0b0; max-width:540px; margin:0 auto 24px; }
.m-cta .btn { display:inline-block; background:#eee; color:#141414; padding:15px 32px; font-family:'Cinzel',serif; font-size:0.82rem; letter-spacing:1px; text-transform:uppercase; font-weight:700; }
.m-cta .btn.outline { background:none; border:1px solid #666; color:#eee; margin-left:12px; }

/* diğer malzemeler */
.m-more { max-width:1180px; margin:0 auto; padding:10px 48px 70px; }
.m-more h2 { font-size:1.2rem; color:#141414; margin-bottom:16px; }
.m-more .tags { display:flex; flex-wrap:wrap; gap:10px; }
.m-more .tags a { font-size:0.9rem; padding:9px 15px; border:1px solid #cfcfcf; color:#444; background:#fff; }
.m-more .tags a:hover { background:#141414; color:#fff; border-color:#141414; }

/* FOOTER */
footer { background:#141414; color:#9c9c9c; padding:44px 48px; }
.foot-links { display:flex; flex-wrap:wrap; gap:24px; font-size:1rem; margin-bottom:18px; }
.foot-links a:hover { color:#fff; }
.foot-meta { display:flex; flex-wrap:wrap; justify-content:space-between; gap:12px; font-size:0.85rem; color:#6e6e6e; }
.foot-meta a:hover { color:#fff; }

@media (max-width:860px) {
  .m-layout { grid-template-columns:1fr; gap:0; padding:0 20px; }
  .m-side { position:static; border:none; padding:12px 0 4px; display:flex; gap:8px; overflow-x:auto; }
  .m-side-title { display:none; }
  .m-side a { flex:0 0 auto; white-space:nowrap; border:1px solid #cfcfcf; border-left:1px solid #cfcfcf; padding:7px 13px; font-size:0.82rem; }
  .m-side a.active { border-color:#141414; border-left-color:#141414; }
  .m-layout .m-wrap { padding:18px 0 20px; }
}
@media (max-width:760px) {
  .nav ul { display:none; }
  .m-hero h1 { font-size:1.9rem; }
  .m-pros { grid-template-columns:1fr; }
  .m-figs { grid-template-columns:1fr; }
  .m-table th { width:42%; }
}