/* Veřejná stránka Účtárny. Papírové pozadí, jedna serifová linka pro nadpisy, zelená a zlatá z produktu.
   Žádné karty s ikonkami, žádné přechody – má to vypadat jako dopis od člověka, ne jako šablona. */
@import url('https://fonts.googleapis.com/css2?family=Lato:wght@300;400;700&family=Source+Serif+4:opsz,wght@8..60,400;8..60,600&display=swap');

:root{
  --papir:#fbfaf7; --papir-2:#f4f2ec; --bila:#fff;
  --inkoust:#1e2420; --text:#3a423c; --tlum:#7b8279;
  --zelena:#0f3d2e; --zelena-2:#1b5a44; --zlata:#c9a227; --zlata-tlum:#e8dfbe;
  --linka:#e4e1d7;
  --oblouk:8px;          /* jeden poloměr na všechno, ať web nevypadá slepený ze dvou */
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--papir);color:var(--text);
     font:400 17.5px/1.65 Lato,"Segoe UI",system-ui,sans-serif;-webkit-font-smoothing:antialiased}
h1,h2,h3,.serif{font-family:"Source Serif 4",Georgia,"Iowan Old Style","Times New Roman",serif;color:var(--inkoust);font-weight:400}
a{color:var(--zelena-2)}
p{margin:0 0 1.1em}
.obal{max-width:1060px;margin:0 auto;padding:0 32px}
.uzky{max-width:660px}

/* ---------- hlavička ---------- */
header.hl{border-bottom:1px solid var(--linka)}
header.hl .obal{display:flex;align-items:baseline;justify-content:space-between;gap:20px;padding-top:22px;padding-bottom:16px}
/* značka je slovo s dvojitou zlatou linkou – v účetnictví se tak podtrhává konečný, zkontrolovaný součet */
.znacka{display:inline-block;color:var(--inkoust);text-decoration:none}
.znacka span{position:relative;display:inline-block;font-family:"Source Serif 4",Georgia,serif;font-size:22px;
             letter-spacing:.005em;padding-bottom:9px}
.znacka span:after{content:"";position:absolute;left:0;right:0;bottom:0;height:0;
                   border-top:2px solid var(--zlata);border-bottom:1px solid var(--zlata);padding-top:2px}
.znacka:hover span{color:var(--zelena)}
.vstup{font-size:15px;color:var(--text);text-decoration:none;border-bottom:1px solid var(--zlata-tlum);padding-bottom:2px;white-space:nowrap}
.vstup:hover{color:var(--zelena);border-bottom-color:var(--zlata)}

/* ---------- úvod ---------- */
.uvod{padding:84px 0 72px}
.nadtitul{font-size:13px;letter-spacing:.18em;text-transform:uppercase;color:var(--tlum);margin:0 0 26px}
h1{font-size:clamp(36px,5.6vw,62px);line-height:1.04;letter-spacing:-.02em;margin:0 0 26px;max-width:15.5em}
h1 .druhy{display:block;color:var(--zelena-2)}
.lead{font-size:20px;line-height:1.6;max-width:33em;color:var(--text)}
.lead-hlavni{display:block;color:var(--inkoust);margin-bottom:.3em}
.akce{display:flex;flex-wrap:wrap;align-items:center;gap:16px 26px;margin:34px 0 0}
.tlacitko{display:inline-block;background:var(--zelena);color:#fff;text-decoration:none;padding:14px 26px;border-radius:var(--oblouk);
          font-size:16.5px;letter-spacing:.01em;border:1px solid var(--zelena)}
.tlacitko:hover{background:var(--zelena-2);border-color:var(--zelena-2)}
.odkaz{font-size:16.5px;color:var(--text);text-decoration:none;border-bottom:1px solid var(--zlata);padding-bottom:2px}
.odkaz:hover{color:var(--zelena)}

