/* interior.css — Claude Design starter stylesheet
   Colors are driven by CSS variables injected by block-renderer.jsx
   via data/site.json. Override per-site in Site Info > Brand Colors. */

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:'Manrope',system-ui,sans-serif;color:#2d3748;background:white;line-height:1.6;-webkit-font-smoothing:antialiased}

/* Typography */
h1,h2,h3,h4,h5,h6{font-weight:800;line-height:1.2;color:#052942}
h1{font-size:clamp(2rem,5vw,3.5rem)}
h2{font-size:clamp(1.5rem,3.5vw,2.25rem)}
h3{font-size:clamp(1.1rem,2.5vw,1.5rem)}
p{margin-top:0;margin-bottom:1em;line-height:1.75}
a{color:#45BBEC;text-decoration:none}a:hover{text-decoration:underline}
img{max-width:100%;height:auto}

/* Post body styles */
.post-body h2{font-size:1.5rem;margin-top:2em;margin-bottom:.75em;color:#052942}
.post-body h3{font-size:1.15rem;margin-top:1.5em;margin-bottom:.6em;color:#052942}
.post-body p{font-size:16px;line-height:1.8;color:#374151;margin-bottom:1.25em}
.post-body ul,.post-body ol{padding-left:1.5em;margin-bottom:1.25em}
.post-body li{font-size:16px;line-height:1.7;color:#374151;margin-bottom:.4em}
.post-body blockquote{border-left:3px solid #45BBEC;margin:0 0 1.25em 0;padding:.5em 1em;background:#f8fafc}
.post-body blockquote p{color:#5a6b7a;font-style:italic;margin:0}
.post-body a{color:#45BBEC;font-weight:600}
.post-body img{max-width:100%;margin:1.5em 0;display:block}
.post-body pre{background:#0d1117;color:#e6edf3;padding:1.25em;overflow-x:auto;font-size:13px;line-height:1.7;margin-bottom:1.25em;font-family:ui-monospace,'SF Mono',Menlo,monospace}
.post-body code{font-family:ui-monospace,'SF Mono',Menlo,monospace;font-size:13px;background:#f0f2f4;padding:1px 5px}
.post-body pre code{background:none;padding:0;font-size:inherit}

/* Utility */
.container{max-width:1200px;margin:0 auto;padding:0 5%}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}

/* Nav responsive */
@media(max-width:768px){
  .nav-desktop{display:none!important}
  .nav-toggle{display:flex!important}
}

/* Section spacing */
section+section{}
