/* UpRising s.r.o. — sdílený styl (v1.4.0) */
:root{
  --paper:#f4f1e9;
  --paper-2:#eae4d8;
  --ink:#1a1815;        /* hlavní text — kontrast ~14:1 */
  --ink-soft:#514a3c;   /* sekundární text — kontrast ~7:1 */
  --clay:#8a5220;       /* akcent pro text/odkazy — kontrast ~5.6:1 (AA) */
  --clay-line:#b98a55;  /* dekorativní linky */
  --line:#d7cfbf;
  --card:#faf8f2;
  --grey:#b8b0a0;      /* šedá pro reference ticker */
  --sec-cat:#e6d9be;   /* celá hlavní sekce — výraznější pruh barvy */
  --sec-sub:#f1ebdd;   /* celá podsekce — světlejší pruh barvy */
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  font-family:'Helvetica Neue',Helvetica,Arial,'Segoe UI',sans-serif;
  background:var(--paper);
  color:var(--ink);
  font-weight:400;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
.wrap{max-width:1120px;margin:0 auto;padding:0 32px}
@media(max-width:560px){.wrap{padding:0 22px}}
a{color:inherit;text-decoration:none}
::selection{background:var(--clay);color:#fff}
:focus-visible{outline:2px solid var(--clay);outline-offset:3px;border-radius:2px}

/* Reveal */
.rise{opacity:0;transform:translateY(20px);transition:opacity .9s cubic-bezier(.2,.7,.2,1),transform .9s cubic-bezier(.2,.7,.2,1)}
.rise.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.rise{opacity:1;transform:none;transition:none}}

/* Header */
header{position:sticky;top:0;z-index:20;background:rgba(244,241,233,.85);backdrop-filter:blur(12px);border-bottom:1px solid transparent;transition:border-color .3s}
header.scrolled{border-color:var(--line)}
.bar{display:flex;align-items:center;justify-content:space-between;height:70px}
.logo{display:flex;align-items:center}
.logo svg{height:34px;width:auto;display:block}
nav{display:flex;gap:32px;font-size:.85rem;font-weight:500;color:var(--ink-soft)}
nav a{position:relative;transition:color .25s}
nav a::after{content:"";position:absolute;left:0;bottom:-5px;width:0;height:2px;background:var(--clay);transition:width .3s}
nav a:hover,nav a[aria-current="page"]{color:var(--ink)}
nav a:hover::after,nav a[aria-current="page"]::after{width:100%}
@media(max-width:600px){nav{gap:18px;font-size:.78rem}}
@media(max-width:440px){nav a[data-opt]{display:none}}

/* Hero */
.hero{padding:130px 0 108px}
.hero.sub-hero{padding:118px 0 76px}
.eyebrow{display:flex;align-items:center;gap:14px;font-size:.78rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--clay);margin-bottom:34px}
.eyebrow::before{content:"";width:36px;height:2px;background:var(--clay-line)}
.hero h1{font-size:clamp(2.6rem,8vw,5.4rem);font-weight:700;line-height:1;letter-spacing:-.04em}
.sub-hero h1{font-size:clamp(2.3rem,6.5vw,4.2rem)}
.hero .punch{margin-top:34px;max-width:680px;font-size:clamp(1.25rem,2.6vw,1.7rem);line-height:1.35;font-weight:500;color:var(--ink)}
.hero .punch .beat{color:var(--clay);font-weight:700}
.hero .punch .beat span{display:inline-block;transform-origin:center;animation:beat 7s ease-in-out infinite;will-change:transform}
.hero .punch .beat span:nth-child(1){animation-delay:0s}
.hero .punch .beat span:nth-child(2){animation-delay:.55s}
.hero .punch .beat span:nth-child(3){animation-delay:1.1s}
.hero .punch .beat span:nth-child(4){animation-delay:1.65s}
@keyframes beat{0%,14%,100%{transform:scale(1)}7%{transform:scale(1.03)}}
@media(prefers-reduced-motion:reduce){.hero .punch .beat span{animation:none}}
.hero .sub{margin-top:22px;max-width:600px;font-size:1.08rem;color:var(--ink-soft)}
.hero .cta{margin-top:40px;display:flex;gap:16px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;gap:9px;font-size:.95rem;font-weight:600;padding:13px 24px;border-radius:100px;transition:transform .2s,background .25s,border-color .25s,color .25s}
.btn:hover{transform:translateY(-2px)}
.btn-primary{background:var(--ink);color:var(--paper)}
.btn-primary:hover{background:var(--clay)}
.btn-ghost{border:1.5px solid var(--line);color:var(--ink)}
.btn-ghost:hover{border-color:var(--clay);color:var(--clay)}

