/* Tyrkysova var(--acc, #70dce9) byla natvrdo; ted se bere motiv a akcent uctu
   (/nyx-barvy.css). Obrazky loga zustavaji sve puvodni barvy. */
:root { --nyx-barvy:1; color-scheme:dark; font-family:Inter,"Segoe UI",Arial,sans-serif; color:#edf4f7; background:color-mix(in srgb, var(--acc, #70dce9) 5%, #15191d); }
* { box-sizing:border-box; }
body { margin:0; }
a { color:var(--acc, #70dce9); text-underline-offset:4px; }
a:focus-visible { outline:3px solid var(--acc, #70dce9); outline-offset:5px; border-radius:4px; }
.site-header, main, footer { width:min(1160px,calc(100% - 48px)); margin:auto; }
.site-header { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:22px 0; border-bottom:1px solid #ffffff18; }
.brand { display:flex; align-items:center; gap:10px; color:#fff; text-decoration:none; font-size:24px; font-weight:700; }
.brand span { color:var(--acc, #70dce9); margin-left:-9px; }
.brand img { object-fit:contain; }
.back { font-size:14px; text-decoration:none; }
.intro { max-width:760px; padding:58px 0 36px; }
.eyebrow { font-size:12px; font-weight:600; letter-spacing:.12em; color:var(--acc, #70dce9); }
h1 { font-size:clamp(36px,6vw,62px); letter-spacing:-.04em; margin:16px 0; line-height:1.1; }
.intro>p:last-child { font-size:18px; line-height:1.7; color:#bac7cf; }
section { margin-bottom:48px; }
.section-heading { display:flex; justify-content:space-between; align-items:center; gap:20px; margin-bottom:20px; }
h2 { font-size:24px; margin:0 0 8px; letter-spacing:-.02em; }
.section-heading p { margin:0; font-size:15px; line-height:1.6; color:#bac7cf; }
.download { display:inline-flex; justify-content:center; align-items:center; min-height:44px; padding:12px 18px; border-radius:9px; background:var(--acc, #70dce9); color:#102429; text-decoration:none; font-size:14px; font-weight:600; flex-shrink:0; }
.download:hover { background:var(--acc-hi, #a2eef5); }
figure { margin:0; overflow:hidden; border:1px solid #ffffff18; border-radius:14px; background:color-mix(in srgb, var(--acc, #70dce9) 6%, #1f252b); }
.logo-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.logo-preview { display:flex; align-items:center; justify-content:center; height:260px; }
.logo-preview img { display:block; width:100%; height:100%; object-fit:contain; }
.white { background:#fff; }
.navy { background:#102a3a; }
.black { background:#000; }
.logo-card h3 a { padding:0; color:inherit; text-decoration:none; }
.logo-card h3 a:hover { color:var(--acc, #70dce9); }
.dimensions { margin-left:16px; color:#a6b5c0; font-size:12px; white-space:nowrap; }
.svg-download { margin-left:16px; }
.detail-intro { padding-bottom:20px; }
.detail-image { display:flex; align-items:center; justify-content:center; }
.detail-image img { display:block; max-width:100%; width:auto; height:auto; max-height:65vh; object-fit:contain; }
.logo-detail figcaption { display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.logo-detail .download { padding:12px 18px; }
.logo-navigation { display:flex; justify-content:space-between; gap:20px; flex-wrap:wrap; margin:24px 0 48px; }
figcaption { padding:18px 22px; font-size:14px; line-height:1.6; color:#bac7cf; }
.originals { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.preview { display:flex; justify-content:center; align-items:center; height:300px; }
.transparent { background:#f3f5f5; }
.transparent img { width:236px; height:236px; object-fit:contain; }
.dark { background:#020711; }
.dark img { width:100%; height:100%; object-fit:contain; }
h3 { margin:0; color:#edf4f7; font-size:18px; }
figcaption p { margin:4px 0 12px; }
figcaption a { display:inline-block; padding:6px 0; }
footer { display:flex; justify-content:space-between; gap:16px; padding:24px 0 32px; border-top:1px solid #ffffff18; font-size:13px; color:#bac7cf; }
footer a { color:#edf4f7; text-decoration:none; font-weight:700; }
@media(max-width:680px) {
  .site-header, main, footer { width:calc(100% - 32px); }
  .intro { padding:32px 0 24px; }
  .section-heading { flex-direction:column; align-items:flex-start; gap:14px; }
  .originals { grid-template-columns:1fr; }
  .logo-grid { grid-template-columns:1fr; }
  .logo-preview { height:230px; }
  .preview { height:260px; }
  .back { font-size:12px; }
  figcaption { padding:14px 16px; }
  footer { flex-wrap:wrap; }
}