/* ============================================================================
   KONFERENCJA - CYTATY (konferencja-cytaty.html)
   ----------------------------------------------------------------------------
   Lista wypowiedzi: numer i portret | cytat po polsku, oryginał, autor,
   kontekst, źródło, udostępnianie. Wiersze rozdzielone liniami (jak .quote),
   bez kart; akcenty - czerwony odcinek górnej linii i znak cudzysłowu.
============================================================================ */
.cyt-hero .hero-h1 { max-width:13ch; }

/* Pierwszy ekran: portrety autorów jako skróty do cytatów */
.cyt-faces { margin-top:32px; }
.cyt-faces-list { display:flex; flex-wrap:wrap; padding-left:10px; }
.cyt-faces-list li { margin-left:-10px; }
.cyt-faces-list a { position:relative; display:flex; align-items:center; justify-content:center; width:58px; height:58px; border-radius:50%; overflow:hidden; border:3px solid var(--navy); background:var(--lavender); color:var(--brand); font-size:.85rem; font-weight:700; letter-spacing:.02em; }
.cyt-faces-list a:hover, .cyt-faces-list a:focus-visible { z-index:1; border-color:var(--brand-on-dark); }
.cyt-faces-list img { width:100%; height:100%; object-fit:cover; }
.cyt-faces-names { max-width:44ch; margin-top:14px; font-size:.95rem; line-height:1.55; color:rgba(255,255,255,.74); }
@media (max-width:640px) {
    .cyt-faces { margin-top:24px; }
    .cyt-faces-list { padding-left:8px; }
    .cyt-faces-list li { margin-left:-8px; }
    .cyt-faces-list a { width:48px; height:48px; font-size:.75rem; }
    .cyt-faces-names { font-size:.9rem; }
}

/* Wiersz cytatu: jedna siatka - telefon: numer, cytat, oryginał, portret + autor, przyciski */
.cyt-list { border-bottom:1px solid var(--border); }
.cyt { position:relative; padding:44px 0 48px; border-top:1px solid var(--border); }
.cyt::before { content:""; position:absolute; top:-1px; left:0; width:48px; height:2px; background:var(--red); }
.cyt-fig { display:grid; grid-template-columns:60px minmax(0,1fr); grid-template-areas:"n n" "q q" "en en" "photo who" "acts acts"; column-gap:16px; }
.cyt-n { grid-area:n; font-size:.82rem; font-weight:700; letter-spacing:.12em; color:var(--text-xmuted); font-variant-numeric:tabular-nums; }
.cyt-photo { grid-area:photo; align-self:start; width:60px; height:60px; margin-top:28px; border-radius:50%; object-fit:cover; background:var(--portrait-bg); }
.cyt-ini { display:flex; align-items:center; justify-content:center; font-size:1rem; font-weight:700; letter-spacing:.02em; color:var(--brand); background:var(--lavender); user-select:none; }
.cyt-q { grid-area:q; }
.cyt-en { grid-area:en; }
.cyt-who { grid-area:who; }
.cyt-acts { grid-area:acts; }
/* Komputer: duży portret w lewej kolumnie na całą wysokość wiersza */
@media (min-width:900px) {
    .cyt { padding:64px 0 68px; }
    .cyt-fig { grid-template-columns:184px minmax(0,1fr); grid-template-areas:"side q" "side en" "side who" "side acts"; grid-template-rows:auto auto auto 1fr; column-gap:56px; }
    .cyt-n, .cyt-photo { grid-area:side; align-self:start; }
    .cyt-photo { width:160px; height:160px; margin-top:34px; }
    .cyt-ini { font-size:2.4rem; }
}