/* Section framing */
section{padding:96px 0}
.sec-head{display:flex;align-items:baseline;gap:18px;margin-bottom:56px;flex-wrap:wrap}
.sec-no{font-size:.85rem;font-weight:600;color:var(--clay);letter-spacing:.04em}
.sec-head h2{font-size:clamp(1.7rem,4.5vw,2.9rem);font-weight:700;line-height:1.05;letter-spacing:-.03em}
.sec-head .lead{margin-left:auto;max-width:360px;color:var(--ink-soft);font-size:1rem;text-align:right}
@media(max-width:720px){.sec-head .lead{margin-left:0;text-align:left;width:100%}}
.alt{background:var(--paper-2)}

/* Hierarchie — hlavní kategorie (Média, Posudky, JduLovit.cz) vs. podsekce */
/* Celá sekce je barevný pruh: hlavní výrazněji, podsekce světleji. Bez linky nad nadpisem. */
section:has(.sec-head.cat){background:var(--sec-cat)}
section:has(.sec-head.sub){background:var(--sec-sub)}
.sec-head.cat .sec-no{color:var(--clay)}
.sec-head.cat h2{color:var(--clay)}
.sec-head.sub{margin-bottom:44px}
.sec-head.sub .sec-no{color:var(--clay-line)}
.sec-head.sub h2{font-size:clamp(1.3rem,3.2vw,1.95rem);color:var(--ink-soft);font-weight:600}
.sec-head.sub h2::before{content:"↳ ";color:var(--clay-line);font-weight:400}

/* Pillars — homepage tři pilíře */
.pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
@media(max-width:820px){.pillars{grid-template-columns:1fr}}
.pillar{display:flex;flex-direction:column;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:34px 30px;transition:transform .3s,box-shadow .3s,border-color .3s}
.pillar:hover{transform:translateY(-4px);box-shadow:0 18px 40px -24px rgba(26,24,21,.4);border-color:var(--clay-line)}
.pillar .picon{width:46px;height:46px;margin-bottom:18px;color:var(--clay)}
.pillar .picon svg{width:100%;height:100%;display:block;stroke:currentColor;stroke-width:1.6;fill:none;stroke-linecap:round;stroke-linejoin:round}
.pillar .pno{font-size:.8rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--clay)}
.pillar h3{margin-top:12px;font-size:1.55rem;font-weight:700;line-height:1.1;letter-spacing:-.02em}
.pillar p{margin-top:14px;color:var(--ink-soft);font-size:1rem;flex-grow:1}
.pillar .more{margin-top:22px;font-size:.95rem;font-weight:600;color:var(--clay);border-bottom:2px solid var(--clay-line);padding-bottom:2px;align-self:flex-start;transition:border-color .2s}
.pillar:hover .more{border-color:var(--clay)}

