:root{--vino:#962c46;--vino-t:#5f1c2c;--zelena:#59c072;--cta:#22c39b;--pozadi:#faf5f6;--plocha:#f3e2e7;--text:#2d1b1f;--linka:rgba(95,28,44,.28);
--serif:"Old Standard TT",Georgia,serif;--sans:"PT Sans","Trebuchet MS",sans-serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--pozadi);color:var(--text);font:400 19px/1.6 var(--sans);min-height:100vh;display:flex;flex-direction:column;padding-bottom:84px}
main{flex:1}
img{max-width:100%;height:auto;display:block}
a{color:var(--vino-t)}
:focus-visible{outline:3px solid var(--vino);outline-offset:3px}
.sloupec{width:min(1080px,100% - 32px);margin-inline:auto}
.uzky{width:min(760px,100% - 32px);margin-inline:auto}

/* hlavička */
.hlava{border-bottom:1px solid var(--linka)}
.hlava__in{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 0}
.znacka{font:700 26px/1.1 var(--serif);color:var(--vino-t);text-decoration:none;display:flex;align-items:baseline;gap:6px}
.znacka b{font-size:34px;color:var(--vino);font-weight:700}
.tl{display:inline-flex;align-items:center;justify-content:center;text-align:center;text-decoration:none;font:700 18px/1.2 var(--sans);color:var(--text);background:var(--cta);border:1px solid var(--vino-t);min-height:60px;padding:12px 26px;border-radius:0}
.tl:hover{background:#1aa984}
.tl--hlava{min-height:50px;font-size:17px;padding:10px 20px}
.tl--velke{min-height:84px;min-width:320px;font-size:23px;padding:18px 36px}

/* otázka – sekce */
.otazka{position:relative;padding:clamp(72px,12vw,150px) 0;border-bottom:1px solid var(--linka);overflow:hidden}
.otazka h2,.otazka h1{font:400 clamp(36px,5.4vw,68px)/1.08 var(--serif);margin:0 0 28px;max-width:17ch;overflow-wrap:break-word}
.otazka h1{font-size:clamp(42px,7.4vw,104px);max-width:13ch}
.znak-otazky{font:italic 400 30px/1 var(--serif);color:var(--vino);display:block;margin-bottom:18px}
.odpoved{max-width:60ch;font-size:20px}
.odpoved p{margin:0 0 18px}
.odpoved strong{color:var(--vino-t)}
.vsazena{float:right;width:min(380px,46%);margin:6px 0 20px 32px;border:1px solid var(--vino-t);padding:8px;background:var(--pozadi)}
.vsazena img{aspect-ratio:3/2;object-fit:cover;width:100%}
.vsazena figcaption{font-size:15px;line-height:1.4;padding:8px 2px 2px;color:var(--vino-t)}
.cista::after{content:"";display:block;clear:both}

/* hero */
.uvod{padding:36px 0 56px}
.uvod .sloupec{position:relative}
.otaznik{position:absolute;left:-1vw;top:-14px;font:400 clamp(380px,50vw,720px)/.85 var(--serif);color:rgba(150,44,70,.16);pointer-events:none;user-select:none;z-index:0}
.uvod .obsah{position:relative;z-index:1}
.uvod h1{margin-left:clamp(0px,10vw,150px);max-width:12ch}
.uvod__text{margin-left:clamp(0px,24vw,340px);max-width:560px}
.uvod .perex{font-size:clamp(20px,2vw,24px);margin:0 0 28px}
.pod-cta{font-size:16px;margin-top:12px;color:var(--vino-t)}
.pas{margin:32px 0 0;display:grid;grid-template-columns:1fr 240px;gap:24px;align-items:end;border-top:1px solid var(--vino-t);padding-top:20px}
.pas img{width:100%;aspect-ratio:21/8;object-fit:cover;object-position:50% 45%}
.pas figcaption{font-size:16px;line-height:1.45;color:var(--vino-t);border-left:1px solid var(--linka);padding-left:16px}
/* situace střídavě */
.otazka--plocha{background:var(--plocha)}
.otazka--vpravo .uzky{margin-left:auto;margin-right:max(16px,calc((100% - 1080px)/2))}

/* fakta */
.radky{list-style:none;margin:40px 0 0;padding:0;border-top:1px solid var(--vino-t)}
.radky li{display:grid;grid-template-columns:260px 1fr;gap:28px;padding:28px 0;border-bottom:1px solid var(--linka)}
.cislo{font:400 clamp(40px,4.4vw,56px)/1 var(--serif);color:var(--vino)}
.radky h3{font:700 21px/1.3 var(--sans);margin:0 0 6px}
.radky p{margin:0}
.zdroj{font-size:15px;color:var(--vino-t)}
.graf{margin:40px 0 0;max-width:640px}
.graf figcaption{font-size:15px;margin-top:8px;color:var(--vino-t)}

/* recenze */
.hlasy{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:36px;border-top:1px solid var(--vino-t)}
.hlas{margin:0;padding:28px 24px 28px 0;border-bottom:1px solid var(--linka)}
.hlas+.hlas{padding-left:24px;border-left:1px solid var(--linka)}
.hlas blockquote{margin:0 0 12px;font:400 25px/1.35 var(--serif)}
.hlas cite{font-style:normal;font-size:16px;color:var(--vino-t)}

/* faq */
.dotazy{margin-top:32px;border-top:1px solid var(--vino-t)}
.dotazy details{border-bottom:1px solid var(--linka);padding:20px 0}
.dotazy summary{cursor:pointer;font:400 26px/1.3 var(--serif);list-style:none;display:flex;justify-content:space-between;gap:18px}
.dotazy summary::-webkit-details-marker{display:none}
.dotazy summary::after{content:"?";color:var(--vino);font-size:32px;line-height:1}
.dotazy details[open] summary::after{content:"–"}
.dotazy details p{margin:12px 0 0;max-width:60ch}

/* závěr */
.zaver{text-align:left}

/* patička */
.pata{border-top:1px solid var(--vino-t);padding:32px 0 28px;font-size:15px}
.pata__in{display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px}
.pata nav{display:flex;flex-wrap:wrap;gap:8px 20px}
.pata a{color:var(--vino-t)}

/* podstránky */
.stranka{padding:72px 0 88px}
.stranka h1{font:400 clamp(36px,5vw,58px)/1.1 var(--serif);margin:0 0 24px}
.stranka h2{font:400 28px/1.25 var(--serif);margin:40px 0 12px}
.stranka p,.stranka li{max-width:68ch}
.formular{display:grid;gap:18px;max-width:560px;margin-top:28px;border:1px solid var(--vino-t);padding:28px}
.formular label{display:grid;gap:6px;font-weight:700}
.formular input,.formular textarea{font:inherit;padding:12px;border:1px solid var(--vino-t);background:#fff;border-radius:0}
.formular textarea{min-height:140px}
.formular button{font:700 19px var(--sans);min-height:60px;background:var(--vino);color:#fff;border:0;cursor:pointer}
#kontaktDakujeme{border:1px solid var(--vino-t);padding:28px;max-width:560px;margin-top:28px}

/* popup a lišta (engine) */
.modal-overlay{position:fixed;inset:0;background:rgba(45,27,31,.82);display:none;align-items:center;justify-content:center;z-index:1000;padding:16px}
.modal-overlay.show{display:flex}
.modal{position:relative;background:var(--pozadi);border:1px solid var(--vino-t);width:min(640px,100%);padding:44px 36px 36px;text-align:center;max-height:calc(100vh - 32px);overflow:auto}
.modal .close{position:absolute;top:8px;right:10px;background:none;border:0;font-size:40px;line-height:1;cursor:pointer;color:var(--vino-t);width:48px;height:48px}
.modal .badge{display:inline-block;background:var(--vino);color:#fff;font-weight:700;padding:6px 14px;margin-bottom:12px}
.modal h3{font:700 46px/1.1 var(--serif);margin:6px 0 10px;color:var(--vino-t)}
.modal .offer{font-size:20px;margin:12px 0 20px}
.modal .btn{white-space:normal}
.btn{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;font-weight:700;color:var(--text);background:var(--cta);border:1px solid var(--vino-t)}
.btn-cta{min-height:62px;padding:10px 22px;font-size:18px}
.btn-cta-xl{min-height:86px;font-size:23px;width:100%;padding:16px 24px}
.sticky-cta{position:fixed;left:0;right:0;bottom:0;z-index:900;background:var(--vino-t);color:#fff;display:flex;align-items:center;justify-content:center;gap:20px;padding:10px 16px;font-size:17px}
.sticky-cta>span{min-width:0}
.sticky-cta .btn{flex:0 0 auto}

@media (max-width:820px){
  .hlasy{grid-template-columns:1fr}
  .hlas,.hlas+.hlas{padding:24px 0;border-left:0}
  .radky li{grid-template-columns:1fr;gap:8px}
  .pas{grid-template-columns:1fr}.pas figcaption{border-left:0;padding-left:0}
  .vsazena{float:none;width:100%;margin:24px 0}
  .otazka--vpravo .uzky{margin-inline:auto}
}
@media (max-width:560px){
  body{padding-bottom:128px;font-size:18px}
  .hlava__in{flex-wrap:wrap}
  .znacka{font-size:22px}
  .tl--velke{min-width:0;width:100%;font-size:21px}
  .otazka h1{font-size:40px}
  .otazka h2{font-size:32px}
  .otaznik{font-size:260px;left:auto;right:-30px;top:-30px}
  .uvod h1,.uvod__text{margin-left:0}
  .pas img{aspect-ratio:3/2}
  .uvod{padding-top:40px}
  .sticky-cta{flex-direction:column;gap:8px;text-align:center;padding:10px 12px}
  .sticky-cta .btn{width:100%}
  .modal{padding:40px 18px 24px}
  .modal h3{font-size:34px}
  .dotazy summary{font-size:22px}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}