:root{
  box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px);
  padding-bottom:env(safe-area-inset-bottom,0px);
  --paper:#EEF2EF; --card:#FFFFFF; --ink:#121714; --muted:#56615B; --line:#D3DBD5; --field:#F3F6F4;
  --green:#0E5A46; --green-ink:#FFFFFF; --yolk:#FFD23F; --yolk-ink:#1C1600;
  --ui:"Bricolage Grotesque","Helvetica Neue",Arial,sans-serif;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){--paper:#0E1210;--card:#171C19;--ink:#EDF2EE;--muted:#9AA69F;--line:#2A322D;--field:#1F2521;--green:#2F9C7A;--green-ink:#06110D}
}
:root[data-theme="dark"]{--paper:#0E1210;--card:#171C19;--ink:#EDF2EE;--muted:#9AA69F;--line:#2A322D;--field:#1F2521;--green:#2F9C7A;--green-ink:#06110D}
*,*::before,*::after{box-sizing:inherit}
html{scroll-behavior:smooth;scroll-padding-top:calc(env(safe-area-inset-top,0px) + 76px)}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--ui);font-size:17px;line-height:1.5;-webkit-font-smoothing:antialiased}
img{max-width:100%}
a{color:inherit}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--yolk);outline-offset:2px}
.wrap{max-width:1240px;margin:0 auto;padding:0 24px}

/* navigácia */
.nav{position:sticky;top:env(safe-area-inset-top,0px);z-index:30;background:color-mix(in srgb,var(--paper) 88%,transparent);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid transparent;transition:border-color .2s}
.nav.scrolled{border-bottom-color:var(--line)}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;height:68px;gap:16px}
.logo{display:flex;align-items:center;gap:8px;font-weight:800;font-size:24px;letter-spacing:-.03em;text-decoration:none;font-variation-settings:"opsz" 96}
.logo i{width:14px;height:14px;border-radius:50%;background:var(--yolk);display:inline-block;box-shadow:inset 0 0 0 3px #F4B400}
.nav ul{list-style:none;display:flex;gap:24px;margin:0;padding:0}
.nav ul a{text-decoration:none;color:var(--muted);font-weight:500}
.nav ul a:hover{color:var(--ink)}
.nav-r{display:flex;align-items:center;gap:10px}
.lang{display:flex;background:var(--card);border:1px solid var(--line);border-radius:10px;padding:3px;gap:2px}
.lang button{border:0;background:transparent;border-radius:7px;padding:5px 9px;font-size:13px;font-weight:700;cursor:pointer;color:var(--muted)}
.lang button[aria-pressed="true"]{background:var(--ink);color:var(--paper)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:12px;padding:13px 20px;font-weight:700;text-decoration:none;cursor:pointer;border:0;font-size:16px;transition:transform .15s,filter .15s;white-space:nowrap}
.btn:active{transform:translateY(1px)}
.btn-p{background:var(--green);color:var(--green-ink)}
.btn-p:hover{filter:brightness(1.1)}
.btn-s{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--ink)}
.btn-s:hover{background:var(--card)}
.btn-y{background:var(--yolk);color:var(--yolk-ink)}
.btn[disabled]{opacity:.6;cursor:progress}
.nav .btn{padding:10px 16px;font-size:15px}