/* jedno číslo, když je čím se chlubit */
.cislo-pas{margin:64px 0 -12px;display:flex;align-items:baseline;gap:20px;flex-wrap:wrap}
.cislo-pas b{font-family:"Source Serif 4",Georgia,serif;font-weight:400;font-size:clamp(34px,5vw,52px);color:var(--zelena-2);line-height:1}
.cislo-pas span{font-size:17px;color:var(--tlum);max-width:24em}

/* pás tří faktů */

/* ---------- sekce ---------- */
section{padding:72px 0}
h2{font-size:clamp(26px,3.4vw,36px);line-height:1.2;letter-spacing:-.01em;margin:0 0 22px;max-width:18em}
.popisek{font-size:14px;letter-spacing:.14em;text-transform:uppercase;color:var(--tlum);margin:0 0 30px}

/* tři pilíře */

/* ukázka přehledu */

/* přechod – kroky */

/* garance */

/* pro koho to není */

/* kontakt */
.podpis{margin-top:26px;font-size:16px;color:var(--tlum)}
.podpis b{display:block;font-family:"Source Serif 4",Georgia,serif;font-weight:400;font-size:19px;color:var(--inkoust);margin-bottom:2px}

/* pata */
footer.pt{border-top:1px solid var(--linka);padding:30px 0 46px;font-size:14.5px;color:var(--tlum)}
footer.pt .obal{display:flex;flex-wrap:wrap;gap:10px 26px;align-items:center;justify-content:space-between}
footer.pt a{color:var(--text);text-decoration:none;border-bottom:1px solid var(--zlata-tlum)}
footer.pt a:hover{color:var(--zelena)}

@media (max-width:900px){
  .obal{padding:0 20px}
  body{font-size:17px}
  .uvod{padding-top:54px}
  section{padding:54px 0}
}

/* ---------- kdo za tím stojí ---------- */