/* Services — grid rows */
.rows{border-top:2px solid var(--ink)}
.row{display:grid;grid-template-columns:64px 1fr 1.25fr;gap:28px;align-items:start;padding:34px 0;border-bottom:1px solid var(--line);transition:padding-left .3s,background .3s}
.row:hover{background:var(--card);padding-left:12px}
.row .idx{font-size:1.05rem;font-weight:600;color:var(--clay);padding-top:5px}
.row h3{font-size:1.4rem;font-weight:600;line-height:1.15;letter-spacing:-.02em}
.row .body p{color:var(--ink-soft);font-size:1.02rem}
.row .body .more{display:inline-block;margin-top:14px;font-size:.95rem;font-weight:500;color:var(--clay);border-bottom:2px solid var(--clay-line);padding-bottom:2px;transition:border-color .2s}
.row .body .more:hover{border-color:var(--clay)}
.row .body .more + .more{margin-left:20px}
.row .tags{margin-top:16px;display:flex;flex-wrap:wrap;gap:8px}
.tag{font-size:.75rem;font-weight:500;color:var(--ink-soft);border:1px solid var(--line);border-radius:100px;padding:5px 13px;background:var(--paper)}
@media(max-width:720px){.row{grid-template-columns:40px 1fr;gap:8px 16px}.row .body{grid-column:1/-1;margin-top:8px}.row:hover{padding-left:0}}

/* Stats — číselné dlaždice */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:2px;background:var(--line);border:1px solid var(--line);border-radius:16px;overflow:hidden}
@media(max-width:820px){.stats{grid-template-columns:repeat(2,1fr)}}
@media(max-width:440px){.stats{grid-template-columns:1fr}}
.stat{background:var(--card);padding:34px 26px}
.stat .num{font-size:clamp(2.2rem,5vw,3.2rem);font-weight:800;line-height:1;letter-spacing:-.03em;color:var(--ink)}
.stat .num .u{font-size:.5em;font-weight:700;color:var(--clay);margin-left:2px}
.stat .lbl{margin-top:12px;font-size:.92rem;color:var(--ink-soft);line-height:1.4}
.stat .note{margin-top:6px;font-size:.75rem;color:var(--clay);font-weight:600;letter-spacing:.02em}
a.stat{display:block;color:inherit;text-decoration:none;transition:background .25s}
a.stat:hover{background:var(--paper)}
a.stat .lbl .go{color:var(--clay);font-weight:700;white-space:nowrap}
a.stat:hover .lbl .go{text-decoration:underline}

/* Process — jak to probíhá */
.steps{counter-reset:step;display:grid;gap:2px;border-top:2px solid var(--ink)}
.step{display:grid;grid-template-columns:64px 1fr;gap:24px;padding:28px 0;border-bottom:1px solid var(--line)}
.step .sn{counter-increment:step;font-size:1.4rem;font-weight:800;color:var(--clay-line)}
.step .sn::before{content:counter(step,decimal-leading-zero)}
.step h4{font-size:1.15rem;font-weight:600;letter-spacing:-.01em}
.step p{margin-top:8px;color:var(--ink-soft);font-size:1rem}

/* References — loga + citace */
.logos{display:grid;grid-template-columns:repeat(4,1fr);gap:2px;background:var(--line);border:1px solid var(--line);border-radius:16px;overflow:hidden}
@media(max-width:720px){.logos{grid-template-columns:repeat(2,1fr)}}
.logo-cell{background:var(--card);min-height:104px;display:flex;align-items:center;justify-content:center;padding:20px;text-align:center;font-weight:700;font-size:1.05rem;color:var(--ink-soft);letter-spacing:.02em;transition:color .25s,background .25s}
.logo-cell:hover{color:var(--ink);background:var(--paper)}
.quotes{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;margin-top:24px}
@media(max-width:720px){.quotes{grid-template-columns:1fr}}
.quote{background:var(--card);border:1px solid var(--line);border-left:3px solid var(--clay);border-radius:12px;padding:30px 28px}
.quote p{font-size:1.12rem;line-height:1.45;font-weight:500}
.quote .by{margin-top:18px;font-size:.9rem;color:var(--ink-soft);font-weight:600}
.quote .by span{display:block;font-weight:400;color:var(--clay)}

