/* AI shopping data fix (arling.sk/shopify-ai-fix/): page styles on top of /style/paper.css (body.noc).
   Mobile first; one accent (orange) only for the main action; the code specimen marks added lines with a plus sign
   and a green tint, never by colour alone. No card grids: lists, a timeline, one price box. */

.fx main>section{scroll-margin-top:calc(var(--hlavicka) + 8px)}
.fx .fx-hero{padding-top:clamp(28px,5vw,72px);padding-bottom:clamp(48px,7vw,104px)}
.fx-hero-grid{display:grid;gap:clamp(36px,4.4vw,72px);align-items:center}
.fx-hero-text{min-width:0}
/* Name of the service above the h1, as in the title and the menu (20. 10. 2026: was a kicker in capitals with a decorative
   dot from paper.css, which read as template chrome and carried no state). Label size and weight per PISMO-PRAVIDLA.md. */
.fx .fx-nazov{margin:0 0 clamp(14px,1.6vw,22px);font:500 clamp(.875rem,1.1vw,.9375rem)/1.4 var(--ui);letter-spacing:0;color:var(--body)}
/* Product h1 line height 1.18 per ops/design/PISMO-PRAVIDLA.md (paper.css body.noc h1 has 1.1). */
.fx .fx-hero-text h1{margin:0 0 clamp(24px,2.6vw,36px);max-width:15ch;line-height:1.18}
.fx-hero-text .lead{max-width:40ch;margin-bottom:14px}
/* One honest sentence on why the fields matter, below the lead and quieter than it. */
.fx .fx-preco{max-width:46ch;margin:0 0 clamp(22px,2.4vw,30px);font:400 clamp(15px,1.1vw,16px)/1.55 var(--ui);color:var(--muted)}

.fx .fx-cena{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px;margin:0 0 20px;font-family:var(--ui);max-width:none}
.fx-cena b{font:600 clamp(28px,2.6vw,36px)/1 var(--nadpis);color:var(--ink);letter-spacing:-.02em}
.fx-cena span{font-size:16px;color:var(--body)}
.fx-cena .fx-cena-podm{flex-basis:100%;font-size:15px;color:var(--muted)}

.fx .fx-akcie{display:flex;flex-wrap:wrap;align-items:center;gap:12px 24px;margin:0 0 clamp(26px,3vw,40px);max-width:none}
.fx-text-link{display:inline-flex;align-items:center;min-height:44px;font:500 15px/1.3 var(--ui);color:var(--ink)}
.fx .fx-dokaz{max-width:54ch;margin:0;padding-top:16px;border-top:1px solid var(--line);font:400 15px/1.55 var(--ui);color:var(--body)}
.fx-dokaz b{font-weight:600}