/* ---------- poptávkový formulář ---------- */
.dekujeme{border-left:3px solid var(--zlata);background:#fdfcf6;padding:18px 22px;margin:0 0 30px}
.dekujeme b{font-family:"Source Serif 4",Georgia,serif;font-weight:400;font-size:20px;color:var(--inkoust);display:block;margin-bottom:4px}
.dekujeme p{margin:0;font-size:16.5px}
#kontakt .tlacitko{margin:6px 0 2px}

dialog.poptavka{border:0;padding:0;background:transparent;max-width:560px;width:calc(100% - 32px)}
dialog.poptavka::backdrop{background:rgba(15,45,35,.55)}
dialog.poptavka form{background:var(--bila);border:1px solid var(--linka);border-radius:calc(var(--oblouk) + 4px);padding:26px 28px 24px;
                     box-shadow:0 18px 50px rgba(15,35,25,.22)}
dialog.poptavka .hlavicka{display:flex;align-items:baseline;justify-content:space-between;gap:16px}
dialog.poptavka h3{font-size:25px;margin:0 0 2px}
dialog.poptavka .zavrit{font-size:26px;line-height:1;color:var(--tlum);text-decoration:none;padding:0 4px}
dialog.poptavka .zavrit:hover{color:var(--inkoust)}
dialog.poptavka .vysvetleni{font-size:15px;color:var(--tlum);margin:0 0 18px}
dialog.poptavka .chyba{background:#fdf1ee;border-left:3px solid #b0442c;color:#8c3421;font-size:15.5px;padding:10px 14px;margin:0 0 16px}
dialog.poptavka label{display:block;font-size:14px;color:var(--text);margin-bottom:14px}
dialog.poptavka label i{color:#b0442c;font-style:normal}
dialog.poptavka .nepovinne{color:var(--tlum);font-size:13px}
dialog.poptavka input,dialog.poptavka textarea{display:block;width:100%;margin-top:6px;font:inherit;font-size:16.5px;color:var(--inkoust);
  background:var(--papir);border:1px solid #d9d6cc;border-radius:var(--oblouk);padding:11px 13px}
dialog.poptavka input:focus,dialog.poptavka textarea:focus{outline:none;border-color:var(--zelena-2);background:#fff;
  box-shadow:0 0 0 3px rgba(27,90,68,.1)}
dialog.poptavka textarea{resize:vertical;min-height:88px;line-height:1.5}
dialog.poptavka .dve{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}
dialog.poptavka .past{position:absolute;left:-9999px;width:1px;height:1px}
dialog.poptavka .paticka{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-top:6px}
dialog.poptavka button{background:var(--zelena);color:#fff;border:1px solid var(--zelena);border-radius:var(--oblouk);
  padding:13px 30px;font:inherit;font-size:16.5px;cursor:pointer}
dialog.poptavka button:hover{background:var(--zelena-2)}
dialog#poptavka:target{display:block;position:static;margin:0 auto 60px}   /* bez JS se formulář ukáže jako sekce */

@media (max-width:900px){
  dialog.poptavka form{padding:22px 20px 20px}
  dialog.poptavka .dve{grid-template-columns:1fr}
}


/* prodejní zóna: výčet vlevo, kurzívou proti němu věta, která ho shrne */
.nabidka{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
.nabidka ul{list-style:none;margin:0;padding:0}
.nabidka li{position:relative;padding:13px 0 13px 26px;border-top:1px solid var(--linka);font-size:17px;color:var(--text)}
.nabidka li:last-child{border-bottom:1px solid var(--linka)}
.nabidka li::before{content:"";position:absolute;left:2px;top:23px;width:7px;height:7px;border-radius:50%;background:var(--zlata)}
.rukou{font-family:"Source Serif 4",Georgia,serif;font-style:italic;font-size:clamp(25px,3.4vw,38px);
  line-height:1.32;letter-spacing:-.01em;color:var(--zelena-2);margin:0;padding-left:32px;
  border-left:3px solid var(--zlata)}
@media(max-width:900px){
  .nabidka{grid-template-columns:1fr;gap:34px}
  .rukou{font-size:25px;padding-left:22px}
}

/* ceník jako opravdová tabulka – mřížka, hlavička na podkladu, cena serifem */
.cenik-uvod{max-width:40em;margin:-14px 0 34px;color:var(--text)}
.cenik-ram{overflow-x:auto;border:1px solid var(--linka);border-radius:var(--oblouk)}
.cenik{width:100%;min-width:700px;border-collapse:collapse;text-align:left;background:var(--bila)}
.cenik th,.cenik td{padding:12px 16px;border:1px solid var(--linka);vertical-align:top}
.cenik thead th{background:var(--papir-2);font-family:"Source Serif 4",Georgia,serif;font-weight:400;
  font-size:18px;line-height:1.25;color:var(--inkoust);border-bottom:2px solid var(--zlata)}
.cenik tbody th{background:#faf9f4;font-weight:400;font-size:15px;color:var(--text);width:28%}
.cenik td{font-size:15.5px;color:var(--text);width:24%}
.cenik tr.pro-koho td{color:var(--tlum);font-size:14.5px;line-height:1.5}
.cenik tr.radek-cena td{background:#fdfcf6;padding-top:14px;padding-bottom:14px}
.cenik tr.radek-cena b{font-family:"Source Serif 4",Georgia,serif;font-weight:400;font-size:24px;
  line-height:1.15;color:var(--inkoust);display:block}
.cenik tr.radek-cena span{display:block;font-size:13px;color:var(--tlum);margin-top:3px}
.cenik td.ano{color:var(--zelena-2)}
.cenik td.ne{color:#bcc0b8}
.pod-cenikem{margin:26px 0 0;font-size:15px;color:var(--tlum)}
.posun{display:none}
@media(max-width:900px){
  .cenik-uvod{margin-top:-6px}
  .cenik th,.cenik td{padding:10px 13px}
  .posun{display:block;margin:10px 0 0;font-size:13.5px;color:var(--tlum)}   /* na úzké obrazovce tabulka ujíždí do strany */
}

/* ---------- sekce vrácené z delší verze stránky ---------- */
section.tmava{background:var(--zelena);color:#d9e2dc}
section.tmava h2,section.tmava .citat{color:#fff}
section.svetla{background:var(--papir-2)}
.citat{font-family:"Source Serif 4",Georgia,serif;font-size:clamp(24px,3.4vw,33px);line-height:1.35;margin:0 0 26px;max-width:18em}
.tmava p{color:#c6d2cb;max-width:36em}

.kroky{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:40px;margin-top:8px;counter-reset:krok}
.krok{border-top:2px solid var(--zlata);padding-top:16px}
.krok h3{font-size:19px;margin:0 0 9px;line-height:1.3}
.krok h3:before{counter-increment:krok;content:counter(krok) ". ";color:var(--zlata);font-family:Lato,sans-serif;font-size:14px}
.krok p{font-size:16px;margin:0;color:var(--text)}

.dvojice{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start}
.dvojice h3{font-size:20px;margin:0 0 14px}
.dvojice p{font-size:16.5px}

.udaje{width:100%;border-collapse:collapse}
.udaje td{padding:10px 0;border-bottom:1px solid var(--linka);font-size:16px;vertical-align:top}
.udaje td:first-child{color:var(--tlum);width:34%;padding-right:14px}

.seznam{list-style:none;padding:0;margin:0;max-width:46em}
.seznam li{border-top:1px solid var(--linka);padding:15px 0;font-size:16.5px}
.seznam li:last-child{border-bottom:1px solid var(--linka)}
.seznam b{color:var(--inkoust)}
.otazky li b{display:block;font-family:"Source Serif 4",Georgia,serif;font-weight:400;font-size:18px;margin-bottom:5px}

.garance{border:1px solid var(--zlata-tlum);background:#fdfcf6;border-radius:var(--oblouk);padding:30px 32px;margin-top:30px;max-width:820px}
.garance .veta{font-family:"Source Serif 4",Georgia,serif;font-size:clamp(20px,2.6vw,26px);line-height:1.3;color:var(--inkoust);margin:0 0 14px}
.garance p{margin:0;font-size:16px;color:var(--text)}

.fakta{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:34px;margin:0 0 34px}
.fakta b{display:block;font-family:"Source Serif 4",Georgia,serif;font-weight:400;font-size:30px;color:var(--inkoust);margin-bottom:5px}
.fakta small{font-size:14.5px;color:var(--tlum);line-height:1.5}

.cenik tbody th span{display:block;font-size:13px;color:var(--tlum);margin-top:3px}
.muted{color:var(--tlum)}
.small{font-size:14.5px}

@media(max-width:900px){
  .dvojice{grid-template-columns:1fr;gap:34px}
  .kroky{grid-template-columns:1fr;gap:28px}
  .fakta{gap:24px}
  .garance{padding:24px 20px}
}

/* hrdina: místo slíbené záruky tři změřená čísla – důkaz mluví líp než tvrzení */
.duvera{display:flex;flex-wrap:wrap;gap:8px 26px;align-items:baseline;margin:30px 0 4px;
  font-size:15px;color:var(--tlum)}
.duvera span{display:inline-flex;align-items:baseline;gap:7px}
.duvera b{font-family:"Source Serif 4",Georgia,serif;font-weight:400;font-size:23px;color:var(--zelena-2)}
.dekujeme{border-radius:var(--oblouk)}
@media(max-width:900px){ .duvera{gap:6px 18px;font-size:14px} .duvera b{font-size:20px} }

/* ceník po řádcích: nula za zpracování je hlavní sdělení, ať ji oko najde první */
.cenik4 tbody th{width:20%}
.cenik4 td{width:26.6%}
.cenik .zdarma{background:#f6f4ea}
.cenik thead th.zdarma{background:#efeada}
.cenik td.zdarma b{font-family:"Source Serif 4",Georgia,serif;font-weight:400;font-size:25px;
  line-height:1.15;color:var(--zelena-2);display:block}
.cenik td.zdarma span{display:block;font-size:12.5px;color:var(--tlum);margin-top:3px}
.cenik-hlavni{font-family:"Source Serif 4",Georgia,serif;font-size:clamp(23px,3vw,32px);
  line-height:1.28;color:var(--inkoust);margin:-16px 0 30px;max-width:18em}