/* hero */
.hero{padding:48px 0 32px;overflow:hidden}
.hero .wrap{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.hero h1{font-size:clamp(42px,5.2vw,78px);line-height:.96;letter-spacing:-.045em;font-weight:800;margin:0 0 20px;font-variation-settings:"opsz" 96;max-width:12ch}
.hero .lead{font-size:clamp(18px,1.5vw,20px);color:var(--muted);max-width:42ch;margin:0 0 26px}
.try{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:14px;max-width:470px;margin-bottom:22px}
.try label{font-size:14px;color:var(--muted);font-weight:600;display:block;margin-bottom:8px}
.try input{width:100%;font-size:20px;font-weight:700;border:0;background:var(--field);border-radius:10px;padding:12px 14px;letter-spacing:-.01em}
.try input:focus{outline:2px solid var(--green)}
.hero .cta{display:flex;gap:12px;flex-wrap:wrap}
.hero .small{margin-top:14px;color:var(--muted);font-size:14px}
.stack{position:relative;height:580px}
.stack .sc{position:absolute;left:50%;top:50%;width:300px;margin-left:-150px;margin-top:-187px;border-radius:6px;overflow:hidden;box-shadow:0 2px 6px rgba(0,0,0,.08),0 24px 60px rgba(10,30,20,.22);transition:transform .9s cubic-bezier(.2,.8,.2,1)}
.stack .sc:nth-child(1){transform:rotate(-2deg)}
.stack .sc:nth-child(2){transform:rotate(1deg)}
.stack.fan .sc:nth-child(1){transform:translate(-185px,34px) rotate(-10deg)}
.stack.fan .sc:nth-child(2){transform:translate(180px,22px) rotate(8deg)}
.stack.fan .sc:nth-child(3){transform:translate(0,-14px) rotate(-1deg)}
.sticker{position:absolute;left:2%;top:3%;z-index:5;background:var(--yolk);color:var(--yolk-ink);width:118px;height:118px;border-radius:50%;display:flex;align-items:center;justify-content:center;text-align:center;font-weight:800;line-height:1.05;font-size:17px;transform:rotate(-12deg);box-shadow:0 10px 24px rgba(0,0,0,.18);padding:10px}

/* sekcie */
section{padding:88px 0}
.h2{font-size:clamp(34px,4.4vw,58px);line-height:1;letter-spacing:-.035em;font-weight:800;margin:0 0 14px;font-variation-settings:"opsz" 96;max-width:18ch}
.sub{color:var(--muted);font-size:19px;max-width:54ch;margin:0 0 44px}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.step{background:var(--card);border-radius:20px;padding:28px;border:1px solid var(--line);display:flex;flex-direction:column;gap:12px}
.step .num{font-weight:800;font-size:56px;line-height:1;letter-spacing:-.05em;color:var(--green);font-variation-settings:"opsz" 96}
.step h3{margin:0;font-size:24px;letter-spacing:-.02em}
.step > p{margin:0;color:var(--muted)}
.step .demo{margin-top:auto;background:var(--field);border-radius:12px;padding:14px;font-size:13.5px;line-height:1.5}
.raw{font-family:"Space Mono",monospace;font-size:12.5px;white-space:pre-line;color:var(--ink)}
.fmts{display:flex;gap:10px;align-items:flex-end}
.fmts span{background:var(--card);border:1.5px solid var(--ink);border-radius:4px;display:flex;align-items:flex-end;justify-content:center;font-size:11px;padding:4px;font-weight:600}
.pills{display:flex;flex-wrap:wrap;gap:6px}
.pills span{background:var(--card);border-radius:99px;padding:4px 10px;font-size:13px;border:1px solid var(--line)}

.feat{display:grid;grid-template-columns:.75fr 1.25fr;gap:64px;align-items:center}
.phone{width:290px;margin:0 auto;border-radius:48px;padding:12px;background:#0F1110;box-shadow:0 2px 0 1px #2B2F2D inset,0 30px 70px rgba(10,30,20,.28);position:relative}
.phone::before{content:"";position:absolute;top:22px;left:50%;width:84px;height:24px;margin-left:-42px;background:#0F1110;border-radius:20px;z-index:3}
.phone .scaled{border-radius:36px}
.flist{display:grid;grid-template-columns:1fr 1fr;gap:34px 36px}
.flist > div{border-top:2px solid var(--ink);padding-top:14px}
.flist h3{margin:0 0 6px;font-size:21px;letter-spacing:-.02em}
.flist p{margin:0;color:var(--muted)}

.filters{display:flex;gap:8px;flex-wrap:wrap;margin:-16px 0 30px}
.filters button{border:1.5px solid var(--line);background:var(--card);border-radius:99px;padding:8px 16px;font-weight:600;cursor:pointer;color:var(--muted)}
.filters button[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.gallery{display:grid;grid-template-columns:repeat(5,1fr);gap:22px}
.gcard{background:none;border:0;padding:0;text-align:left;cursor:pointer;display:flex;flex-direction:column;gap:8px}
.gcard[hidden]{display:none}
.gcard .scaled{border-radius:8px;box-shadow:0 1px 3px rgba(0,0,0,.08),0 14px 34px rgba(10,30,20,.14);transition:transform .25s}
.gcard:hover .scaled{transform:translateY(-4px)}
.gcard > b{font-size:17px;margin-top:4px}
.gcard > span{color:var(--muted);font-size:14px;line-height:1.35}

/* aplikácia */
#app{background:var(--card);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.appgrid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:40px;align-items:start}
.panel{display:flex;flex-direction:column;gap:14px}
.block{background:var(--paper);border-radius:18px;padding:22px}
.block h3{margin:0 0 4px;font-size:21px;letter-spacing:-.02em;display:flex;align-items:center;gap:10px}
.block h3 em{font-style:normal;width:28px;height:28px;border-radius:50%;background:var(--ink);color:var(--paper);display:inline-flex;align-items:center;justify-content:center;font-size:15px}
.block .hint{color:var(--muted);font-size:14px;margin:0 0 12px}
label{display:flex;flex-direction:column;gap:5px;font-size:13.5px;color:var(--muted);font-weight:500}
input[type=text],input[type=url],input[type=date],select,textarea{background:var(--card);border:1.5px solid var(--line);border-radius:10px;padding:10px 12px;width:100%;min-width:0}
input:focus,textarea:focus,select:focus{border-color:var(--green);outline:none}
textarea{resize:vertical}
#raw{min-height:190px;font-family:"Space Mono",monospace;font-size:13.5px;line-height:1.6}
.row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.fields{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.full{grid-column:1/-1}
details.sub-d{margin-top:14px;border-top:1px solid var(--line);padding-top:4px}
details.sub-d summary{cursor:pointer;padding:10px 0;font-weight:600;list-style:none}
details.sub-d summary::-webkit-details-marker{display:none}
details.sub-d summary::before{content:"+ ";color:var(--muted)}
details.sub-d[open] summary::before{content:"– "}
.it{display:grid;grid-template-columns:68px 1fr 60px 64px 30px;gap:5px;margin-bottom:6px}
.it input{padding:7px 8px;font-size:14px;border-radius:8px}
.ith{display:grid;grid-template-columns:68px 1fr 60px 64px 30px;gap:5px;font-size:12px;color:var(--muted);margin:6px 0 4px}
.grp{font-size:13px;font-weight:700;color:var(--muted);margin:10px 0 4px}
.del{border:0;background:transparent;color:var(--muted);cursor:pointer;border-radius:8px;font-size:18px}
.del:hover{color:#C2372A;background:var(--card)}
.adds{display:flex;gap:8px;margin:8px 0 14px}
.adds button{flex:1;border:1.5px dashed var(--line);background:transparent;border-radius:10px;padding:8px;cursor:pointer;color:var(--muted);font-size:14px}
.adds button:hover{color:var(--ink);border-color:var(--muted)}
.tpls{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}
.tp{background:none;border:0;padding:0;cursor:pointer;display:flex;flex-direction:column;gap:5px;font-size:12.5px;font-weight:600;color:var(--muted);text-align:left}
.tp .scaled{border-radius:6px;box-shadow:0 0 0 1.5px var(--line)}
.tp[aria-pressed="true"]{color:var(--ink)}
.tp[aria-pressed="true"] .scaled{box-shadow:0 0 0 3px var(--green)}
.sw{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.swatch{width:32px;height:32px;border-radius:50%;border:3px solid var(--paper);box-shadow:0 0 0 1px var(--line);cursor:pointer;padding:0}
.swatch[aria-pressed="true"]{box-shadow:0 0 0 2.5px var(--ink)}
.custom{position:relative;width:32px;height:32px;border-radius:50%;overflow:hidden;box-shadow:0 0 0 1px var(--line);background:conic-gradient(#f44,#fd4,#4d8,#4af,#a4f,#f44);cursor:pointer}
.custom input{position:absolute;inset:-8px;width:48px;height:48px;opacity:0;cursor:pointer}
.uploads{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.up{display:flex;flex-direction:row;align-items:center;gap:8px;background:var(--card);border:1.5px solid var(--line);border-radius:10px;padding:6px 12px 6px 6px;cursor:pointer;font-weight:600;font-size:14px;color:var(--ink)}
.up img{width:34px;height:34px;object-fit:cover;border-radius:6px;background:var(--field)}
.up .ph{width:34px;height:34px;border-radius:6px;background:var(--field);display:flex;align-items:center;justify-content:center;color:var(--muted);font-size:18px}
.x{border:0;background:none;color:var(--muted);cursor:pointer;font-size:13px;text-decoration:underline}
.chk{flex-direction:row;align-items:center;gap:8px;color:var(--ink);font-size:14px}
.chk input{width:18px;height:18px;accent-color:var(--green)}
.out{position:sticky;top:90px;display:flex;flex-direction:column;align-items:center;gap:16px}
.ftabs{display:flex;background:var(--paper);border-radius:12px;padding:4px;gap:2px}
.ftabs button{border:0;background:transparent;border-radius:9px;padding:9px 16px;font-weight:600;cursor:pointer;color:var(--muted);font-size:15px}
.ftabs button[aria-selected="true"]{background:var(--card);color:var(--ink);box-shadow:0 1px 3px rgba(0,0,0,.12)}
.pv{width:100%;display:flex;justify-content:center}
.pv .scaled{width:100%;box-shadow:0 2px 6px rgba(0,0,0,.08),0 24px 60px rgba(10,30,20,.2);border-radius:4px}
.pv[data-fmt="post"] .scaled{max-width:480px}
.pv[data-fmt="story"] .scaled{max-width:320px}
.pv[data-fmt="print"] .scaled{max-width:460px}
.pv[data-fmt="square"] .scaled{max-width:500px}
.dl{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
.cap{width:100%;max-width:520px}
.cap textarea{min-height:120px;font-size:14px;background:var(--paper)}

/* cenník */
.bill{display:inline-flex;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:4px;gap:2px;margin:-18px 0 32px;align-items:center}
.bill button{border:0;background:transparent;border-radius:9px;padding:9px 16px;font-weight:600;cursor:pointer;color:var(--muted)}
.bill button[aria-pressed="true"]{background:var(--ink);color:var(--paper)}
.bill .save{font-size:13px;font-weight:700;background:var(--yolk);color:var(--yolk-ink);border-radius:99px;padding:4px 10px;margin:0 6px}
.plans{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.plan{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:28px;display:flex;flex-direction:column;gap:14px;position:relative}
.plan.hot{border:2px solid var(--ink)}
.plan .badge{position:absolute;top:-14px;left:24px;background:var(--yolk);color:var(--yolk-ink);font-weight:700;font-size:13px;padding:4px 10px;border-radius:99px}
.plan h3{margin:0;font-size:22px}
.price{font-size:46px;font-weight:800;letter-spacing:-.04em;line-height:1;font-variation-settings:"opsz" 96}
.price small{font-size:16px;font-weight:500;color:var(--muted);letter-spacing:0}
.plan ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:8px;color:var(--muted)}
.plan li{padding-left:24px;position:relative}
.plan li::before{content:"";position:absolute;left:2px;top:.55em;width:10px;height:10px;border-radius:50%;background:var(--green)}
.plan .btn{margin-top:auto}

.faq{max-width:780px}
.faq details{border-top:1px solid var(--line)}
.faq details:last-child{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;list-style:none;padding:20px 0;font-weight:700;font-size:19px;display:flex;justify-content:space-between;gap:12px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-weight:400;color:var(--muted);font-size:24px;line-height:1}
.faq details[open] summary::after{content:"–"}
.faq p{margin:0 0 20px;color:var(--muted);max-width:62ch}

.endcta{background:var(--green);color:var(--green-ink);border-radius:28px;padding:56px;display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap}
.endcta h2{margin:0;font-size:clamp(30px,3.6vw,48px);letter-spacing:-.03em;line-height:1.02;max-width:17ch}
footer{padding:44px 0 60px;color:var(--muted);font-size:15px;border-top:1px solid var(--line)}
footer .wrap{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;align-items:center}
footer nav{display:flex;gap:20px;flex-wrap:wrap}
footer a{text-decoration:none}
footer a:hover{color:var(--ink)}

.toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);background:var(--ink);color:var(--paper);padding:12px 18px;border-radius:12px;font-size:15px;opacity:0;transition:opacity .2s;pointer-events:none;z-index:50;max-width:90vw}
.toast.show{opacity:1}
.scaled{position:relative;overflow:hidden}
.sci{position:absolute;left:0;top:0;transform-origin:0 0}

@media (max-width:1100px){ .gallery{grid-template-columns:repeat(4,1fr)} .nav ul{gap:16px} }
@media (max-width:1000px){
  .hero .wrap{grid-template-columns:1fr}
  .stack{height:480px}
  .appgrid,.feat{grid-template-columns:1fr}
  .out{position:static}
  .gallery{grid-template-columns:repeat(3,1fr)}
  .steps,.plans{grid-template-columns:1fr}
  .nav ul{display:none}
}
@media (max-width:560px){
  .wrap{padding:0 16px}
  section{padding:64px 0}
  .nav .btn{display:none}
  .stack{height:410px}
  .stack .sc{width:220px;margin-left:-110px;margin-top:-137px}
  .stack.fan .sc:nth-child(1){transform:translate(-92px,26px) rotate(-9deg)}
  .stack.fan .sc:nth-child(2){transform:translate(92px,18px) rotate(8deg)}
  .sticker{width:92px;height:92px;font-size:14px;left:0}
  .gallery{grid-template-columns:repeat(2,1fr);gap:16px}
  .flist{grid-template-columns:1fr}
  .tpls{grid-template-columns:repeat(3,1fr);gap:8px}
  .it,.ith{grid-template-columns:54px 1fr 50px 56px 26px}
  .block{padding:16px}
  .endcta{padding:32px}
  .phone{width:250px}
  .ftabs button{padding:8px 10px;font-size:14px;white-space:nowrap}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

/* štruktúrovaný editor jedál */
.ed-sec{margin-top:18px}
.ed-h{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:8px}
.ed-h h4{margin:0;font-size:17px;letter-spacing:-.01em}
.ed-count{font-size:13px;color:var(--muted);font-weight:600}
.dish-ed{background:var(--card);border:1.5px solid var(--line);border-radius:14px;padding:12px 12px 10px;margin-bottom:10px;transition:border-color .15s}
.dish-ed:focus-within{border-color:var(--green)}
.dish-ed.is-out{opacity:.65}
.dish-ed .r1{display:flex;gap:10px;align-items:flex-end}
.dish-ed .r1 label{flex:1}
.dish-ed .badge-n{flex:none;width:34px;height:42px;border-radius:10px;background:var(--field);display:flex;align-items:center;justify-content:center;font-weight:800;color:var(--muted);font-size:15px}
.dish-ed .r2{display:grid;grid-template-columns:112px 112px 1fr;gap:8px;margin-top:8px;align-items:end}
.dish-ed input[type=text]{background:var(--field);border-color:transparent}
.dish-ed input[type=text]:focus{background:var(--card);border-color:var(--green)}
.dish-ed .opt{font-weight:400;opacity:.75}
.alg-btn{width:100%;display:flex;align-items:center;justify-content:space-between;gap:8px;text-align:left;background:var(--field);border:1.5px solid transparent;border-radius:10px;padding:10px 12px;cursor:pointer;font-size:14px;color:var(--ink);min-height:43px}
.alg-btn span:last-child{color:var(--muted);font-size:12px}
.alg-btn[aria-expanded="true"]{border-color:var(--green);background:var(--card)}
.alg-panel{display:grid;grid-template-columns:1fr 1fr;gap:2px 14px;margin-top:8px;padding:10px 12px;background:var(--field);border-radius:10px}
.alg-panel label{flex-direction:row;align-items:center;gap:8px;font-size:13px;color:var(--ink);padding:4px 0;cursor:pointer}
.alg-panel input{width:17px;height:17px;accent-color:var(--green);flex:none}
.alg-panel b{min-width:18px;display:inline-block;color:var(--muted)}
.dish-ed .r3{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:10px;flex-wrap:wrap}
.dish-ed .tools{display:flex;gap:4px}
.ib{width:34px;height:32px;border:1px solid var(--line);background:var(--card);border-radius:8px;cursor:pointer;color:var(--muted);font-size:15px;display:inline-flex;align-items:center;justify-content:center}
.ib:hover{color:var(--ink);border-color:var(--muted)}
.ib.danger:hover{color:#C2372A;border-color:#C2372A}
.ib[disabled]{opacity:.35;cursor:default}
.dish-ed .trn{margin-top:8px}
.empty-ed{color:var(--muted);font-size:14px;padding:4px 2px 10px}
.add-big{width:100%;border:1.5px dashed var(--line);border-radius:12px;padding:12px;background:transparent;cursor:pointer;font-weight:700;color:var(--muted);font-size:15px}
.add-big:hover{color:var(--green);border-color:var(--green)}
.edays{margin:16px 0 0}
.edays button{display:flex;flex-direction:column;align-items:center;line-height:1.15;padding:7px 12px;border-radius:12px}
.edays button small{font-weight:500;font-size:11px;opacity:.75}
.paste-d{margin-top:18px;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:4px 14px}
.paste-d summary{cursor:pointer;list-style:none;padding:12px 0;font-weight:700;display:flex;justify-content:space-between;gap:10px}
.paste-d summary::-webkit-details-marker{display:none}
.paste-d summary::after{content:"+";color:var(--muted);font-weight:400;font-size:20px;line-height:1}
.paste-d[open] summary::after{content:"–"}
.paste-d[open]{padding-bottom:14px}
.demo.mini{display:flex;flex-direction:column;gap:6px}
.mini .mf{display:grid;grid-template-columns:1fr 54px 58px;gap:6px}
.mini .mf span{background:var(--card);border:1px solid var(--line);border-radius:7px;padding:5px 8px;font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mini .mf span:first-child{font-weight:600}
@media (max-width:560px){
  .dish-ed .r2{grid-template-columns:1fr 1fr}
  .dish-ed .r2 .alg-wrap{grid-column:1/-1}
  .alg-panel{grid-template-columns:1fr}
}