/* Reference — ticker: řádky nekonečně ujíždějí opačnými směry, kraje se rozplývají */
.refwrap{position:relative;margin-top:8px}
.ref-ticker{display:flex;flex-direction:column;gap:26px;overflow:hidden;padding:12px 0;transition:filter .4s,opacity .4s;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.ref-ticker .tk-row{display:flex;gap:46px;width:max-content;animation:tkL 34s linear infinite;will-change:transform}
.ref-ticker .tk-row.rev{animation:tkR 40s linear infinite}
.refwrap:hover .tk-row,.refwrap:focus-within .tk-row{animation-play-state:paused}
.ref-ticker .brand{font-weight:700;letter-spacing:-.015em;white-space:nowrap;line-height:1;font-size:clamp(1.05rem,2.4vw,1.5rem);color:var(--grey);transition:color .3s}
.ref-ticker .brand:hover{color:var(--ink)}
@keyframes tkL{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes tkR{from{transform:translateX(-50%)}to{transform:translateX(0)}}
/* Invite — skrytý, objeví se až po najetí nad reference */
.ref-invite{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:opacity .4s}
.refwrap:hover .ref-ticker,.refwrap:focus-within .ref-ticker{filter:blur(2px);opacity:.28}
.refwrap:hover .ref-invite,.refwrap:focus-within .ref-invite{opacity:1;pointer-events:auto}
.ref-invite a{display:inline-flex;align-items:center;gap:10px;background:var(--clay);color:#fff;font-weight:800;letter-spacing:-.01em;font-size:clamp(1.05rem,2.6vw,1.5rem);padding:15px 32px;border-radius:100px;box-shadow:0 24px 50px -22px rgba(138,82,32,.75);transform:translateY(8px) scale(.97);transition:transform .4s,box-shadow .3s}
.refwrap:hover .ref-invite a,.refwrap:focus-within .ref-invite a{transform:none}
@media(prefers-reduced-motion:reduce){.ref-ticker .tk-row{animation:none;flex-wrap:wrap;width:auto}.ref-ticker{-webkit-mask-image:none;mask-image:none}}

/* Tvoříme, abyste… — pevná mřížka čtyř dlaždic (bez animace, bez skákání) */
.growrow{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
@media(max-width:900px){.growrow{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.growrow{grid-template-columns:1fr}}
.growitem{display:flex;flex-direction:column;gap:16px;min-width:0;background:var(--card);border:1px solid var(--line);border-radius:18px;padding:30px 28px;
  transition:background .4s ease,color .4s ease,box-shadow .4s ease,transform .4s cubic-bezier(.2,.85,.2,1)}
.growitem .gn{font-weight:800;font-size:1.3rem;line-height:1;color:var(--clay);font-variant-numeric:tabular-nums;transition:color .4s}
.growitem p{font-weight:600;font-size:1.05rem;line-height:1.35;color:var(--ink-soft);margin:0;transition:color .4s}
.growitem:hover{background:var(--clay);color:#fff;box-shadow:0 22px 48px -26px rgba(138,82,32,.7);transform:translateY(-4px)}
.growitem:hover .gn{color:rgba(255,255,255,.82)}
.growitem:hover p{color:#fff}
@media(prefers-reduced-motion:reduce){.growitem,.growitem:hover{transition:none;transform:none}}

/* Media intro — dvojblok */
.mintro{display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:start}
@media(max-width:760px){.mintro{grid-template-columns:1fr;gap:28px}}
.mintro .big-num{font-size:clamp(2.6rem,7vw,4rem);font-weight:800;letter-spacing:-.03em;line-height:1;color:var(--ink)}
.mintro .big-num .u{color:var(--clay)}
.mintro .big-num + p{margin-top:14px;color:var(--ink-soft);font-size:1.05rem;max-width:360px}
.mintro .lead-p{font-size:1.12rem;color:var(--ink-soft);line-height:1.5}
.mintro .lead-p strong{color:var(--ink);font-weight:600}

/* Registry ledger */
.ledger{border-top:2px solid var(--ink)}
.lrow{display:grid;grid-template-columns:260px 1fr;gap:24px;padding:22px 0;border-bottom:1px solid var(--line)}
.lrow .k{color:var(--ink-soft);font-size:.8rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;padding-top:3px}
.lrow .v{font-size:1.08rem;font-weight:500}
.lrow .v small{display:block;color:var(--ink-soft);font-weight:400;font-size:.86rem;margin-top:3px}
.lrow .v .acct{font-variant-numeric:tabular-nums}
.lrow .v .acct + .acct{margin-top:10px}
@media(max-width:600px){.lrow{grid-template-columns:1fr;gap:5px;padding:18px 0}}

/* CTA band */
.band{background:var(--ink);color:var(--paper);border-radius:20px;padding:60px clamp(28px,6vw,72px)}
.band h2{font-size:clamp(1.8rem,4.5vw,3rem);font-weight:700;letter-spacing:-.03em;line-height:1.05;max-width:640px}
.band p{margin-top:18px;color:#cfc7b7;max-width:540px;font-size:1.05rem}
.band .cta{margin-top:34px;display:flex;gap:16px;flex-wrap:wrap}
.band .btn-primary{background:var(--paper);color:var(--ink)}
.band .btn-primary:hover{background:var(--clay);color:var(--paper)}
.band .btn-ghost{border-color:#4a4436;color:var(--paper)}
.band .btn-ghost:hover{border-color:var(--clay-line);color:var(--clay-line)}

/* CTA strip — editorial, ostré rohy (žádné zaoblení) */
.cta-sec{padding:36px 0}
.cta-strip{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;background:transparent;border:0;border-top:2px solid var(--ink);border-bottom:2px solid var(--ink);border-radius:0;padding:30px 4px}
.cta-strip p{font-size:clamp(1.2rem,3vw,1.7rem);font-weight:700;letter-spacing:-.02em;color:var(--ink)}
.cta-strip .btn{border-radius:0}
@media(max-width:520px){.cta-strip .btn{width:100%;justify-content:center}}

/* JduLovit.cz — představení projektu */
.project{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
@media(max-width:820px){.project{grid-template-columns:1fr;gap:32px}}
.project .lead-p{font-size:1.12rem;color:var(--ink-soft);line-height:1.55}
.project .lead-p strong{color:var(--ink);font-weight:600}
.project .facts{display:grid;gap:2px;background:var(--line);border:1px solid var(--line);border-radius:16px;overflow:hidden}
.project .fact{background:var(--card);padding:24px 26px;display:flex;align-items:baseline;gap:16px}
.project .fact .fn{font-size:clamp(1.7rem,4vw,2.4rem);font-weight:800;letter-spacing:-.02em;color:var(--ink);min-width:130px}
.project .fact .fn .u{color:var(--clay);font-size:.6em}
.project .fact .fl{color:var(--ink-soft);font-size:.98rem;line-height:1.35}

/* Contact */
.contact{padding:112px 0}
.contact .big{font-size:clamp(2.2rem,7vw,4.4rem);font-weight:700;line-height:1;letter-spacing:-.04em;margin-bottom:32px}
.contact .big a{border-bottom:3px solid var(--clay-line);transition:border-color .3s,color .3s}
.contact .big a:hover{color:var(--clay);border-color:var(--clay)}
.contact .links{display:flex;gap:36px;flex-wrap:wrap;color:var(--ink-soft);font-weight:500}
.contact .links a{border-bottom:2px solid var(--line);padding-bottom:2px;transition:border-color .3s,color .3s}
.contact .links a:hover{border-color:var(--clay);color:var(--ink)}

footer{border-top:1px solid var(--line);padding:36px 0}
.foot{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;color:var(--ink-soft);font-size:.82rem}
.foot nav{gap:22px}
