/* =============================================================
   Sdílené styly pro všechny stránky (menu, footer, formulář…).
   Barvy berou z :root proměnných definovaných v každé stránce.
   ============================================================= */

/* ---------- hamburger (mobil) ---------- */
.burger{display:none;background:none;border:0;cursor:pointer;padding:8px 0 8px 6px}
.burger span{display:block;width:26px;height:2px;background:#fff;margin:6px 0;border-radius:2px}
@media (max-width:820px){.burger{display:block}}

/* ---------- mobilní overlay menu ---------- */
.mnav{position:fixed;inset:0;z-index:90;background:rgba(7,9,7,.97);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3.4vh;opacity:0;visibility:hidden;transition:opacity .35s,visibility .35s}
body.nav-open .mnav{opacity:1;visibility:visible}
body.nav-open{overflow:hidden}
.mnav a{font-family:'Anton',sans-serif;font-size:clamp(30px,8.5vw,52px);color:var(--cream);text-decoration:none;text-transform:uppercase;letter-spacing:.04em;transition:color .3s}
.mnav a:hover,.mnav a.on{color:var(--emerald-bright)}
.mnav a.lang{font-family:'Space Grotesk',sans-serif;font-size:13px;letter-spacing:.34em;color:var(--cream-dim);margin-top:2vh}
.mnav .x{position:absolute;top:18px;right:24px;font-size:40px;line-height:1;background:none;border:0;color:var(--cream);cursor:pointer;padding:8px}

/* ---------- footer (includuje se přes assets/site.js) ---------- */
footer{background:var(--ink);border-top:1px solid rgba(243,236,221,.08);padding:9vh 6vw 6vh;position:relative;z-index:4}
footer .row{display:flex;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;gap:30px;max-width:1500px;margin:0 auto}
footer .big{font-family:'Anton',sans-serif;font-size:clamp(30px,4.5vw,70px);text-transform:uppercase;line-height:1;color:var(--cream)}
footer .big span{color:var(--emerald)}
footer .fcols{display:flex;gap:8vw;flex-wrap:wrap}
footer ul{list-style:none;display:flex;flex-direction:column;gap:10px;text-align:right;margin:0;padding:0}
footer a{color:var(--cream-dim);text-decoration:none;font-size:15px;letter-spacing:.04em;transition:color .3s}
footer a:hover{color:var(--emerald-bright)}
footer .fhead{font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:rgba(243,236,221,.35);margin-bottom:4px}
footer .fine{margin-top:7vh;text-align:center;font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:rgba(243,236,221,.3)}
@media (max-width:600px){footer ul{text-align:left}footer .fcols{gap:12vw}}

/* ---------- formulář: select + GDPR poznámka ---------- */
.field select{width:100%;background:rgba(243,236,221,.045);border:1px solid rgba(243,236,221,.16);border-radius:12px;padding:16px 18px;color:var(--cream);font-family:'Space Grotesk',sans-serif;font-size:15px;transition:border-color .3s,background .3s;outline:none;cursor:pointer;-webkit-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%2334d399' stroke-width='2' fill='none'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 18px center}
.field select:focus{border-color:var(--emerald);background-color:rgba(16,185,129,.05)}
.field select option{color:#111}
.gdprnote{font-size:12.5px;color:var(--cream-dim);margin-top:14px;line-height:1.7;font-weight:300}
.gdprnote a{color:var(--cream);text-decoration:underline}
.gdprnote a:hover{color:var(--emerald-bright)}

/* ---------- 3 kroky spolupráce ---------- */
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:24px;max-width:1400px}
.step{border:1px solid rgba(243,236,221,.12);border-radius:18px;padding:34px 30px;background:rgba(12,15,13,.5);position:relative;overflow:hidden}
.step .no{font-family:'Anton',sans-serif;font-size:clamp(40px,4.5vw,64px);color:var(--emerald);line-height:1;margin-bottom:18px}
.step h3{font-family:'Anton',sans-serif;font-size:clamp(20px,2vw,30px);text-transform:uppercase;margin-bottom:14px;letter-spacing:.02em;color:var(--cream)}
.step p{font-size:14.5px;font-weight:300;color:var(--cream-dim);line-height:1.7}
.step .tag{display:inline-block;margin-top:18px;font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--emerald-bright);border:1px solid rgba(16,185,129,.35);padding:7px 14px;border-radius:999px}

/* ---------- karty referencí ---------- */
.quotes{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:22px}
.quote{border:1px solid rgba(243,236,221,.14);border-radius:18px;padding:34px 30px;background:rgba(12,15,13,.6);position:relative}
.quote .qmark{font-family:'Anton',sans-serif;font-size:64px;line-height:.55;color:var(--emerald);margin-bottom:22px}
.quote p{font-size:15px;font-weight:300;color:var(--cream);line-height:1.75;font-style:italic}
.quote .who{margin-top:22px;display:flex;align-items:center;gap:14px;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--cream-dim)}
/* fotka klienta — jakýkoli zdrojový rozměr se ořízne do stejného kruhu */
.quote .who .avatar{flex:0 0 52px;width:52px;height:52px;border-radius:50%;object-fit:cover;border:1px solid rgba(16,185,129,.4);background:rgba(243,236,221,.06)}
.quote .who b{display:block;color:var(--emerald-bright);letter-spacing:.16em;margin-bottom:4px;font-weight:600}

/* ---------- drobnosti ---------- */
.ctanote{width:100%;text-align:center;font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--cream-dim);margin-top:10px}
.todo{background:rgba(220,80,80,.14);border:1px dashed rgba(220,80,80,.55);padding:2px 10px;border-radius:6px;color:#e88;font-style:normal}