/* ============================================================= FIREB — ZÁKLAD Reset, výchozí vzhled HTML prvků, typografie, pomocné třídy. ============================================================= */ *,*::before,*::after{box-sizing:border-box} *{margin:0;padding:0} html{ scroll-behavior:smooth; scroll-padding-top:calc(var(--header-top) + var(--header-h) + var(--space-6)); -webkit-text-size-adjust:100%; } body{ /* Dekorace (záře za hero) přesahují obsah. `clip` je uřízne, aniž by z body udělalo posuvný kontejner — sticky hlavička tím pádem drží. */ overflow-x:clip; font-family:var(--font-sans); font-size:var(--fs-body); line-height:var(--lh-body); color:var(--text); background:var(--bg); -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; text-rendering:optimizeLegibility; } /* ---------- Základní prvky ---------- */ a{color:inherit;text-decoration:none} button,input,select,textarea{font:inherit;color:inherit} button{cursor:pointer;border:0;background:none} img,svg,video,canvas{max-width:100%;display:block} img{height:auto} ul,ol{list-style:none} hr{border:0;border-top:1px solid var(--border)} ::selection{background:var(--accent-soft);color:var(--accent-strong)} :focus-visible{ outline:2px solid var(--focus); outline-offset:3px; border-radius:var(--r-xs); } :focus:not(:focus-visible){outline:none} /* ---------- Typografie ---------- */ h1,h2,h3,h4{ font-family:var(--font-display); font-weight:var(--fw-semibold); letter-spacing:var(--ls-heading); line-height:var(--lh-heading); text-wrap:balance; } h1{font-size:var(--fs-h1);letter-spacing:var(--ls-display)} h2{font-size:var(--fs-h2);line-height:1.05} h3{font-size:var(--fs-h3)} h4{font-size:var(--fs-h4);letter-spacing:-.02em} /* Hero nadpis — jediné místo s největším stupněm */ .display{ font-size:var(--fs-display); line-height:var(--lh-tight); letter-spacing:var(--ls-display); } p{max-width:var(--measure)} strong,b{font-weight:var(--fw-semibold)} small{font-size:var(--fs-xs)} code,kbd,samp,pre{font-family:var(--font-mono);font-size:.92em} /* ---------- Textové role ---------- */ /* Perex pod nadpisem */ .lead{ font-size:var(--fs-lead); line-height:var(--lh-body); color:var(--text-2); max-width:var(--measure); margin-top:var(--space-6); } /* Drobná poznámka pod CTA — „14 dní zdarma · bez platební karty“ */ .note{ font-family:var(--font-mono); font-size:var(--fs-2xs); color:var(--text-mute); margin-top:var(--space-4); letter-spacing:.01em; } /* Popisek pod ukázkou — „Ukázková data.“ */ .caption{ font-family:var(--font-mono); font-size:var(--fs-2xs); color:var(--text-faint); } .mono{font-family:var(--font-mono)} /* Verzálky v mono — nadpisy sloupců v patičce, štítky tabulek */ .overline{ font-family:var(--font-mono); font-size:var(--fs-xs); font-weight:var(--fw-semibold); letter-spacing:var(--ls-caps); text-transform:uppercase; } /* ---------- Pomocné třídy ---------- */ .u-accent{color:var(--text-accent)} .u-mute{color:var(--text-mute)} .u-center{text-align:center} p.u-center{margin-inline:auto} /* odstavec má max. šířku — bez auto-okrajů by se centroval jen text v levém bloku */ .u-nowrap{white-space:nowrap} .u-measure{max-width:var(--measure)} /* Skryté vizuálně, čitelné pro odečítač obrazovky */ .u-sr{ position:absolute; width:1px;height:1px; padding:0;margin:-1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; } /* Přeskočit na obsah — první prvek v */ .skip-link{ position:absolute; left:var(--space-4); top:-100px; z-index:var(--z-modal); background:var(--text); color:var(--c-white); padding:var(--space-3) var(--space-5); border-radius:var(--r-sm); font-size:var(--fs-sm); font-weight:var(--fw-semibold); transition:top var(--dur) var(--ease); } .skip-link:focus{top:var(--space-4)} /* ---------- Postupné odkrývání při scrollu ---------- */ /* Skrývá se jen tehdy, když běží JS — bez něj je obsah rovnou vidět. */ .js .rv{ opacity:0; transform:translateY(22px); transition:opacity var(--dur-reveal) var(--ease-out), transform var(--dur-reveal) var(--ease-out); } .js .rv.is-in{opacity:1;transform:none} /* Zpoždění pro postupný nástup skupiny prvků */ .js .rv[data-rv-delay="1"]{transition-delay:.08s} .js .rv[data-rv-delay="2"]{transition-delay:.16s} .js .rv[data-rv-delay="3"]{transition-delay:.24s} .js .rv[data-rv-delay="4"]{transition-delay:.32s} .js .rv[data-rv-delay="5"]{transition-delay:.40s} /* ---------- Omezený pohyb ---------- */ @media (prefers-reduced-motion:reduce){ html{scroll-behavior:auto} .js .rv{opacity:1;transform:none;transition:none} *,*::before,*::after{ animation-duration:.01ms!important; animation-iteration-count:1!important; transition-duration:.01ms!important; } } /* ---------- Tisk ---------- */ @media print{ .site-header,.site-footer,.skip-link{display:none} body{background:#fff} }