/* ============================================================
   MEDOINO — homepage: teplá & priateľská prémiovka
   Čisté, ľudské, praktické. Colorway: ružová #F06C8E + krém + teplá čierna.
   Font: Plus Jakarta Sans (priateľský display) + IBM Plex Sans (text).
   ============================================================ */

:root{
  --paper:#f6efe3;
  --paper-2:#fffaf1;
  --card:#fffdf9;
  --ink:#2a2320;
  --ink-2:#5f554c;
  --muted:#968b7c;
  --line:#ece1d0;
  --line-2:#f4ecdf;
  --pink:#f06c8e;
  --pink-deep:#d24d6f;
  --pink-soft:#fbe4ea;
  --pink-tint:#fdf2f5;
  --butter:#f6cf7a;
  --disp:"Plus Jakarta Sans",-apple-system,system-ui,sans-serif;
  --body:"IBM Plex Sans",-apple-system,system-ui,sans-serif;
  --r-lg:30px; --r:18px; --r-sm:12px;
  --maxw:1180px; --gut:clamp(20px,4vw,44px);
  --sh:0 24px 50px -30px rgba(80,55,35,.4);
  --sh-sm:0 10px 24px -16px rgba(80,55,35,.35);
  --ease:cubic-bezier(.22,.9,.28,1);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;overflow-x:hidden}
body.home{margin:0;font-family:var(--body);color:var(--ink);background:var(--paper);line-height:1.62;font-size:17px;-webkit-font-smoothing:antialiased;overflow-x:hidden}
.home a{color:inherit;text-decoration:none}
.home img,.home svg{display:block;max-width:100%}
.home ::selection{background:var(--pink);color:#fff}
.home h1,.home h2,.home h3,.home h4{font-family:var(--disp);font-weight:800;margin:0;letter-spacing:-.02em;line-height:1.06;text-wrap:balance}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 var(--gut)}
.eyebrow{display:inline-flex;align-items:center;gap:9px;font-family:var(--disp);font-weight:700;font-size:13px;letter-spacing:.02em;color:var(--pink-deep);background:var(--pink-soft);padding:7px 14px;border-radius:999px}

