/* ==========================================================================
   Stopy v srdci — v2-base.css
   Sdílený základ nového vzhledu (redesign 9/2026).

   Načítá ho každá stránka s `$body_class = 'v2'` (domovská, landingy, …).
   Obsahuje jen to, co je společné: fonty, barevné tokeny, typografii,
   kontejner, tlačítka, pilulky, tmavý závěrečný pás a vypnutí bronzového
   pruhu nad patičkou.

   Vše je pod `body.v2 #main-content`, takže se nedotkne administrace,
   dashboardů, editoru memoriálu ani stránek, které v2 nemají.
   Header, menu a patička zůstávají z app.css beze změny.
   ========================================================================== */

/* ── Inter (lokálně, latin + latin-ext kvůli diakritice) ─────────────────── */
@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;
  src:url('/assets/fonts/inter-latin-ext-400.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;
  src:url('/assets/fonts/inter-latin-400.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;
  src:url('/assets/fonts/inter-latin-ext-500.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;
  src:url('/assets/fonts/inter-latin-500.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;
  src:url('/assets/fonts/inter-latin-ext-600.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;
  src:url('/assets/fonts/inter-latin-600.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Inter';font-style:normal;font-weight:700;font-display:swap;
  src:url('/assets/fonts/inter-latin-ext-700.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Inter';font-style:normal;font-weight:700;font-display:swap;
  src:url('/assets/fonts/inter-latin-700.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}

/* ── Tokeny ─────────────────────────────────────────────────────────────── */
body.v2{
  --ink:#1C1A18;        /* 15,3:1 na bílé */
  --ink-2:#5B554F;      /* 7,1:1 */
  --ink-3:#78726A;      /* 4,8:1 – popisky */
  --paper:#FFFFFF;
  --paper-2:#F6F5F2;
  --line:#E5E2DC;

  --accent:#5A4B8C;     /* jediná barva akce – 7,45:1 s bílým textem, měkčí odstín než původní #453775 */
  --accent-hi:#453A6C;
  --accent-2:#8577BE;   /* dekorace, přechody, rámeček portrétu */
  --accent-soft:#EFECF7;

  --sky-top:#F3F2F0; --sky-mid:#EFEDE9; --sky-glow:#F7E8DB;
  --tint-1:#F1EFEB; --tint-2:#EFEBE5; --tint-3:#EDEFF1; --tint-4:#EBEFEA; --tint-5:#F2EFEC;

  --dark:#0c0b11; --dark-2:#1a1822; --dark-text:#F3F0F7; --dark-muted:#C9C3D6;
  --app-accent:#c9a8e8;

  --hand:'Patrick Hand',cursive;
  --sans:'Inter',system-ui,-apple-system,'Segoe UI',Arial,sans-serif;

  --r-xl:20px; --r-lg:14px; --r-md:10px;
  --shadow-lg:0 24px 48px -18px rgba(28,26,24,.24),0 8px 18px -10px rgba(28,26,24,.16);
  --shadow-md:0 10px 22px -12px rgba(28,26,24,.18);
  --max:1200px; --gutter:clamp(16px,3vw,32px);

  /* Typografie a rytmus – hodnoty z výzkumu, ne z odhadu:
     – tělo 16 px (Baymard/WCAG minimum, browser default), řádkování 1.55
       (WCAG 1.4.12 vyžaduje podporu 1.5)
     – délka řádku max 68ch ≈ 66 znaků, tedy střed pásma 50–75 CPL
       (Bringhurst, Dyson & Haselgrove, Baymard)
     – svislý rytmus po 8 px; sekce 48–72 px místo 72–120 px */
  --fs-body:16px; --lh-body:1.55; --measure:56ch;
  --sp-1:8px; --sp-2:14px; --sp-3:22px; --sp-4:28px; --sp-5:40px;
  --section-y:clamp(28px,2.6vw,40px);

  background:var(--paper);
}

/* ── Základ obsahu ──────────────────────────────────────────────────────── */
body.v2 #main-content{
  font-family:var(--sans);font-size:var(--fs-body);line-height:var(--lh-body);
  color:var(--ink);background:var(--paper);
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
}
body.v2 #main-content *,
body.v2 #main-content *::before,
body.v2 #main-content *::after{box-sizing:border-box}

body.v2 #main-content h1,body.v2 #main-content h2,
body.v2 #main-content h3,body.v2 #main-content h4{
  font-family:var(--sans);font-weight:700;letter-spacing:-.02em;line-height:1.1;color:var(--ink);margin:0;
}
body.v2 #main-content p{margin:0}
/* Nadpis na začátku bloku nemá horní odsazení – jinak se sčítá
   s odsazením sekce a vzniká mezera přes 150 px. */
body.v2 #main-content :is(h2,h3,h4,[class*="-h2"],[class*="-h3"],[class*="-title"]):first-child{margin-top:0}
body.v2 #main-content ul,body.v2 #main-content ol{list-style:none;margin:0;padding:0}
body.v2 #main-content a{color:inherit;text-decoration:none}
body.v2 #main-content img{max-width:100%}

body.v2 #main-content .v2-wrap,
body.v2 #main-content .container{
  max-width:var(--max);margin:0 auto;padding:0 var(--gutter);width:100%;
}

body.v2 #main-content .v2-h2{font-size:clamp(1.55rem,2.4vw,2.05rem)}
body.v2 #main-content .v2-h3{font-size:clamp(1.15rem,1.6vw,1.35rem)}
body.v2 #main-content .v2-lead{font-size:1.06rem;color:var(--ink-2);max-width:var(--measure)}
body.v2 #main-content .v2-sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
body.v2 #main-content .v2-sig{font-family:var(--hand);font-size:1.2rem;color:var(--accent);margin-top:var(--sp-2)}
body.v2 #main-content .v2-sig--dark{margin:0 0 8px;color:var(--accent)}

/* ── Tlačítka a odkazy ──────────────────────────────────────────────────── */
body.v2 #main-content .v2-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  height:46px;padding:0 22px;border-radius:999px;
  font:600 .95rem var(--sans);border:1.5px solid transparent;box-shadow:none;
  text-align:center;line-height:1;white-space:nowrap;
}
body.v2 #main-content .v2-btn--fill{background:var(--accent);color:#fff}
body.v2 #main-content .v2-btn--fill:hover,
body.v2 #main-content .v2-btn--fill:focus-visible{background:var(--accent-hi);color:#fff}
body.v2 #main-content .v2-btn--ghost{background:#fff;border-color:var(--line);color:var(--ink)}
body.v2 #main-content .v2-btn--ghost:hover,
body.v2 #main-content .v2-btn--ghost:focus-visible{border-color:var(--ink)}
/* Tlačítko s delším textem (celá věta místo 2-3 slov) se smí zalomit
   do víc řádků - jinak "white-space:nowrap" výš žene šířku ven z karty. */
body.v2 #main-content .v2-btn--wrap{
  height:auto;min-height:46px;padding:12px 22px;white-space:normal;line-height:1.35;max-width:100%;
}
body.v2 #main-content .v2-link{color:var(--accent);font-weight:600;text-decoration:underline;text-underline-offset:.2em}
body.v2 #main-content .v2-link:hover{color:var(--accent-hi)}
body.v2 #main-content .v2-acts{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;margin-top:var(--sp-3)}
body.v2 #main-content :is(a,button,input):focus-visible{outline:3px solid var(--accent);outline-offset:3px}

/* Pilulka – sekundární odkaz (spolupráce, „více o…") */
body.v2 #main-content .v2-pill{
  display:inline-block;padding:8px 16px;border-radius:999px;
  background:#fff;border:1px solid var(--line);
  color:var(--accent);font-weight:600;font-size:.98rem;text-decoration:none;
}
body.v2 #main-content .v2-pill:hover,
body.v2 #main-content .v2-pill:focus-visible{border-color:var(--accent);background:var(--accent-soft)}

/* ── Tmavý závěrečný pás (společný pro všechny v2 stránky) ──────────────── */
/* Pozadí musí sahat od okraje k okraji okna (proto barva a padding na
   .v2-cta, ne na .v2-cta__box) - ale OBSAH uvnitř (nadpis, text,
   tlačítka) musí držet stejnou hranici 1200 px jako zbytek stránky,
   proto max-width+margin:auto na .v2-cta__box zvlášť, jako druhou
   vrstvu nad pozadím. Dřív bylo obojí na jednom elementu, takže
   zúžení obsahu zúžilo i pozadí (vypadalo to jako uřízlý pruh) a dřív
   předtím zas mělo pozadí max-width žádný, takže text/tlačítko
   přesahovalo za hranici obsahu stránky. */
body.v2 #main-content .v2-cta{padding:0;margin:0;background:var(--dark)}
body.v2 #main-content .v2-cta .v2-wrap{padding-left:0;padding-right:0;max-width:none}
body.v2 #main-content .v2-cta__box{
  display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:32px;align-items:center;
  max-width:var(--max);margin-inline:auto;
  padding:clamp(30px,3.4vw,46px) var(--gutter);border-radius:0;
  color:#fff;
}
body.v2 #main-content .v2-cta__box .v2-h2{color:#fff}
body.v2 #main-content .v2-cta__box p{margin-top:10px;font-size:1rem;color:var(--dark-muted);max-width:var(--measure)}
body.v2 #main-content .v2-cta__acts{display:flex;flex-wrap:wrap;gap:12px;justify-content:flex-end}
body.v2 #main-content .v2-cta__acts .v2-btn{height:48px;padding:0 24px;font-size:1rem}
body.v2 #main-content .v2-cta__acts .v2-btn--fill{background:var(--app-accent);color:var(--dark);border-color:var(--app-accent)}
body.v2 #main-content .v2-cta__acts .v2-btn--fill:hover{background:#DCC4F2;color:var(--dark)}
body.v2 #main-content .v2-cta__acts .v2-btn--ghost{background:transparent;border-color:rgba(255,255,255,.65);color:#fff}
body.v2 #main-content .v2-cta__acts .v2-btn--ghost:hover{border-color:#fff;background:rgba(255,255,255,.1)}

/* ── Patička: vypnout bronzový pruh ze staré palety ─────────────────────── */
/* app.css kreslí nad patičkou 5px gradient v bronzu (.site-footer::before)
   a 1px border. S tmavým závěrečným pásem to vypadá jako chyba. Patička
   samotná (barvy, obsah) zůstává beze změny. */
body.v2 .site-footer{border-top:0 !important}
body.v2 .site-footer::before{display:none !important}

@media (max-width:1024px){
  body.v2 #main-content .v2-cta__box{grid-template-columns:minmax(0,1fr)}
  body.v2 #main-content .v2-cta__acts{justify-content:flex-start}
}
@media (max-width:640px){
  body.v2 #main-content .v2-btn{width:100%}
  body.v2 #main-content .v2-acts,
  body.v2 #main-content .v2-cta__acts{gap:12px}
}

/* ── ODZNAKY APP STORE / GOOGLE PLAY (partials/store-badges.php) ─────────
   Sdílené napříč stránkami, co partial vkládají (landing, home, okruhy) –
   proto tady v základu, ne v landing-v2.css. Bez tohoto pravidla nemá
   googleplay-*.svg (má jen viewBox, žádný width/height) žádnou výšku a
   vykreslí se v přirozeném poměru stran přes celou dostupnou šířku. */
body.v2 #main-content .lp-app-badges{
  display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:var(--sp-3);
}
body.v2 #main-content .lp-app-badges-center{justify-content:center}
body.v2 #main-content .lp-app-badge{display:inline-flex;line-height:0}
body.v2 #main-content .lp-app-badge img{height:44px;width:auto;display:block}
body.v2 #main-content .lp-app-badge-off{pointer-events:none}