/* Cytat po polsku: główny tekst; duży znak „ nad pierwszym wierszem */
.cyt-q { position:relative; max-width:30ch; margin-top:18px; padding-top:40px; font-size:clamp(1.5rem,3.2vw,2.35rem); font-weight:750; line-height:1.2; letter-spacing:-.025em; color:var(--text); }
/* „ leży na linii bazowej, więc pole znaku jest przesunięte wysoko nad tekst */
.cyt-open { position:absolute; top:-74px; left:-4px; font-size:6rem; font-weight:800; line-height:1; color:var(--red); }
@media (min-width:900px) {
    .cyt-q { margin-top:0; }
}
@media (max-width:640px) {
    .cyt-q { padding-top:30px; }
    .cyt-open { top:-56px; font-size:4.6rem; }
}
/* Oryginał */
.cyt-en { display:flex; gap:12px; max-width:62ch; margin-top:24px; padding:14px 18px; border-radius:var(--r); background:var(--lavender); font-size:1.03rem; line-height:1.55; font-style:italic; color:var(--text-body); }
.cyt-en abbr { flex:none; margin-top:3px; font-style:normal; font-size:.7rem; font-weight:700; letter-spacing:.1em; text-decoration:none; color:var(--brand-soft); }
@media (max-width:640px) {
    .cyt-en { padding:12px 14px; font-size:.98rem; }
}

/* Autor i kontekst */
.cyt-who { margin-top:28px; }
.cyt-name { font-size:1.12rem; font-weight:700; letter-spacing:-.01em; color:var(--text); }
.cyt-role { margin-top:2px; font-size:.97rem; color:var(--text-body); }
.cyt-ctx { display:flex; flex-wrap:wrap; gap:4px 18px; margin-top:10px; font-size:.92rem; color:var(--text-muted); }
.cyt-ctx span { display:inline-flex; align-items:baseline; gap:8px; }
.cyt-ctx i { flex:none; width:12px; font-size:.85em; text-align:center; color:var(--brand-soft); }
.cyt-src { margin-top:6px; font-size:.92rem; color:var(--text-muted); }
.cyt-src a { color:var(--brand); font-weight:600; text-decoration:underline; text-underline-offset:3px; }

/* Działania: LinkedIn i kopiowanie linku */
.cyt-acts { display:flex; flex-wrap:wrap; gap:10px; margin-top:24px; }
.cyt-acts .btn { min-height:44px; padding:9px 16px; font-size:.9rem; }
.cyt-acts .btn-li { background:#0A66C2; color:#fff; }
.cyt-acts .btn-li:hover { background:#004182; }
.cyt-copy { display:none; }
.js .cyt-copy { display:inline-flex; }
.cyt-copy.is-done { border-color:var(--brand); color:var(--brand); }
@media (max-width:480px) {
    .cyt-acts { flex-wrap:nowrap; }
    .cyt-acts .btn-li { flex:1 1 auto; }
    .cyt-acts .cyt-copy { flex:none; }
}
/* Najwęższe telefony: kopiowanie jako sama ikona (nazwa w aria-label), LinkedIn w jednym wierszu */
@media (max-width:400px) {
    .cyt-acts .cyt-copy { width:48px; padding:0; }
    .cyt-copy span { display:none; }
}

/* Uwagi i źródła zdjęć */
.cyt-notes { display:grid; gap:40px; }
@media (min-width:900px) {
    .cyt-notes { grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:72px; }
}
.cyt-notes h2 { font-size:1.15rem; font-weight:700; letter-spacing:-.01em; }
.cyt-notes p, .cyt-notes li { font-size:.92rem; line-height:1.6; color:var(--text-body); }
.cyt-notes p { margin-top:12px; }
.cyt-notes ul { margin-top:12px; }
.cyt-notes li + li { margin-top:8px; }
.cyt-notes a { color:var(--brand); text-decoration:underline; text-underline-offset:3px; overflow-wrap:anywhere; }

.cyt-cta { padding-top:0; }
.cyt-cta .hero-btns { justify-content:flex-start; }

@media print {
    .header, .cyt-acts, .cyt-faces-list, .cyt-cta, .footer, #cc-banner { display:none !important; }
    .cyt { break-inside:avoid; padding:28px 0; }
}