/* traitement-laser.fr — Handmade mini-site
   Minimal, fast, readable. No external assets.
*/
:root{
  --bg:#ffffff;
  --text:#1b1f23;
  --muted:#5a636d;
  --accent:#0d6efd;
  --border:#e6e8eb;
  --maxw: 72rem;
}
*{box-sizing:border-box}
html{font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, 'Helvetica Neue', Arial, sans-serif; line-height:1.6; color:var(--text); background:var(--bg)}
body{margin:0; padding:0}
a{color:var(--accent); text-decoration:none}
a:hover{text-decoration:underline}
header{border-bottom:1px solid var(--border); background:#fafbfd}
.nav{max-width:var(--maxw); margin:0 auto; display:flex; gap:1rem; align-items:center; justify-content:space-between; padding:0.75rem 1rem}
.nav a.brand{font-weight:700; letter-spacing:.2px}
.nav .menu{display:flex; gap:.75rem; flex-wrap:wrap}
main{max-width:var(--maxw); margin:0 auto; padding:1.25rem}
h1{line-height:1.25; margin:.2rem 0 1rem 0}
h2{margin:1.5rem 0 .5rem 0}
p{margin:.6rem 0}
ul{margin:.4rem 0 .8rem 1.25rem}
footer{border-top:1px solid var(--border); color:var(--muted); font-size:.92rem}
.footer-inner{max-width:var(--maxw); margin:0 auto; padding:1rem}
.note{font-style:italic; background:#f7f9fc; border:1px solid var(--border); padding:.75rem 1rem; border-radius:.5rem; margin:1rem 0}
.callout{border-left:4px solid var(--accent); padding:.5rem 1rem; background:#f4f8ff; border-radius:.25rem; margin:1rem 0}
code{background:#f1f3f5; padding:.05rem .35rem; border-radius:.25rem; font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace}
img{max-width:100%; height:auto; border-radius:.4rem; border:1px solid var(--border)}
.grid-2{display:grid; grid-template-columns:1fr; gap:1rem}
@media (min-width: 800px){ .grid-2{grid-template-columns:1fr 1fr} }
.visually-hidden{position:absolute; left:-10000px; top:auto; width:1px; height:1px; overflow:hidden}