/* ---- buttons (friendly pills) ---- */
.home .btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;font-family:var(--disp);font-weight:700;font-size:15px;padding:14px 26px;border-radius:999px;border:2px solid transparent;cursor:pointer;transition:transform .16s var(--ease),background .18s,color .18s,box-shadow .2s;white-space:nowrap}
.home .btn:active{transform:translateY(1px)}
.home .btn-primary{background:var(--ink);color:#fff;box-shadow:var(--sh-sm)}
.home .btn-primary:hover{background:var(--pink);color:#fff;transform:translateY(-2px);box-shadow:0 16px 30px -14px rgba(240,108,142,.7)}
.home .btn-ghost{background:transparent;color:var(--ink);border-color:var(--line)}
.home .btn-ghost:hover{border-color:var(--ink);transform:translateY(-2px)}
.home .btn-pink{background:var(--pink);color:#fff}
.home .btn-pink:hover{background:var(--pink-deep);transform:translateY(-2px)}
.home .btn-lg{padding:17px 32px;font-size:16px}
.home .btn-block{width:100%}
.home .btn .ar{transition:transform .18s var(--ease)}
.home .btn:hover .ar{transform:translateX(4px)}

/* ---- header ---- */
.hdr{position:sticky;top:0;z-index:60;background:color-mix(in srgb,var(--paper) 82%,transparent);backdrop-filter:blur(10px);transition:box-shadow .3s,background .3s}
.hdr.stuck{box-shadow:0 1px 0 var(--line),0 8px 24px -20px rgba(80,55,35,.5);background:color-mix(in srgb,var(--paper) 92%,transparent)}
.nav{display:flex;align-items:center;gap:24px;height:76px}
.logo{display:flex;align-items:center;gap:11px;font-family:var(--disp);font-weight:800;font-size:22px;letter-spacing:-.02em}
.logo .m{width:34px;height:34px;border-radius:11px;background:var(--ink);display:grid;place-items:center;flex:none}
.logo .m::before{content:"";width:15px;height:9px;border:2.5px solid var(--pink);border-radius:6px}
.nav-links{display:flex;gap:6px;margin-left:8px}
.nav-links a{font-weight:600;font-size:15px;color:var(--ink-2);padding:8px 12px;border-radius:999px;transition:.16s}
.nav-links a:hover{color:var(--ink);background:var(--pink-tint)}
.sp{flex:1}
.cartb{position:relative}
.cartb .cc{background:var(--pink);color:#fff;font-family:var(--disp);font-weight:700;font-size:12px;min-width:20px;height:20px;border-radius:999px;display:inline-grid;place-items:center;padding:0 5px;margin-left:2px}
.burger{display:none;background:none;border:2px solid var(--line);border-radius:10px;padding:9px 11px;cursor:pointer}
.burger i{display:block;width:20px;height:2px;background:var(--ink);border-radius:2px}
.burger i+i{margin-top:4px}

/* ---- hero ---- */
.hero{padding:clamp(36px,6vw,76px) 0 clamp(44px,6vw,84px)}
.hero-grid{display:grid;grid-template-columns:1.02fr .98fr;gap:clamp(28px,4vw,64px);align-items:center}
.hero h1{font-size:clamp(2.6rem,5.6vw,4.4rem);letter-spacing:-.035em;line-height:1}
.hero h1 .u{position:relative;white-space:nowrap;color:var(--pink-deep)}
.hero h1 .u svg{position:absolute;left:-2%;right:-2%;bottom:-.24em;width:104%;height:.36em;overflow:visible}
.hero h1 .u svg path{fill:none;stroke:var(--pink);stroke-width:7;stroke-linecap:round}
.hero .lead{font-size:clamp(1.05rem,1.5vw,1.22rem);color:var(--ink-2);max-width:46ch;margin:24px 0 0}
.hero-cta{display:flex;gap:13px;flex-wrap:wrap;margin-top:30px}
.trust{display:flex;align-items:center;gap:14px;margin-top:28px}
.trust .avs{display:flex}
.trust .avs span{width:38px;height:38px;border-radius:50%;border:2.5px solid var(--paper);background:var(--pink-soft);color:var(--pink-deep);display:grid;place-items:center;font-family:var(--disp);font-weight:700;font-size:14px;margin-left:-12px}
.trust .avs span:first-child{margin-left:0}
.trust .tt{font-size:14px;color:var(--ink-2)}
.trust .tt b{color:var(--ink)}
.trust .tt .st{color:var(--pink)}

.hero-photo{position:relative}
.hero-photo .frame{border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--sh);border:1px solid var(--line);background:var(--card)}
.hero-photo .frame img{width:100%;aspect-ratio:4/3.4;object-fit:cover;display:block}
.sticker{position:absolute;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:12px 16px;box-shadow:var(--sh-sm);display:flex;align-items:center;gap:10px;font-weight:600;font-size:14px}
.sticker .dot{width:34px;height:34px;border-radius:12px;display:grid;place-items:center;flex:none}
.sticker.s1{top:22px;left:-18px;transform:rotate(-4deg)}
.sticker.s1 .dot{background:var(--pink-soft)}
.sticker.s2{bottom:26px;right:-16px;transform:rotate(3deg)}
.sticker.s2 .dot{background:#fdf3dd}
.sticker b{font-family:var(--disp);font-weight:800}
.sticker small{color:var(--muted);font-weight:500;display:block;font-size:12px}

/* ---- benefits strip ---- */
.benefits{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2vw,26px);padding:clamp(24px,3vw,36px) 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.benefit{display:flex;gap:14px;align-items:flex-start}
.benefit .ic{width:42px;height:42px;flex:none;color:var(--pink-deep)}
.benefit h4{font-size:1.05rem}
.benefit p{margin:3px 0 0;color:var(--muted);font-size:.92rem}

/* ---- section ---- */
.sec{padding:clamp(56px,8vw,110px) 0}
.sec-head{max-width:600px;margin:0 auto clamp(34px,5vw,56px);text-align:center}
.sec-head.left{margin-left:0;text-align:left}
.sec-head h2{font-size:clamp(2rem,4vw,3.1rem);letter-spacing:-.03em;margin:14px 0 12px}
.sec-head p{color:var(--ink-2);font-size:1.08rem;margin:0}

/* ---- kit cards ---- */
.kits{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;align-items:start}
.kit{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;display:flex;flex-direction:column;transition:transform .22s var(--ease),box-shadow .25s}
.kit:hover{transform:translateY(-6px);box-shadow:var(--sh)}
.kit.best{border-color:var(--pink);background:var(--pink-tint)}
.kit .shot{position:relative;aspect-ratio:16/11;overflow:hidden;background:var(--pink-soft)}
.kit .shot img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease)}
.kit:hover .shot img{transform:scale(1.05)}
.kit .tag{position:absolute;top:14px;left:14px;background:var(--pink);color:#fff;font-family:var(--disp);font-weight:700;font-size:12px;padding:6px 13px;border-radius:999px;transform:rotate(-3deg);box-shadow:var(--sh-sm)}
.kit .les{position:absolute;bottom:12px;right:12px;background:rgba(42,35,32,.82);color:#fff;font-size:12px;font-weight:600;padding:5px 11px;border-radius:999px;backdrop-filter:blur(3px)}
.kit .body{padding:24px;display:flex;flex-direction:column;gap:12px;flex:1}
.kit h3{font-size:1.35rem}
.kit .sub{color:var(--muted);font-size:.9rem;margin:-6px 0 0}
.kit ul{list-style:none;margin:4px 0 0;padding:0;display:grid;gap:10px}
.kit li{display:flex;gap:11px;align-items:flex-start;font-size:.94rem;color:var(--ink-2)}
.kit li .ck{width:20px;height:20px;border-radius:50%;background:var(--pink-soft);color:var(--pink-deep);display:grid;place-items:center;flex:none;font-size:11px;font-weight:800;margin-top:1px}
.kit .price{display:flex;align-items:baseline;gap:10px;margin-top:auto;padding-top:6px}
.kit .price b{font-family:var(--disp);font-weight:800;font-size:2rem;letter-spacing:-.03em}
.kit .price s{color:var(--muted);font-size:1rem}
.kit-foot{padding:0 24px 24px}

/* ---- steps ---- */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,44px)}
.step{position:relative}
.step .n{font-family:var(--disp);font-weight:800;font-size:3.4rem;color:var(--pink);line-height:1;letter-spacing:-.04em}
.step h3{font-size:1.28rem;margin:12px 0 8px}
.step p{margin:0;color:var(--ink-2);font-size:.98rem}
.step .chip{display:inline-block;margin-top:12px;font-family:var(--disp);font-weight:700;font-size:13px;color:var(--pink-deep);background:var(--pink-soft);padding:5px 12px;border-radius:999px}

/* ---- kit contents ---- */
.box-grid{display:grid;grid-template-columns:1.02fr .98fr;gap:clamp(26px,4vw,60px);align-items:center}
.box-photo{border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--sh);position:relative}
.box-photo img{width:100%;aspect-ratio:4/3;object-fit:cover}
.box-photo .sticker{bottom:18px;left:18px;transform:rotate(-3deg)}
.box-list{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.box-item{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:16px 18px}
.box-item h4{font-size:1rem}
.box-item p{margin:3px 0 0;color:var(--muted);font-size:.84rem}

/* ---- academy panel (warm) ---- */
.acad{background:var(--pink-tint);border:1px solid var(--pink-soft);border-radius:var(--r-lg);overflow:hidden}
.acad-grid{display:grid;grid-template-columns:1.05fr .95fr;align-items:stretch}
.acad .l{padding:clamp(30px,4vw,56px)}
.acad .l h2{font-size:clamp(1.7rem,3vw,2.5rem);letter-spacing:-.03em}
.acad .l p{color:var(--ink-2);margin:12px 0 0}
.acad .mods{margin:24px 0;display:grid;gap:10px}
.acad .mod{display:flex;align-items:center;gap:12px;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:13px 16px;font-weight:600;font-size:.95rem}
.acad .mod .st{margin-left:auto;font-size:.82rem;color:var(--muted);font-weight:600}
.acad .mod .st.open{color:var(--pink-deep)}
.acad .r{position:relative;min-height:320px}
.acad .r img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}

/* ---- testimonials ---- */
.tw{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.tcard{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:24px;display:flex;flex-direction:column;gap:14px}
.tcard .stars{color:var(--pink);letter-spacing:2px;font-size:15px}
.tcard p{margin:0;color:var(--ink);font-size:.98rem}
.tcard .by{display:flex;align-items:center;gap:11px;margin-top:auto}
.tcard .by .av{width:40px;height:40px;border-radius:50%;background:var(--pink-soft);color:var(--pink-deep);display:grid;place-items:center;font-family:var(--disp);font-weight:800}
.tcard .by b{display:block;font-size:.94rem}
.tcard .by small{color:var(--muted);font-size:.8rem}

/* ---- story ---- */
.story{display:grid;grid-template-columns:.92fr 1.08fr;gap:clamp(26px,4vw,60px);align-items:center}
.story-photo{border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--sh)}
.story-photo img{width:100%;aspect-ratio:4/3.2;object-fit:cover}
.story h2{font-size:clamp(1.9rem,3.6vw,3rem);letter-spacing:-.03em;margin-bottom:16px}
.story p{color:var(--ink-2)}
.metrics{display:flex;gap:32px;margin-top:26px;flex-wrap:wrap}
.metrics .m b{font-family:var(--disp);font-weight:800;font-size:2.3rem;letter-spacing:-.03em;display:block;color:var(--pink-deep)}
.metrics .m span{font-size:13px;color:var(--muted)}

/* ---- faq ---- */
.faq{max-width:780px;margin:0 auto;display:grid;gap:12px}
.qa{background:var(--card);border:1px solid var(--line);border-radius:var(--r)}
.qa summary{list-style:none;cursor:pointer;padding:20px 24px;font-family:var(--disp);font-weight:700;font-size:1.08rem;display:flex;justify-content:space-between;align-items:center;gap:16px}
.qa summary::-webkit-details-marker{display:none}
.qa summary .pm{color:var(--pink-deep);font-size:22px;transition:transform .2s;flex:none}
.qa[open] summary .pm{transform:rotate(45deg)}
.qa .a{padding:0 24px 22px;color:var(--ink-2);margin:0}

/* ---- CTA (warm) ---- */
.cta{background:var(--ink);border-radius:var(--r-lg);padding:clamp(38px,6vw,72px);text-align:center;color:#fff;position:relative;overflow:hidden}
.cta::after{content:"";position:absolute;width:340px;height:340px;background:var(--pink);border-radius:50%;filter:none;right:-120px;bottom:-160px;opacity:.16}
.cta h2{font-size:clamp(1.9rem,4vw,3rem);letter-spacing:-.03em;position:relative}
.cta p{color:rgba(255,255,255,.8);max-width:440px;margin:14px auto 26px;position:relative}
.cta .row{display:flex;gap:13px;justify-content:center;flex-wrap:wrap;position:relative}

/* ---- footer ---- */
.foot{background:var(--paper-2);border-top:1px solid var(--line);padding:clamp(44px,5vw,64px) 0 30px;margin-top:clamp(40px,6vw,90px)}
.foot .top{display:grid;grid-template-columns:1.7fr 1fr 1fr 1fr;gap:28px}
.foot p{color:var(--muted);font-size:.9rem;max-width:30ch}
.foot h5{font-family:var(--disp);font-weight:700;font-size:.95rem;margin:0 0 12px}
.foot a{display:block;color:var(--ink-2);padding:5px 0;font-size:.94rem}
.foot a:hover{color:var(--pink-deep)}
.foot .rule{border-top:1px solid var(--line);margin:36px 0 20px}
.foot .meta{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;color:var(--muted);font-size:.86rem}

/* ---- cart ---- */
.ov{position:fixed;inset:0;background:rgba(42,35,32,.5);opacity:0;pointer-events:none;transition:opacity .25s;z-index:90;backdrop-filter:blur(2px)}
.ov.open{opacity:1;pointer-events:auto}
.dc{position:fixed;top:0;right:0;height:100%;width:440px;max-width:92vw;background:var(--paper-2);z-index:100;transform:translateX(102%);transition:transform .32s var(--ease);display:flex;flex-direction:column;box-shadow:var(--sh)}
.dc.open{transform:none}
.dc header{display:flex;justify-content:space-between;align-items:center;padding:22px 24px;border-bottom:1px solid var(--line)}
.dc header h3{font-size:1.3rem}
.dc .items{flex:1;overflow-y:auto;padding:14px 24px}
.dc .foot2{padding:22px 24px;border-top:1px solid var(--line);background:var(--card)}
.ci{display:flex;gap:13px;padding:14px 0;border-bottom:1px solid var(--line-2)}
.ci img{width:78px;height:58px;object-fit:cover;border-radius:12px}
.ci h4{font-size:.98rem;margin:0 0 3px}
.ci .p{color:var(--muted);font-size:.9rem}
.qty{display:inline-flex;gap:10px;align-items:center;margin-top:7px}
.qty button{width:27px;height:27px;border-radius:9px;border:1px solid var(--line);background:var(--card);cursor:pointer;font-weight:700}
.qty span{font-weight:700;min-width:16px;text-align:center}
.rm{background:none;border:none;color:var(--pink-deep);font-size:12px;cursor:pointer;margin-left:8px;font-weight:600}
.x{background:none;border:none;font-size:26px;cursor:pointer;line-height:1;color:var(--muted)}
.x:hover{color:var(--ink)}
.total{display:flex;justify-content:space-between;font-family:var(--disp);font-weight:800;font-size:1.35rem;margin-bottom:16px}
.field{margin-bottom:13px}
.field label{display:block;font-size:12px;font-weight:700;color:var(--ink-2);margin-bottom:6px}
.field input{width:100%;padding:13px 15px;border:2px solid var(--line);border-radius:14px;font-family:var(--body);font-size:15px;background:var(--card)}
.field input:focus{outline:none;border-color:var(--pink)}
.empty{text-align:center;color:var(--muted);padding:52px 12px}
.empty .e{font-size:34px;margin-bottom:8px}
.codebox{background:var(--ink);color:#fff;border-radius:18px;padding:24px;text-align:center;margin:14px 0}
.codebox .l{font-size:12px;color:rgba(255,255,255,.65);font-weight:600}
.codebox .c{font-family:var(--disp);font-weight:800;font-size:1.7rem;color:var(--pink);letter-spacing:1px;margin:8px 0}
.notice{background:var(--pink-tint);border:1px solid var(--pink-soft);color:var(--pink-deep);padding:13px 15px;border-radius:14px;font-size:.9rem}
.err{background:#fdeceb;border:1px solid #f3c9c6;color:#9a2b21;padding:13px 15px;border-radius:14px;font-size:.9rem;margin-bottom:12px}

/* ---- reveal (jemné, teplé) ---- */
.rv{opacity:0;transform:translateY(20px);transition:opacity .6s var(--ease),transform .6s var(--ease)}
.rv.in{opacity:1;transform:none}
.rv[data-d="1"]{transition-delay:.08s}.rv[data-d="2"]{transition-delay:.16s}.rv[data-d="3"]{transition-delay:.24s}

/* ---- responsive ---- */
@media(max-width:920px){
  .hero-grid,.box-grid,.acad-grid,.story{grid-template-columns:1fr}
  .kits,.steps,.tw,.benefits{grid-template-columns:1fr}
  .acad .r{min-height:220px}
  .foot .top{grid-template-columns:1fr 1fr}
  .hero-photo{max-width:460px;margin:0 auto}
}
@media(max-width:640px){
  .nav{gap:12px;height:64px}
  .logo{font-size:19px}.logo .m{width:32px;height:32px}
  .nav-links{display:none}.burger{display:block}
  .nav-links.open{display:flex;position:absolute;top:64px;left:0;right:0;flex-direction:column;background:var(--paper-2);border-bottom:1px solid var(--line);padding:14px 20px;gap:2px;box-shadow:var(--sh-sm)}
  .nav-links.open a{font-size:1.05rem;padding:12px 12px}
  .hdr .btn-ghost{display:none}            /* „Mám kód" presunuté do menu */
  .cartb{padding:12px 16px;font-size:14px}
  .box-list{grid-template-columns:1fr}
  .foot .top{grid-template-columns:1fr}
  /* hero: plná šírka CTA, nálepky dnu, menšie odsadenia */
  .hero{padding:24px 0 40px}
  .hero-cta{flex-direction:column;gap:10px;margin-top:24px}
  .hero-cta .btn{width:100%}
  .trust{margin-top:22px;gap:12px}
  .sticker{padding:10px 13px;font-size:13px}
  .sticker .dot{width:30px;height:30px}
  .sticker.s1{top:14px;left:8px;transform:rotate(-3deg)}
  .sticker.s2{bottom:14px;right:8px;transform:rotate(2deg)}
  .box-photo .sticker{left:10px;bottom:10px}
  .sec{padding:52px 0}
  .sec-head{margin-bottom:30px}
  .acad .l{padding:26px 22px}
  .acad .r{min-height:180px}
  .cta{padding:36px 22px}
  .cta .row .btn{width:100%}
  .metrics{gap:22px}
  .kit .body{padding:20px}
}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition-duration:.001ms!important}.rv{opacity:1;transform:none}}