:root {
  --bg: #121418;
  --bg-2: #1a1d24;
  --bg-3: #232833;
  --ink: #f4f1ea;
  --muted: #b7b3a8;
  --line: #2e3340;
  --accent: #e0b13a;
  --accent-2: #c99720;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  font-family: "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  background: var(--bg);
  color: var(--ink);
  line-height: 1.55;
}
a { color: var(--accent); text-decoration: none; }
a:hover { text-decoration: underline; }
img { max-width: 100%; display: block; }
.wrap { width: min(1160px, calc(100% - 32px)); margin: 0 auto; }
header {
  position: sticky; top: 0; z-index: 30;
  background: rgba(18,20,24,.94);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--line);
}
.nav { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 78px; }
.brand { display: flex; align-items: center; gap: 10px; text-decoration: none; color: var(--ink); }
.brand img { height: 44px; width: auto; }
.brand-mark {
  width: 52px; height: 52px; border: 2.5px solid var(--accent);
  display: grid; place-items: center; font-weight: 800; letter-spacing: .06em; font-size: 18px;
}
nav { display: flex; gap: 16px; align-items: center; flex-wrap: wrap; }
nav a { color: var(--ink); font-size: 14px; text-decoration: none; }
nav a:hover, nav a.active { color: var(--accent); }
.lang { color: var(--muted); font-size: 13px; }
.lang a { color: var(--muted); }
.lang a.active { color: var(--accent); }
.tel { background: var(--accent); color: #1a1404 !important; padding: 8px 12px; font-weight: 700; text-decoration: none !important; }
.hero { padding: 48px 0 28px; }
.hero-grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: 28px; align-items: center; }
.kicker { color: var(--accent); font-size: 12px; letter-spacing: .16em; text-transform: uppercase; margin-bottom: 12px; }
h1 { font-size: clamp(30px, 4.6vw, 52px); line-height: 1.06; }
.lead { margin-top: 16px; color: var(--muted); font-size: 18px; max-width: 62ch; }
.actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 24px; }
.btn { display: inline-block; padding: 12px 16px; font-weight: 700; text-decoration: none !important; }
.btn-primary { background: var(--accent); color: #1a1404; }
.btn-ghost { border: 1px solid var(--line); color: var(--ink); }
.hero-photos { display: grid; grid-template-columns: 1.4fr .9fr; grid-template-rows: 1fr 1fr; gap: 8px; min-height: 360px; }
.hero-photos a, .hero-photos figure { margin: 0; background: var(--bg-2); overflow: hidden; border: 1px solid var(--line); }
.hero-photos img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.hero-photos .big { grid-row: 1 / span 2; }
.strip { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background: var(--line); border: 1px solid var(--line); margin-top: 28px; }
.strip div { background: var(--bg-2); padding: 14px 16px; }
.strip b { display: block; font-size: 14px; }
.strip span { color: var(--muted); font-size: 13px; }
section { padding: 52px 0; }
h2 { font-size: clamp(24px, 3vw, 34px); margin-bottom: 8px; }
.sub { color: var(--muted); max-width: 70ch; margin-bottom: 24px; }
.cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.card { background: var(--bg-2); border: 1px solid var(--line); display: flex; flex-direction: column; }
.card .pic { height: 210px; background: #0e1014; overflow: hidden; }
.card .pic img { width: 100%; height: 100%; object-fit: cover; }
.card .pic.contain img { object-fit: contain; padding: 12px; background: #f3f3f3; }
.card .body { padding: 16px; }
.card h3 { font-size: 18px; margin-bottom: 6px; }
.card p { color: var(--muted); font-size: 14.5px; }
.two { display: grid; grid-template-columns: 1.15fr .85fr; gap: 24px; align-items: start; }
.panel { background: var(--bg-2); border: 1px solid var(--line); padding: 20px; }
.panel h3 { margin-bottom: 10px; }
.panel p { margin: 6px 0; }
ul.facts { margin: 12px 0 0 18px; color: var(--muted); }
ul.facts li { margin: 7px 0; }
table { width: 100%; border-collapse: collapse; font-size: 13px; overflow-x: auto; display: block; }
th, td { border: 1px solid var(--line); padding: 8px 10px; text-align: left; white-space: nowrap; }
th { background: var(--bg-3); }
.gallery { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.gallery a { background: var(--bg-2); border: 1px solid var(--line); overflow: hidden; height: 170px; }
.gallery img { width: 100%; height: 100%; object-fit: cover; }
.gallery .contain img { object-fit: contain; background: #f3f3f3; padding: 8px; }
form { display: grid; gap: 10px; margin-top: 12px; }
input, textarea, select {
  width: 100%; background: var(--bg); color: var(--ink);
  border: 1px solid var(--line); padding: 10px 12px; font: inherit;
}
button { justify-self: start; background: var(--accent); color: #1a1404; border: 0; padding: 12px 16px; font-weight: 700; cursor: pointer; }
.note { font-size: 13px; color: var(--muted); }
footer { border-top: 1px solid var(--line); padding: 24px 0 36px; color: var(--muted); font-size: 13px; }
footer .wrap { display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
@media (max-width: 900px) {
  .hero-grid, .cards, .two, .gallery, .strip { grid-template-columns: 1fr; }
  .hero-photos { min-height: 280px; }
  .tel { display: none; }
}

.social { display:flex; gap:8px; align-items:center; }
.social a {
  display:inline-flex; align-items:center; gap:6px;
  border:1px solid var(--line); padding:6px 10px; font-size:13px;
  color:var(--ink); text-decoration:none !important;
}
.social a:hover { border-color:var(--accent); color:var(--accent); }
.videos { display:grid; grid-template-columns:repeat(2,1fr); gap:12px; }
.video {
  background:var(--bg-2); border:1px solid var(--line);
}
.video iframe { width:100%; aspect-ratio:16/9; border:0; display:block; }
.video p { padding:10px 12px; color:var(--muted); font-size:14px; }
@media (max-width:900px){ .videos { grid-template-columns:1fr; } }
.badge-pl { display:inline-flex; align-items:center; gap:8px; border:1px solid var(--line); padding:6px 10px; font-size:13px; }
.badge-pl b { color:var(--accent); }
.prod-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.prod-grid a.card { color:inherit; text-decoration:none; }
.crumb { color:var(--muted); font-size:13px; margin-bottom:16px; }
.dims { display:flex; gap:24px; flex-wrap:wrap; color:var(--muted); margin:12px 0 20px; }
@media (max-width:900px){ .prod-grid { grid-template-columns:1fr; } }

.hp { position:absolute; left:-9999px; height:0; overflow:hidden; }
.nav-toggle {
  display:none; background:var(--accent); color:#1a1404; border:0;
  padding:8px 12px; font-weight:700; cursor:pointer;
}
header nav.open { display:flex; }
.table-wrap { overflow-x:auto; border:1px solid var(--line); }
.table-wrap::after {
  content:"← przesuń tabelę →";
  display:none; text-align:center; color:var(--muted); font-size:12px; padding:6px;
}
@media (max-width:900px) {
  .nav-toggle { display:inline-block; }
  header .nav { flex-wrap:wrap; }
  header nav {
    display:none; width:100%; flex-direction:column; align-items:flex-start; gap:10px; padding:8px 0 16px;
  }
  header nav.open { display:flex; }
  .table-wrap::after { display:block; }
  .tel { display:inline-block; }
}

.brand-text { display:flex; flex-direction:column; line-height:1.15; }
.brand-text em { font-style:normal; color:var(--accent); font-size:12px; }
.flag-pl { display:inline-flex; align-items:center; }
.nav-toggle { display:none; background:var(--accent); color:#1a1404; border:0; padding:8px 12px; font-weight:700; cursor:pointer; }
.class-block { display:grid; grid-template-columns:1.25fr .75fr; gap:18px; align-items:start; margin:28px 0 36px; }
.class-dl { margin-top:12px; }
.class-sketch img { width:100%; height:auto; background:#1a1d24; }
@media (max-width:1100px){
  .nav-toggle { display:inline-block; }
  header .nav { flex-wrap:wrap; }
  header nav { display:none; width:100%; flex-direction:column; align-items:flex-start; gap:10px; padding:8px 0 16px; }
  header nav.open { display:flex; }
  .class-block { grid-template-columns:1fr; }
}

.soc { display:inline-flex; align-items:center; justify-content:center; width:36px; height:36px; border:1px solid var(--line); color:var(--ink); text-decoration:none !important; }
.soc:hover { border-color:var(--accent); color:var(--accent); }
.soc svg { display:block; }
.brand-text { display:flex; flex-direction:column; line-height:1.15; }
.brand-text em { font-style:normal; color:var(--accent); font-size:12px; }

.class-sketch { background:#fff; color:#111; }
.class-sketch img { width:100%; max-width:450px; height:auto; display:block; background:#fff; }
.class-sketch .dims { color:#222; flex-direction:column; gap:4px; }
.class-sketch .dims span { white-space:nowrap; font-weight:700; }
.class-block { grid-template-columns: minmax(0,1fr) 320px; align-items:start; }

.brand-logo{height:58px;width:auto;display:block;}

.nip-row { display:grid; grid-template-columns:1fr auto; gap:8px; align-items:end; }
.btn-gus { background:transparent; color:var(--accent); border:1px solid var(--accent); padding:8px 10px; font-weight:700; cursor:pointer; white-space:nowrap; }
.form-err { color:#e07070; font-size:14px; display:none; }
.gus-status { min-height:1.2em; }
@media (max-width:700px){ .nip-row { grid-template-columns:1fr; } }

.legal-check { display:flex; gap:10px; align-items:flex-start; font-size:13px; color:var(--muted); font-weight:400; }
.legal-check input { margin-top:3px; flex:0 0 auto; }
.legal-check a { color:var(--accent); }

.teeth-grid { margin-top:18px; }
.teeth-grid .pic { background:#fff; min-height:160px; }
.teeth-grid img { object-fit:contain; max-height:180px; margin:0 auto; }
.form-err { color:#e07070; font-size:15px; font-weight:600; }

.th-mini { width:56px; height:42px; object-fit:contain; background:#fff; border-radius:4px; }
.tooth-card .pic { background:#111; }
.tooth-card .pic img { object-fit:contain; max-height:200px; width:100%; }

input[type="checkbox"], input[type="radio"] { width:auto; max-width:none; flex:0 0 auto; }
.legal-check { display:grid; grid-template-columns:20px 1fr; gap:10px 12px; align-items:start; max-width:100%; }
.legal-check input { width:auto; margin:4px 0 0; }
.legal-check a { color:var(--accent); }
@media (max-width:700px){
  .legal-check { grid-template-columns:20px 1fr; }
}

.video video { width:100%; aspect-ratio:9/16; max-height:520px; object-fit:cover; background:#000; display:block; }
@media (min-width:900px){ .videos { grid-template-columns:repeat(3,1fr); } .video video { aspect-ratio:9/16; } }

/* consent + lightbox 2026-09-15 */
form input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="submit"]):not([type="button"]),
form select, form textarea { width:100%; max-width:100%; box-sizing:border-box; }
.legal-check { display:grid !important; grid-template-columns:22px minmax(0,1fr) !important; gap:8px 12px !important; align-items:start !important; margin:10px 0 !important; max-width:100% !important; }
.legal-check input[type="checkbox"] { width:18px !important; height:18px !important; margin:3px 0 0 !important; flex:none !important; justify-self:start; }
.legal-check span { min-width:0; display:block; line-height:1.45; overflow-wrap:break-word; }
.legal-check a { color:var(--accent); white-space:nowrap; }

.lb { position:fixed; inset:0; background:rgba(0,0,0,.92); z-index:80; display:none; align-items:center; justify-content:center; padding:16px; }
.lb.on { display:flex; }
.lb img { max-width:min(96vw,1200px); max-height:86vh; object-fit:contain; }
.lb button { position:absolute; background:#222; color:#fff; border:1px solid #444; width:44px; height:44px; border-radius:4px; font-size:22px; cursor:pointer; }
.lb .lb-x { top:12px; right:12px; }
.lb .lb-prev { left:12px; top:50%; transform:translateY(-50%); }
.lb .lb-next { right:12px; top:50%; transform:translateY(-50%); }
.lb .lb-cap { position:absolute; bottom:12px; left:16px; right:16px; text-align:center; color:#ccc; font-size:14px; }
.gallery a { cursor:zoom-in; }

/* === mobile 2026-09-15 === */
html, body { overflow-x: hidden; }
img, video, iframe { max-width: 100%; }
.btn, .tel, .nav-toggle, button { min-height: 44px; }
.soc { width: 44px; height: 44px; }
@media (max-width: 900px) {
  .wrap { width: min(1160px, calc(100% - 24px)); }
  .nav { min-height: 64px; gap: 8px; }
  .brand-logo { height: 40px !important; max-width: 180px; }
  .hero { padding: 24px 0 16px; }
  .hero-photos { min-height: 0; grid-template-columns: 1fr 1fr; grid-template-rows: auto; }
  .hero-photos .big { grid-row: auto; grid-column: 1 / -1; }
  .hero-photos a, .hero-photos figure { height: 160px; }
  .cards, .prod-grid, .teeth-grid { grid-template-columns: 1fr 1fr !important; }
  .gallery { grid-template-columns: 1fr 1fr !important; }
  .gallery a { height: 140px; }
  .card .pic { height: 150px; }
  section { padding: 32px 0; }
  .actions .btn { flex: 1 1 140px; text-align: center; }
  header nav a, header nav .lang { font-size: 16px; padding: 8px 0; }
  .legal-check a { white-space: normal; }
  .lb { padding: 56px 8px 64px; }
  .lb img { max-width: 100%; max-height: 72vh; }
  .lb .lb-prev, .lb .lb-next { width: 48px; height: 48px; }
  .lb .lb-x { top: 8px; right: 8px; }
  .lb .lb-cap { font-size: 13px; }
  footer .wrap { flex-direction: column; }
  .video video { max-height: 70vh; }
}
@media (max-width: 520px) {
  .cards, .prod-grid { grid-template-columns: 1fr !important; }
  .strip { grid-template-columns: 1fr 1fr; }
  h1 { font-size: 28px; }
  .lead { font-size: 16px; }
}
