/* RoseOS (rose-os.php) — vzhled produktové stránky: velký hero, lokální navigace,
   bento karty, tmavá sekce, plynulé odkrývání při scrollu. */
.ros-body { background: #fbfbfd; }
.ros { --ros-text: #1d1d1f; --ros-sedy: #6e6e73; --ros-ruze: #c8102e; --ros-tmava: #0b0b0d;
  color: var(--ros-text); font-family: 'Poppins', -apple-system, 'SF Pro Display', system-ui, sans-serif; overflow-x: clip; }
.ros h1, .ros h2, .ros h3, .ros p { margin: 0; }

/* Odkrývání při scrollu */
.ros-reveal { opacity: 0; transform: translateY(28px); transition: opacity .9s cubic-bezier(.2,.7,.2,1), transform .9s cubic-bezier(.2,.7,.2,1); }
.ros-reveal.je-videt { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .ros-reveal { opacity: 1; transform: none; transition: none; } }
.ros-bento .ros-reveal:nth-child(2) { transition-delay: .08s; }
.ros-bento .ros-reveal:nth-child(3) { transition-delay: .16s; }
.ros-bento .ros-reveal:nth-child(4) { transition-delay: .24s; }

/* Hero */
.ros-hero { min-height: 92vh; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center;
  padding: 120px 20px 60px; background: radial-gradient(1200px 600px at 50% -10%, #ffe1e5 0%, rgba(255,225,229,0) 60%), #fbfbfd; }
.ros-nadpis-maly { font-size: 1.05rem; font-weight: 600; color: var(--ros-ruze); letter-spacing: .02em; margin-bottom: 14px; }
.ros-titul { font-size: clamp(4.5rem, 16vw, 11rem); line-height: .95; font-weight: 700; letter-spacing: -.045em; font-family: 'Playfair Display', serif; }
.ros-titul span { background: linear-gradient(180deg, #1d1d1f 30%, #6e6e73); -webkit-background-clip: text; background-clip: text; color: transparent; }
.ros-titul .ros-os { background: linear-gradient(120deg, #c8102e, #ff6b6b 55%, #ffa45c); -webkit-background-clip: text; background-clip: text; color: transparent; font-style: italic; }
.ros-slogan { font-size: clamp(1.25rem, 3.4vw, 2rem); font-weight: 500; line-height: 1.35; color: var(--ros-sedy); margin-top: 22px; letter-spacing: -.01em; }
.ros-tlacitka { display: flex; gap: 14px; flex-wrap: wrap; justify-content: center; margin-top: 30px; }
.ros-btn { display: inline-block; padding: 13px 26px; border-radius: 999px; font-size: 1.02rem; font-weight: 600; text-decoration: none; transition: transform .2s, background .2s; }
.ros-btn-hlavni { background: var(--ros-ruze); color: #fff; }
.ros-btn-hlavni:hover { background: #a10d25; transform: scale(1.03); }
.ros-btn-odkaz { color: var(--ros-ruze); padding-left: 8px; padding-right: 8px; }
.ros-btn-odkaz:hover { text-decoration: underline; }
.ros-cisla { display: flex; gap: clamp(22px, 6vw, 70px); justify-content: center; margin-top: 64px; flex-wrap: wrap; }
.ros-cisla div { display: flex; flex-direction: column; align-items: center; }
.ros-cisla strong { font-size: clamp(2.4rem, 6vw, 3.6rem); font-weight: 700; letter-spacing: -.03em; line-height: 1; }
.ros-cisla span { font-size: .9rem; color: var(--ros-sedy); margin-top: 6px; }

/* Lokální navigace */
.ros-lokalni { position: sticky; top: 0; z-index: 30; display: flex; justify-content: space-between; align-items: center; gap: 16px;
  padding: 12px max(20px, calc((100% - 1100px) / 2)); background: rgba(251,251,253,.78); backdrop-filter: saturate(180%) blur(20px); -webkit-backdrop-filter: saturate(180%) blur(20px);
  border-bottom: 1px solid rgba(0,0,0,.08); }
.ros-lokalni-znacka { font-weight: 700; font-size: 1.05rem; letter-spacing: -.01em; }
.ros-lokalni-odkazy { display: flex; align-items: center; gap: clamp(12px, 3vw, 28px); overflow-x: auto; scrollbar-width: none; }
.ros-lokalni-odkazy::-webkit-scrollbar { display: none; }
.ros-lokalni-odkazy a { color: var(--ros-sedy); text-decoration: none; font-size: .88rem; white-space: nowrap; transition: color .2s; }
.ros-lokalni-odkazy a:hover { color: var(--ros-text); }
.ros-lokalni-odkazy .ros-lokalni-cta { background: var(--ros-ruze); color: #fff; padding: 6px 16px; border-radius: 999px; font-weight: 600; }
.ros-lokalni-odkazy .ros-lokalni-cta:hover { color: #fff; background: #a10d25; }

/* Prohlášení */
.ros-prohlaseni { padding: clamp(90px, 16vw, 190px) 20px; text-align: center; }
.ros-prohlaseni p { max-width: 980px; margin: 0 auto; font-size: clamp(1.8rem, 5.4vw, 4rem); font-weight: 700; line-height: 1.12; letter-spacing: -.035em; color: #b0b0b6; }
.ros-prohlaseni span { color: var(--ros-text); }

/* Sekce */
.ros-sekce { padding: clamp(70px, 10vw, 130px) 20px; scroll-margin-top: 50px; }
.ros-sekce-vnitrek { max-width: 1100px; margin: 0 auto; }
.ros-sekce-hlavicka { margin-bottom: 44px; }
.ros-stitek { display: inline-block; padding: 5px 14px; border-radius: 999px; font-size: .82rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; margin-bottom: 14px; }
.ros-stitek-hotovo { background: #e3f6e6; color: #1b7a2c; }
.ros-stitek-rozpracovano { background: rgba(255,159,10,.18); color: #ffb340; }
.ros-stitek-planovano { background: #ececf0; color: #6e6e73; }
.ros-sekce-hlavicka h2 { font-size: clamp(2rem, 5vw, 3.4rem); font-weight: 700; letter-spacing: -.03em; line-height: 1.08; max-width: 720px; }

/* Bento karty */
.ros-bento { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.ros-karta { position: relative; padding: 34px 30px 36px; border-radius: 28px; background: #fff; box-shadow: 0 2px 30px rgba(0,0,0,.05); overflow: hidden;
  transition: transform .35s cubic-bezier(.2,.7,.2,1), box-shadow .35s; }
.ros-karta:hover { transform: translateY(-4px) scale(1.012); box-shadow: 0 18px 50px rgba(0,0,0,.10); }
.ros-karta-velka { grid-column: span 2; grid-row: span 2; display: flex; flex-direction: column; justify-content: flex-end; min-height: 380px;
  background: linear-gradient(145deg, #fff0f2, #ffe0c9); }
.ros-karta-velka h3 { font-size: clamp(1.8rem, 3.6vw, 2.6rem) !important; }
.ros-karta-velka p { font-size: 1.1rem !important; max-width: 520px; }
.ros-karta-velka .ros-ikona { font-size: 4.5rem; position: absolute; top: 30px; right: 36px; filter: drop-shadow(0 10px 20px rgba(200,16,46,.25)); }
.ros-ikona { display: block; font-size: 2.4rem; margin-bottom: 18px; line-height: 1; }
.ros-karta h3 { font-size: 1.35rem; font-weight: 700; letter-spacing: -.02em; line-height: 1.2; margin-bottom: 10px; }
.ros-karta p { font-size: .98rem; line-height: 1.6; color: var(--ros-sedy); }

/* Rozpracováno — tmavá sekce */
.ros-rozpracovano { background: var(--ros-tmava); color: #f5f5f7; }
.ros-rozpracovano .ros-sekce-hlavicka h2 { color: #f5f5f7; }
.ros-rozpracovano .ros-karta { background: #1c1c1f; box-shadow: none; border: 1px solid rgba(255,255,255,.08); }
.ros-rozpracovano .ros-karta:hover { box-shadow: 0 18px 50px rgba(200,16,46,.22); }
.ros-rozpracovano .ros-karta p { color: #a1a1a6; }
.ros-prubeh { height: 5px; border-radius: 999px; background: rgba(255,255,255,.12); margin-top: 24px; overflow: hidden; }
.ros-prubeh i { display: block; height: 100%; width: 62%; border-radius: 999px; background: linear-gradient(90deg, #ff9f0a, #ff453a); animation: ros-prubeh 2.6s ease-in-out infinite alternate; }
@keyframes ros-prubeh { from { width: 38%; } to { width: 82%; } }
@media (prefers-reduced-motion: reduce) { .ros-prubeh i { animation: none; } }

/* Plánováno */
.ros-planovano { background: #f5f5f7; }
.ros-planovano .ros-karta { background: transparent; box-shadow: none; border: 1.5px dashed #c7c7cc; }
.ros-planovano .ros-karta:hover { box-shadow: none; border-color: var(--ros-ruze); }
.ros-planovano .ros-ikona { opacity: .6; filter: grayscale(.4); }

/* Závěr */
.ros-zaver { text-align: center; padding: clamp(90px, 14vw, 170px) 20px; background: radial-gradient(900px 420px at 50% 100%, #ffe1e5 0%, rgba(255,225,229,0) 70%); }
.ros-zaver h2 { font-size: clamp(2.2rem, 6.4vw, 4.6rem); font-weight: 700; letter-spacing: -.04em; line-height: 1.05; max-width: 900px; margin: 0 auto; }
.ros-zaver p { font-size: clamp(1.1rem, 2.4vw, 1.5rem); color: var(--ros-sedy); margin-top: 18px; }

/* Tablet a telefon */
@media (max-width: 900px) {
  .ros-bento { grid-template-columns: repeat(2, 1fr); }
  .ros-karta-velka { grid-column: span 2; grid-row: auto; min-height: 300px; }
}
@media (max-width: 600px) {
  .ros-bento { grid-template-columns: 1fr; }
  .ros-karta-velka { grid-column: auto; }
  .ros-karta { padding: 28px 24px; border-radius: 24px; }
  .ros-hero { min-height: 80vh; padding-top: 100px; }
  .ros-lokalni-znacka { display: none; }
  .ros-lokalni { justify-content: center; }
}

/* ---- Ladění barev a počtu karet ---- */
/* Málo karet v sekci: rozšířit na celou šířku místo osamocené třetiny */
.ros-bento.ros-n1 { grid-template-columns: 1fr; }
.ros-bento.ros-n2 { grid-template-columns: repeat(2, 1fr); }
.ros-bento.ros-n1 .ros-karta { display: grid; grid-template-columns: auto 1fr; column-gap: 32px; align-items: center; padding: 42px 44px; }
.ros-bento.ros-n1 .ros-ikona { grid-row: span 2; font-size: 4.2rem; margin: 0; }
.ros-bento.ros-n1 .ros-karta h3 { font-size: clamp(1.5rem, 3vw, 2.1rem); margin-bottom: 8px; }
.ros-bento.ros-n1 .ros-karta p { font-size: 1.08rem; max-width: 720px; }
.ros-bento.ros-n1 .ros-prubeh { grid-column: 2; }
.ros-bento.ros-n2 .ros-karta { padding: 40px 34px 42px; }
.ros-bento.ros-n2 .ros-ikona { font-size: 3rem; }
.ros-bento.ros-n2 .ros-karta h3 { font-size: 1.6rem; }

/* Už funguje: jemně zelenkavé pozadí sekce, ať se odliší od hero */
.ros-hotovo { background: linear-gradient(180deg, #fbfbfd 0%, #eef8f0 100%); }
.ros-hotovo .ros-karta { border: 1px solid rgba(27,122,44,.10); }

/* Právě stavíme: tmavá s teplým oranžovým akcentem, jasnější text */
.ros-rozpracovano { background: radial-gradient(900px 500px at 85% 0%, rgba(255,159,10,.16), transparent 60%), #0b0b0d; }
.ros-rozpracovano .ros-sekce-hlavicka h2, .ros-rozpracovano .ros-karta h3 { color: #fff; }
.ros-rozpracovano .ros-karta p { color: #c7c7cc; }
.ros-rozpracovano .ros-karta { background: linear-gradient(160deg, #232326, #17171a); border-color: rgba(255,159,10,.22); }

/* Chystáme: levandulová místo šedé, ať nesplývá s hero a závěrem */
.ros-planovano { background: linear-gradient(180deg, #eef0ff 0%, #f5ecff 100%); }
.ros-planovano .ros-stitek-planovano { background: #e1e2ff; color: #4b4fc4; }
.ros-planovano .ros-sekce-hlavicka h2 { color: #2c2a5a; }
.ros-planovano .ros-karta { background: rgba(255,255,255,.7); border: 1.5px dashed #a9a7e8; }
.ros-planovano .ros-karta h3 { color: #2c2a5a; }
.ros-planovano .ros-karta p { color: #56547e; }
.ros-planovano .ros-karta:hover { border-color: #6c63ff; background: #fff; }
.ros-planovano .ros-ikona { opacity: 1; filter: none; }

/* Závěr: sytá růžová se světlým textem — jasný konec stránky */
.ros-zaver { background: linear-gradient(135deg, #8f0c22 0%, #c8102e 50%, #ff6b4a 100%); color: #fff; }
.ros-zaver h2 { color: #fff; }
.ros-zaver p { color: rgba(255,255,255,.85); }
.ros-zaver .ros-btn-hlavni { background: #fff; color: #c8102e; }
.ros-zaver .ros-btn-hlavni:hover { background: #ffe9ec; }
.ros-zaver .ros-btn-odkaz { color: #fff; }

@media (max-width: 700px) {
  .ros-bento.ros-n2 { grid-template-columns: 1fr; }
  .ros-bento.ros-n1 .ros-karta { grid-template-columns: 1fr; padding: 30px 26px; }
  .ros-bento.ros-n1 .ros-ikona { grid-row: auto; font-size: 3rem; margin-bottom: 14px; }
  .ros-bento.ros-n1 .ros-prubeh { grid-column: 1; }
}

/* ---- Oprava: styl.css nastavuje section:nth-child(odd/even) { background }, což mělo vyšší
   specificitu než třídy sekcí (bílé pozadí pod bílým textem). Proto zesílený selektor. ---- */
.ros section.ros-hero { background: radial-gradient(1200px 600px at 50% -10%, #ffe1e5 0%, rgba(255,225,229,0) 60%), #fbfbfd; }
.ros section.ros-prohlaseni { background: #fbfbfd; }
.ros section.ros-hotovo { background: linear-gradient(180deg, #fbfbfd 0%, #eef8f0 100%); }
.ros section.ros-rozpracovano { background: radial-gradient(900px 500px at 85% 0%, rgba(255,159,10,.16), transparent 60%), #0b0b0d; color: #f5f5f7; }
.ros section.ros-planovano { background: linear-gradient(180deg, #eef0ff 0%, #f5ecff 100%); }
.ros section.ros-zaver { background: linear-gradient(135deg, #8f0c22 0%, #c8102e 50%, #ff6b4a 100%); color: #fff; }

/* SVG ikony místo emoji */
.ros-ikona .zi { width: 1em; height: 1em; color: var(--ros-akcent, #c8102e); stroke-width: 1.5; vertical-align: 0; }
