:root {
    --text: #1f1a1d;
    --muted: #6b5f65;
    --soft: #4a3d44;
    --line: #ecd5de;
    --pink: #f4c6d6;
    --pink-soft: #fdeef3;
    --pink-mid: #f9d9e5;
    --blue: #cfe0f3;
    --blue-soft: #e6eff9;
    --blue-line: #bcd3ee;
    --accent: #a8325f;
    --accent-blue: #2f5f94;
  }
  * { box-sizing: border-box; }
  body {
    margin: 0; background: #fff; color: var(--text);
    font-family: "Nunito", "Segoe UI", Roboto, Arial, sans-serif;
    font-size: 16px; line-height: 1.6;
    min-height: 100vh; display: flex; flex-direction: column;
  }
  main { flex: 1; }
  a { color: var(--accent); text-underline-offset: 3px; }
  a:hover { color: var(--accent-blue); }
  .wrap { width: min(920px, 90%); margin: 0 auto; }

  /* hlavička */
  header { background: var(--pink-soft); }
  header .wrap { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 10px 24px; padding: 18px 0; }
  .brand { font-weight: 800; font-size: 1.6rem; letter-spacing: .12em; color: var(--text); text-decoration: none; }
  .brand .lampi { display: inline-block; height: .72em; width: .56em; overflow: visible; vertical-align: baseline; margin: 0 .1em; }
  nav { display: flex; flex-wrap: wrap; gap: 4px; }
  nav a { padding: 5px 14px; border-radius: 999px; font-size: .92rem; color: var(--soft); text-decoration: none; }
  nav a:hover { background: var(--blue); color: var(--text); }
  nav a.current { background: var(--pink); color: var(--text); font-weight: 700; }

  /* úvod */
  .hero { position: relative; overflow: hidden; background: var(--pink-soft); padding: 40px 0 90px; }
  .hero::before {
    content: ""; position: absolute; width: 440px; height: 440px; border-radius: 50%;
    background: var(--blue-soft); right: -140px; top: -200px;
  }
  .hero::after {
    content: ""; position: absolute; width: 320px; height: 160px; border-radius: 320px 320px 0 0;
    background: var(--pink-mid); left: -90px; bottom: 0;
  }
  .hero-grid { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr minmax(0, 1.5fr) 1fr; gap: 36px; align-items: end; width: min(1100px, 92%); }
  .hero-text { text-align: center; align-self: center; padding-bottom: 20px; }
  .slogan { color: var(--accent); font-size: .85rem; letter-spacing: .12em; text-transform: uppercase; margin: 0 0 12px; }
  .hero h1 { font-weight: 800; font-size: clamp(2rem, 4.6vw, 3rem); line-height: 1.18; margin: 0 0 16px; }
  .hero p.lead { color: var(--soft); max-width: 460px; margin: 0 auto 26px; }
  .btn { display: inline-block; padding: 11px 26px; border-radius: 999px; background: var(--pink); border: 1px solid var(--pink); color: var(--text); text-decoration: none; font-weight: 600; }
  .btn:hover { background: var(--accent); border-color: var(--accent); color: #fff; }
  .btn.blue { background: var(--blue); border-color: var(--blue); }
  .btn.blue:hover { background: var(--accent-blue); border-color: var(--accent-blue); color: #fff; }

  .arch { display: flex; align-items: flex-end; justify-content: center; border-radius: 999px 999px 0 0; padding: 0 12%; width: 100%; }
  .arch.a1 { height: 330px; background: var(--blue); }
  .arch.a2 { height: 230px; background: var(--pink); }
  .arch svg { width: 100%; height: auto; display: block; }

  /* hlavička podstránky */
  .page-head { position: relative; overflow: hidden; background: var(--pink-soft); padding: 34px 0 70px; text-align: center; }
  .page-head::before { content: ""; position: absolute; width: 300px; height: 300px; border-radius: 50%; background: var(--blue-soft); right: -90px; top: -150px; }
  .page-head::after { content: ""; position: absolute; width: 240px; height: 120px; border-radius: 240px 240px 0 0; background: var(--pink-mid); left: -70px; bottom: 0; }
  .page-head .wrap { position: relative; z-index: 1; }
  .page-head h1 { margin: 0; font-weight: 800; font-size: clamp(1.8rem, 4vw, 2.6rem); line-height: 1.2; }

  /* odkazové karty na úvodnej stránke */
  .tiles.links { display: flex; flex-wrap: wrap; justify-content: center; }
  a.tile { flex: 0 1 200px; color: var(--text); text-decoration: none; padding: 44px 16px 26px; }
  a.tile:hover { background: var(--blue); color: var(--text); }
  a.tile h3 { font-size: 1.05rem; }

  .curve { display: block; width: 100%; height: 50px; margin-top: -49px; position: relative; z-index: 2; }

  /* sekcie */
  section { padding: 36px 0 20px; display: grid; grid-template-columns: 1fr; gap: 16px 32px; }
  section.stack { grid-template-columns: 1fr; }
  section + section { border-top: 1px solid var(--line); }
  section > h2 { margin: 0; font-size: .82rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--accent); }
  section > h2::before {
    content: ""; display: inline-block; width: 18px; height: 9px; margin-right: 9px;
    border-radius: 18px 18px 0 0; background: var(--blue-line);
  }
  section p { margin: 0 0 12px; }
  section h3 { margin: 20px 0 6px; font-size: 1rem; }
  section h3:first-child { margin-top: 0; }
  ul, ol { margin: 0 0 12px; padding-left: 20px; }
  li { margin-bottom: 4px; }
  .note { color: var(--muted); font-size: .93rem; }
  .wide { grid-column: 1 / -1; }

  /* ponuka a produkty – oblúkové karty */
  .tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 14px; }
  .tile {
    background: var(--blue-soft); text-align: center; padding: 26px 14px 20px;
    border-radius: 50% 50% 22px 22px / 84px 84px 22px 22px;
  }
  .tile svg { width: 82px; height: 82px; display: block; margin: 0 auto 10px; }
  .tile h3 { margin: 0 0 4px; font-size: .98rem; }
  .tile p { margin: 0; color: var(--muted); font-size: .88rem; line-height: 1.45; }

  .products { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 16px; margin-bottom: 12px; }
  .product {
    background: var(--blue-soft); padding: 30px 22px 22px; text-align: center;
    border-radius: 50% 50% 24px 24px / 110px 110px 24px 24px;
  }
  .product svg { width: 110px; height: 110px; display: block; margin: 0 auto 8px; }
  .product h3 { margin: 0 0 2px; font-size: 1.05rem; }
  .product small { display: block; color: var(--muted); margin-bottom: 8px; }
  .product p { margin: 10px 0 0; color: var(--soft); font-size: .93rem; line-height: 1.5; }
  .price { margin-top: 8px; display: inline-block; background: var(--pink); border-radius: 999px; padding: 2px 16px; font-weight: 700; }

  /* údaje */
  .panel { background: var(--pink-soft); border-radius: 28px; padding: 10px 28px; margin: 0; }
  .row { display: grid; grid-template-columns: 200px 1fr; gap: 4px 20px; padding: 9px 0; border-bottom: 1px solid var(--line); }
  .row:last-child { border-bottom: 0; }
  .row dt { color: var(--muted); }
  .row dd { margin: 0; overflow-wrap: anywhere; }

  /* dokumenty */
  .doc { display: flex; justify-content: space-between; align-items: center; gap: 12px; background: var(--blue-soft); border-radius: 26px; padding: 10px 14px 10px 22px; margin-bottom: 10px; }
  .chips { display: flex; gap: 6px; flex: none; }
  .chip { background: #fff; border: 1px solid var(--blue-line); border-radius: 999px; padding: 1px 14px; font-size: .85rem; font-weight: 600; text-decoration: none; color: var(--accent-blue); }
  .chip:hover { background: var(--accent-blue); border-color: var(--accent-blue); color: #fff; }

  /* nákup */
  ol.steps { list-style: none; padding: 0; counter-reset: s; margin-bottom: 20px; }
  ol.steps li { counter-increment: s; position: relative; padding: 4px 0 4px 48px; margin-bottom: 10px; min-height: 36px; }
  ol.steps li::before {
    content: counter(s); position: absolute; left: 0; top: 0; width: 36px; height: 36px; border-radius: 50%;
    background: var(--blue); color: var(--text); font-weight: 700; display: flex; align-items: center; justify-content: center;
  }
  .terms { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
  .terms > div { border-radius: 28px; padding: 18px 24px 8px; }
  .terms > div:first-child { background: var(--blue-soft); }
  .terms > div:last-child { background: var(--pink-soft); }
  .terms h3 { margin: 0 0 8px; }

  /* pätka */
  .foot-curve { display: block; width: 100%; height: 50px; margin-top: 30px; }
  footer { background: var(--pink); padding: 0 0 36px; margin-top: -1px; color: var(--soft); font-size: .9rem; }
  footer p { margin: 0 0 4px; }
  footer a { color: var(--soft); }

  /* ilustrácie */
  .pk{fill:#f7bfd3} .pk2{fill:#ee86ab} .wh{fill:#fff} .lt{fill:#c5d8ef}
  .bl{fill:#7fa3d1} .gn{fill:#a9dcc0}
  .st-bl,.st-pk2,.st-lt{fill:none;stroke-linecap:round;stroke-linejoin:round}
  .st-bl{stroke:#7fa3d1} .st-pk2{stroke:#ee86ab} .st-lt{stroke:#c5d8ef}

  @media (max-width: 760px) {
    .hero { padding: 24px 0 70px; }
    .hero-grid { grid-template-columns: 1fr 1fr; gap: 12px; }
    .hero-text { grid-column: 1 / -1; grid-row: 1; padding-bottom: 8px; }
    .arch.a1 { height: 190px; }
    .arch.a2 { height: 140px; }
    section { gap: 14px; padding: 30px 0 14px; }
    .page-head { padding: 26px 0 60px; }
    a.tile { flex-basis: 150px; padding: 32px 12px 20px; }
    .row { grid-template-columns: 1fr; }
    .panel { padding: 8px 20px; border-radius: 24px; }
    .terms { grid-template-columns: 1fr; }
    .doc { flex-direction: column; align-items: flex-start; border-radius: 22px; }
  }