/* Code specimen: the real kind of change we make, values marked as examples in the caption. */
.fx-kod{margin:0;min-width:0;border:1px solid rgba(255,255,255,.13);border-radius:var(--r-l,18px);
  background:linear-gradient(180deg,#1c1816 0%,#110e0c 100%);box-shadow:var(--tien-ram);overflow:hidden}
.fx-kod-lista{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px 16px;padding:12px 16px;
  border-bottom:1px solid rgba(255,255,255,.08);font:500 14px/1.4 var(--ui);color:var(--muted)}
.fx-kod-legenda b{font:600 14px/1 var(--mono);color:var(--ok);margin-right:4px}
/* Code 14 px with line height 1.55 (PISMO-PRAVIDLA.md, smallest size of the code row) at every width. */
.fx .fx-kod pre{margin:0;padding:14px 0;border:0;border-radius:0;background:none;overflow:visible;max-width:none;
  font:14px/1.55 var(--mono);color:#e7e1db;tab-size:2}
.fx .fx-kod code{display:block;background:none;padding:0;border-radius:0;color:inherit;font:inherit}
.fx-kod .r{display:block;position:relative;padding:0 16px 0 34px;white-space:pre-wrap;overflow-wrap:anywhere}
.fx-kod .r.p{background:rgba(94,207,154,.09);color:#f1faf5}
.fx-kod .r.p::before{content:"+";position:absolute;left:14px;top:0;color:var(--ok);font-weight:600}
.fx-kod .k{color:#f4efe9}
.fx-kod .s{color:#c9bcae}
.fx-kod .r.p .s{color:#bfe8d3}
.fx-kod figcaption{padding:12px 16px 16px;border-top:1px solid rgba(255,255,255,.08);font:400 14px/1.5 var(--ui);color:var(--muted)}

/* Section heads and two-column layouts */
.fx .fx-sekcia h2{margin:0 0 28px}
.fx-sekcia .fx-uvodna{max-width:62ch;margin:0 0 clamp(24px,3vw,40px);color:var(--body)}
.fx-dva{display:grid;gap:clamp(24px,4vw,64px)}
.fx-uvod{min-width:0}
.fx-uvod p{max-width:44ch}

/* What the fix covers: numbered list on paper lines */
.fx-zoznam{list-style:none;margin:0;padding:0;counter-reset:fx;border-bottom:1px solid var(--line)}
.fx-zoznam>li{counter-increment:fx;display:grid;grid-template-columns:2.6rem minmax(0,1fr);column-gap:12px;
  padding:clamp(20px,2.2vw,28px) 0;border-top:1px solid var(--line)}
.fx-zoznam>li::before{content:counter(fx,decimal-leading-zero);grid-row:1 / span 4;font:500 14px/1.9 var(--mono);color:var(--muted)}
.fx-zoznam>li>*{grid-column:2;max-width:64ch}
.fx-zoznam h3{margin:0 0 8px}
.fx .fx-zoznam p{margin:0 0 8px}
.fx .fx-zoznam p:last-child{margin-bottom:0}
.fx-maly{font:400 14px/1.55 var(--ui);color:var(--muted)}
.fx-maly b{color:var(--body);font-weight:600}
.fx main .fx-maly a:not([class]){color:var(--body)}

/* How it works: a calm timeline */
.fx-kroky{list-style:none;margin:0;padding:0;max-width:60rem;border-left:1px solid var(--linka-2,rgba(255,255,255,.16))}
.fx-kroky>li{position:relative;display:grid;gap:4px;padding:0 0 clamp(24px,2.6vw,34px) 26px}
.fx-kroky>li:last-child{padding-bottom:0}
.fx-kroky>li::before{content:"";position:absolute;left:-6px;top:6px;width:11px;height:11px;border-radius:50%;
  background:var(--paper);border:1px solid var(--linka-3,rgba(255,255,255,.34))}
.fx-kroky>li.fx-krok-zaver::before{background:var(--ok);border-color:var(--ok)}
/* When each step happens: written normally, not in capitals (long labels, PISMO-PRAVIDLA.md; 20. 10. 2026). */
.fx-kedy{font:600 14px/1.5 var(--ui);letter-spacing:0;color:var(--muted)}
.fx-kroky h3{margin:0 0 4px}
.fx .fx-kroky p{margin:0;max-width:62ch}

/* Access: what we ask for and what we never touch */
.fx-pristup{display:grid;gap:clamp(28px,3.6vw,56px)}
.fx .fx-pristup h3{margin:0 0 18px}
.fx-prava{margin:0}
.fx-prava>div{padding:14px 0;border-top:1px solid var(--line)}
.fx-prava>div:last-child{border-bottom:1px solid var(--line)}
.fx-prava dt{font:600 16px/1.4 var(--nadpis);color:var(--ink)}
.fx-prava dd{margin:4px 0 0;max-width:56ch}
.fx-nie{list-style:none;margin:0;padding:0;border-bottom:1px solid var(--line)}
.fx-nie li{display:grid;grid-template-columns:1.4rem minmax(0,1fr);gap:8px;padding:12px 0;border-top:1px solid var(--line)}
.fx-nie li::before{content:"\00D7";font:600 18px/1.35 var(--ui);color:var(--muted)}
.fx .fx-zdroj{margin:14px 0 0;font:400 14px/1.6 var(--ui);color:var(--muted);max-width:none}
.fx main .fx-zdroj a:not([class]){color:var(--body)}

/* Price: one tight cluster (amount, contents, condition, action) and the limits next to it */
.fx-cena-grid{display:grid;gap:clamp(28px,3.6vw,56px);align-items:start}
.fx-cena-box{border:1px solid var(--linka-2,rgba(255,255,255,.16));border-radius:var(--r-xl,22px);padding:clamp(22px,3vw,40px);
  background:linear-gradient(180deg,rgba(30,26,23,.78),rgba(16,13,11,.78));box-shadow:var(--tien-3)}
.fx .fx-cena-box h2{font:600 15px/1.4 var(--ui);letter-spacing:0;color:var(--body);margin:0 0 12px}
.fx .fx-suma{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 14px;margin:0 0 20px;max-width:none}
.fx-suma b{font:600 clamp(48px,6vw,76px)/1 var(--nadpis);letter-spacing:-.03em;color:var(--ink)}
.fx-suma span{font:400 16px/1.4 var(--ui);color:var(--body)}
.fx-obsah{list-style:none;margin:0 0 18px;padding:0}
.fx-obsah li{display:grid;grid-template-columns:1.4rem minmax(0,1fr);gap:8px;padding:8px 0;color:var(--body)}
.fx-obsah li::before{content:"\2713";font:600 16px/1.55 var(--ui);color:var(--ok)}
.fx .fx-dph{font:400 14px/1.55 var(--ui);color:var(--muted);margin:0 0 22px;max-width:52ch}
.fx-hranice{padding:4px 0 4px clamp(18px,2vw,28px);border-left:2px solid var(--line-silna,#2b2320)}
.fx-hranice h3{margin:0 0 10px}
.fx-hranice p{max-width:58ch}
.fx-hranice .fx-nehodi-h{margin:clamp(28px,3vw,40px) 0 12px}
.fx-nehodi{max-width:58ch}

/* Request form: built on .dopyt-form from paper.css, taller fields and readable labels */
.fx-formular{min-width:0;max-width:36rem}
.fx .dopyt-form{gap:6px}
.fx .dopyt-form label{font:500 14.5px/1.4 var(--ui);color:var(--body);margin-top:12px}
.fx .dopyt-form label:first-of-type{margin-top:0}
.fx .dopyt-form label span{opacity:1;color:var(--muted);font-weight:400}
.fx .dopyt-form input:not([type="checkbox"]),.fx .dopyt-form textarea{min-height:48px;font-size:16px}
.fx .dopyt-form textarea{min-height:104px}
.fx .fx-pomoc{margin:0;font:400 14px/1.45 var(--ui);color:var(--muted)}
.fx .dopyt-form .fx-suhlas{display:grid;grid-template-columns:22px minmax(0,1fr);gap:12px;align-items:start;margin-top:18px;
  font:400 14.5px/1.5 var(--ui);color:var(--body);cursor:pointer}
.fx .dopyt-form .fx-suhlas input{width:22px;height:22px;min-height:0;margin:1px 0 0;padding:0;border-radius:5px}
.fx .dopyt-form .fx-suhlas span{opacity:1;color:var(--body)}
.fx .dopyt-form button{margin-top:20px;align-self:stretch;justify-content:center}
.fx-pasca{position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}
.fx .fx-stav{margin:16px 0 0;padding:14px 16px;border-radius:var(--r-m,14px);font:500 15px/1.5 var(--ui);max-width:none}
.fx-stav.dopyt-vdaka{border:1px solid rgba(94,207,154,.35);background:rgba(94,207,154,.08)}
.fx-stav.dopyt-chyba{border:1px solid rgba(255,138,112,.4);background:rgba(255,138,112,.08)}
.fx-stav:focus{outline:2px solid var(--ink);outline-offset:3px}
.fx .fx-sukromie{margin:22px 0 0;font:400 14px/1.55 var(--ui);color:var(--muted);max-width:56ch}
.fx main .fx-sukromie a:not([class]),.fx main .fx-suhlas a{color:var(--body)}
.fx-potom{list-style:none;margin:20px 0 0;padding:0}
.fx-potom li{display:grid;grid-template-columns:1.4rem minmax(0,1fr);gap:8px;padding:8px 0;border-top:1px solid var(--line);font:400 15px/1.55 var(--ui);color:var(--body);max-width:46ch}
.fx-potom li::before{content:"\2192";color:var(--muted)}

/* FAQ */
.fx-faq{max-width:56rem}
.fx-faq details{border-top:1px solid var(--line)}
.fx-faq details:last-of-type{border-bottom:1px solid var(--line)}
.fx-faq summary{position:relative;display:block;min-height:44px;padding:18px 40px 18px 0;cursor:pointer;list-style:none;
  font:600 17px/1.4 var(--nadpis);color:var(--ink)}
.fx-faq summary::-webkit-details-marker{display:none}
.fx-faq summary::after{content:"+";position:absolute;right:8px;top:15px;font:400 24px/1 var(--ui);color:var(--muted);
  transition:transform .2s var(--tik,ease)}
.fx-faq details[open]>summary::after{transform:rotate(45deg)}
.fx-faq summary:focus-visible{outline:2px solid var(--ink);outline-offset:4px;border-radius:6px}
.fx-faq details>p{margin:0 0 20px;max-width:66ch}

/* Terms of this service: folded under one summary (page length on mobile, gate N6), one numbered list inside.
   A link to #terms opens them (ai-fix.js); without JavaScript the summary opens them natively. */
.fx-terms-det{max-width:68ch;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.fx-terms-det>summary{position:relative;display:flex;align-items:center;min-height:52px;padding:12px 40px 12px 0;cursor:pointer;list-style:none;
  font:600 17px/1.4 var(--nadpis);color:var(--ink)}
.fx-terms-det>summary::-webkit-details-marker{display:none}
.fx-terms-det>summary::after{content:"+";position:absolute;right:8px;top:50%;margin-top:-12px;font:400 24px/1 var(--ui);color:var(--muted);
  transition:transform .2s var(--tik,ease)}
.fx-terms-det[open]>summary::after{transform:rotate(45deg)}
.fx-terms-det>summary:focus-visible{outline:2px solid var(--ink);outline-offset:4px;border-radius:6px}
.fx-terms-det>.fx-terms{padding-bottom:22px}
.fx-terms{margin:0;padding:0 0 0 1.6rem;max-width:68ch}
.fx-terms>li{margin:0 0 14px;padding-left:6px;color:var(--body)}
.fx-terms>li:last-child{margin-bottom:0}
.fx-terms>li::marker{font:500 14px/1 var(--mono);color:var(--muted)}
.fx-terms b{color:var(--ink)}

.fx .fx-firma{padding-top:clamp(40px,5vw,72px);padding-bottom:clamp(48px,6vw,88px)}
.fx .fx-firma h2{font-size:clamp(1.375rem,2vw,1.75rem);margin-bottom:16px}
.fx-firma p{max-width:70ch}

@media (min-width:48em){
  .fx-pristup{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .fx .dopyt-form button{align-self:flex-start}
  .fx-kroky>li{grid-template-columns:13rem minmax(0,1fr);column-gap:28px;padding-left:30px}
  .fx-kroky>li>.fx-kedy{padding-top:3px}
}
@media (min-width:62em){
  /* The code specimen (with deliveryTime, gate P7) is taller than the text: the text starts at the top, so the price
     and the main action stay in the first window at 1440 x 900. */
  .fx-hero-grid{grid-template-columns:minmax(0,7fr) minmax(0,5fr);align-items:start}
  .fx-dva{grid-template-columns:minmax(0,4fr) minmax(0,7fr)}
  .fx-uvod{position:sticky;top:calc(var(--hlavicka) + 24px);align-self:start}
  .fx-cena-grid{grid-template-columns:minmax(0,6fr) minmax(0,5fr)}
  .fx-hranice{margin-top:12px}
}
@media (max-width:40em){
  .fx-akcie .btn{width:100%;justify-content:center}
  .fx-akcie .fx-text-link{width:100%;justify-content:center}
  .fx-cena-box .btn{width:100%;justify-content:center}
}
@media (prefers-reduced-motion:reduce){
  .fx-faq summary::after,.fx-terms-det>summary::after{transition:none}
}