/* Dynasty Architect — Content-Seiten (Methodik, Blog) · Navy/Gold */
:root{
  --bg:#0a0c0f; --surface:#13171e; --border:#1e2530;
  --gold:#e8c96a; --gold2:#c8a84b; --text:#f0f2f6; --muted:#8b94a3; --body:#c3c9d4;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);
  font-family:'Inter',system-ui,-apple-system,sans-serif;line-height:1.75;-webkit-font-smoothing:antialiased}
a{color:var(--gold)}

.ct-header{position:sticky;top:0;z-index:50;background:rgba(10,12,15,.9);
  backdrop-filter:blur(8px);border-bottom:1px solid var(--border)}
.ct-header-in{max-width:1000px;margin:0 auto;display:flex;align-items:center;
  justify-content:space-between;padding:.85rem 1.2rem;gap:1rem}
.ct-logo{font-family:'Bebas Neue',sans-serif;font-size:1.5rem;letter-spacing:1px;
  color:var(--text);text-decoration:none;white-space:nowrap}
.ct-logo b{color:var(--gold);font-weight:400}
.ct-nav{display:flex;gap:1.1rem;align-items:center;flex-wrap:wrap}
.ct-nav a{color:var(--muted);text-decoration:none;font-size:.95rem}
.ct-nav a:hover{color:var(--text)}
.ct-btn{background:var(--gold2)!important;color:#12100a!important;padding:.5rem .9rem;
  border-radius:8px;font-weight:600;font-size:.9rem}

.ct-wrap{max-width:760px;margin:0 auto;padding:2.6rem 1.2rem 3rem}
.ct-eyebrow{color:var(--gold);font-size:.82rem;letter-spacing:2px;text-transform:uppercase;
  font-weight:600;margin-bottom:.5rem}
h1{font-family:'Bebas Neue',sans-serif;font-weight:400;font-size:2.9rem;line-height:1.05;
  letter-spacing:1px;margin:.1rem 0 1rem}
h1 .g,h2 .g{color:var(--gold)}
h2{font-size:1.5rem;margin:2.6rem 0 .7rem;color:var(--text)}
h3{font-size:1.12rem;margin:1.6rem 0 .4rem;color:var(--text)}
p{color:var(--body);margin:0 0 1rem}
.ct-lead{font-size:1.18rem;color:var(--text);margin-bottom:1.4rem}
.ct-meta{color:var(--muted);font-size:.85rem;margin-bottom:1.6rem}

.ct-example{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin:1.3rem 0}
.ct-example>div{background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:1.1rem}
.ct-example h4{margin:0 0 .4rem;color:var(--gold);font-size:1rem}
.ct-example p{margin:0;font-size:.95rem}

.ct-note{color:var(--muted);font-size:.92rem;border-left:3px solid var(--gold2);
  padding:.1rem 0 .1rem 1rem;margin:1.5rem 0}
.ct-cta{background:linear-gradient(180deg,#141821,#0e1218);border:1px solid var(--border);
  border-radius:14px;padding:1.8rem;text-align:center;margin:2.8rem 0 0}
.ct-cta h3{margin:0 0 .3rem}
.ct-cta p{margin:0 0 1.1rem;color:var(--muted)}
.ct-cta .ct-btn{display:inline-block;padding:.75rem 1.4rem;font-size:1rem}

.ct-postlist{margin:1.6rem 0}
.ct-post{display:block;background:var(--surface);border:1px solid var(--border);border-radius:12px;
  padding:1.2rem 1.4rem;margin-bottom:1rem;text-decoration:none;transition:border-color .15s}
.ct-post:hover{border-color:var(--gold2)}
.ct-post h3{margin:0 0 .35rem;color:var(--text)}
.ct-post p{margin:0;color:var(--muted);font-size:.95rem}

.pro{display:inline-block;font-size:.6rem;font-weight:700;color:var(--gold);
  border:1px solid var(--gold2);border-radius:4px;padding:.04rem .32rem;vertical-align:middle;letter-spacing:.5px}

.ct-footer{border-top:1px solid var(--border);margin-top:3rem}
.ct-footer-in{max-width:1000px;margin:0 auto;padding:1.5rem 1.2rem;display:flex;
  gap:1.1rem;flex-wrap:wrap;align-items:center;color:var(--muted);font-size:.85rem}
.ct-footer-in a{color:var(--muted);text-decoration:none}
.ct-footer-in a:hover{color:var(--text)}
.ct-back{color:var(--muted);text-decoration:none;font-size:.9rem;display:inline-block;margin-bottom:1.2rem}

@media(max-width:640px){.ct-example{grid-template-columns:1fr}h1{font-size:2.3rem}.ct-wrap{padding-top:2rem}
  .ct-header-in{flex-wrap:wrap;row-gap:.35rem}
  .ct-nav{width:100%;justify-content:center;gap:.2rem .9rem}
  .ct-nav a{font-size:.9rem}}