/* ViewInRoom design system v2 - wspolne style dla podstron (blog) */
:root{
  --bg:#EDE7DB; --panel:#F4EFE5; --paper:#FAF6EE;
  --ink:#221E1A; --muted:#544C42;
  --accent:#B95B36; --wood:#7C5236;
  --line:rgba(34,30,26,.14); --on-dark:#F3EDE2;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;color:var(--ink);font-family:"Hanken Grotesk",-apple-system,sans-serif;line-height:1.65;position:relative;background:var(--bg)}
body::before{content:"";position:absolute;inset:0;z-index:-1;background:url(/assets/texture.webp) top left/900px 900px repeat;opacity:.85}
.wrap{width:min(1140px,calc(100% - 3rem));margin:0 auto}
.narrow{width:min(720px,calc(100% - 3rem));margin:0 auto}
.serif{font-family:"DM Serif Display",Georgia,serif;font-weight:400}
.kicker{font-size:.78rem;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--accent)}
a{color:var(--ink)}

header{padding:1.6rem 0}
.nav{display:flex;align-items:center;justify-content:space-between}
.brand{display:flex;align-items:center;gap:.6rem;text-decoration:none;color:var(--ink)}
.brand img{width:26px;height:26px;border-radius:5px}
.brand span{font-family:"DM Serif Display",serif;font-size:1.3rem;letter-spacing:.01em}
.navlinks{display:flex;align-items:center;gap:1.8rem}
.navlinks a{color:var(--ink);text-decoration:none;font-size:.82rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;opacity:.95}
.navlinks a.cta{background:var(--ink);color:var(--on-dark);padding:.7rem 1.4rem;border-radius:2px}
.navlinks a.cta:hover{background:#000}

.btn{display:inline-block;text-decoration:none;font-weight:600;font-size:.82rem;letter-spacing:.14em;text-transform:uppercase;padding:1rem 1.9rem;border-radius:2px;transition:background .15s,color .15s}
.btn.primary{background:var(--ink);color:var(--on-dark)}
.btn.primary:hover{background:#000}
.btn.quiet{color:var(--ink);border:1px solid var(--ink);background:transparent}
.btn.quiet:hover{background:var(--ink);color:var(--on-dark)}

/* blog: lista */
.bloghead{padding:2.6rem 0 2.4rem;border-bottom:1px solid var(--line);margin-bottom:2.6rem}
.bloghead h1{font-family:"DM Serif Display",serif;font-weight:400;font-size:clamp(2.2rem,5vw,3.4rem);margin:.6rem 0 .6rem;line-height:1.08}
.bloghead p{color:var(--muted);margin:0;max-width:560px}
.postlist{list-style:none;padding:0;margin:0 0 5rem}
.postlist li{border-bottom:1px solid var(--line)}
.postlist a{display:grid;grid-template-columns:9rem 1fr;gap:2rem;padding:1.8rem .2rem;text-decoration:none;transition:background .15s}
.postlist a:hover{background:rgba(250,246,238,.6)}
.postlist time{font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);padding-top:.35rem}
.postlist h2{font-family:"DM Serif Display",serif;font-weight:400;font-size:1.5rem;margin:0 0 .4rem;line-height:1.2}
.postlist p{margin:0;color:var(--muted);font-size:.95rem}

/* blog: wpis */
.post{padding:2.4rem 0 4rem}
.post .meta{font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.post h1{font-family:"DM Serif Display",serif;font-weight:400;font-size:clamp(2.1rem,4.6vw,3.2rem);line-height:1.1;margin:.8rem 0 1rem}
.post .lead{font-size:1.15rem;color:var(--muted);margin:0 0 2.4rem}
.post .body{font-size:1.05rem}
.post .body h2{font-family:"DM Serif Display",serif;font-weight:400;font-size:1.7rem;margin:2.6rem 0 .8rem;line-height:1.2}
.post .body h3{font-family:"DM Serif Display",serif;font-weight:400;font-size:1.3rem;margin:2rem 0 .6rem}
.post .body p{margin:0 0 1.1rem}
.post .body ul,.post .body ol{margin:0 0 1.3rem;padding-left:1.2rem}
.post .body li{margin-bottom:.5rem}
.post .body blockquote{margin:1.8rem 0;padding:1.2rem 1.4rem;background:var(--paper);border-left:3px solid var(--accent);font-family:"DM Serif Display",serif;font-size:1.15rem}
.post .body img{max-width:100%;height:auto;border:8px solid #fff;outline:1px solid var(--line);border-radius:3px}
.post .body table{width:100%;border-collapse:collapse;font-size:.95rem;margin:1.6rem 0}
.post .body th,.post .body td{text-align:left;padding:.8rem 1rem;border-bottom:1px solid var(--line)}
.post .body thead th{font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);border-bottom:1px solid var(--ink)}
.post .body a{color:var(--accent)}
.postcta{margin-top:3rem;border:1px dashed var(--line);border-radius:4px;padding:2rem;background:rgba(250,246,238,.45);text-align:center}
.postcta h3{font-family:"DM Serif Display",serif;font-weight:400;font-size:1.5rem;margin:0 0 .5rem}
.postcta p{color:var(--muted);margin:0 0 1.4rem}

.bigfoot{border-top:1px solid var(--line);margin-top:4rem;padding:2.6rem 0;display:grid;grid-template-columns:2fr 1fr 1fr;gap:2rem;font-size:.88rem}
.bigfoot .col h4{font-size:.72rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);margin:0 0 .8rem}
.bigfoot a{display:block;color:var(--ink);text-decoration:none;opacity:.8;margin-bottom:.45rem}
.bigfoot a:hover{opacity:1}
.bigfoot .desc{color:var(--muted);max-width:300px}
.bigfoot .brandline{display:flex;align-items:center;gap:.5rem;font-family:"DM Serif Display",serif;font-size:1.1rem;margin-bottom:.7rem}
.bigfoot .brandline img{width:22px;height:22px;border-radius:4px}
.foot{border-top:1px solid var(--line);padding:1.6rem 0 2rem;display:flex;justify-content:space-between;gap:1rem;font-size:.82rem;color:var(--muted);flex-wrap:wrap}

@media (max-width:820px){
  .navlinks{gap:1rem}
  .navlinks a:not(.cta){display:none}
  .postlist a{grid-template-columns:1fr;gap:.5rem}
  .bigfoot{grid-template-columns:1fr;text-align:center}
  .bigfoot .desc{margin:0 auto}
  .bigfoot .brandline{justify-content:center}
  .foot{flex-direction:column;text-align:center}
}