/* =========================================================================
   Stránka /pre-firmy (business.php)
   Všetko je pod .b2b (trieda na <main>), aby sa štýly nedostali do hlavičky,
   navigácie a pätky, ktoré štýluje style.css.
   ========================================================================= */

.b2b {
	--cream: #F2EBE5; --sand: #E5DCD3; --taupe: #B5A89E; --taupe-dark: #9C8D82; --ink: #2C292B;
	--charcoal: #323232; --graphite: #5a5552; --gold: #B19562; --gold-deep: #967B4A; --gold-soft: #C2AC84;
	--linen: #E3E2E0; --white: #fff; --error: #A94442;
	--script: 'WindSong', cursive; --display: 'Marcellus', 'Dosis', serif; --sans: 'Dosis', 'Helvetica Neue', Arial, sans-serif;
	--wrap: 1170px;

	display: block;
	background: var(--white);
	color: var(--charcoal);
	font: 400 17px/1.65 var(--sans);
}

html:has(.b2b) { scroll-behavior: smooth; }
.b2b [hidden] { display: none !important; }
.b2b a { color: inherit; }
.b2b h1, .b2b h2, .b2b h3 { font-weight: 300; margin: 0; text-wrap: balance; }
.b2b p { margin: 0; }
.b2b :focus-visible { outline: 2px solid var(--gold-deep); outline-offset: 3px; }
.b2b .wrap { max-width: var(--wrap); margin-inline: auto; padding-inline: 20px; }
/* sticky sub-nav by inak prekryla nadpis sekcie po kliknutí na kotvu */
.b2b section[id] { scroll-margin-top: 56px; }

/* style.css dáva všetkým <img> crisp-edges (zúbkované zmenšené fotky)
   a translateZ/blur hack – tu ich vraciame na štandard */
.b2b img { display: block; max-width: 100%; image-rendering: auto; filter: none; transform: none; }

/* style.css štýluje všetky <button> (okraj, zaoblenie, margin) */
.b2b button.btn { margin: 0; border-radius: 0; }

@media (prefers-reduced-motion: reduce) {
	html:has(.b2b) { scroll-behavior: auto; }
	.b2b * { transition: none !important; animation: none !important; }
}

/* ---------- spoločné ---------- */
.b2b .eyebrow { font: 400 13px/1 var(--sans); letter-spacing: .28em; text-transform: uppercase; color: var(--taupe-dark); }
.b2b .caps { font-family: var(--display); text-transform: uppercase; letter-spacing: .2em; color: var(--ink); font-weight: 400; }
.b2b .script { font-family: var(--script); font-weight: 500; color: var(--taupe); line-height: 1; }
.b2b .sec { padding-block: clamp(64px, 9vw, 112px); }
.b2b .sec-head { text-align: center; max-width: 680px; margin: 0 auto clamp(36px, 5vw, 56px); display: grid; gap: 14px; justify-items: center; }
.b2b .sec-head h2 { font-family: var(--script); font-weight: 500; color: var(--taupe); font-size: clamp(44px, 6vw, 60px); line-height: 1; }
.b2b .sec-head p { color: var(--graphite); }
.b2b .btn { display: inline-flex; align-items: center; justify-content: center; gap: .6em; font: 500 16px/1 var(--sans); letter-spacing: .06em; padding: 1em 2em; border: 0; border-radius: 0; text-decoration: none; cursor: pointer; transition: background .2s, color .2s; }
.b2b .btn-gold { background: var(--gold); color: #fff; }
.b2b .btn-gold:hover { background: var(--gold-deep); color: #fff; }
.b2b .btn-line { background: transparent; color: var(--charcoal); box-shadow: inset 0 0 0 1px var(--taupe); }
.b2b .btn-line:hover { background: var(--taupe); color: #fff; }
.b2b .btn[disabled] { opacity: .6; cursor: wait; }
.b2b .soft-cream { background: linear-gradient(#fff 0, var(--cream) 90px, var(--cream) calc(100% - 90px), #fff 100%); }

/* ---------- hero ---------- */
.b2b .hero { position: relative; padding-block: clamp(28px, 5vw, 56px) clamp(40px, 6vw, 72px); }
.b2b .hero-grid { display: grid; grid-template-columns: 1fr; gap: 28px; align-items: center; }
/* hero je zámerne širší ako zvyšok stránky (1170 px) – na veľkých monitoroch inak pôsobil úzko */
.b2b .hero .wrap { max-width: 1400px; }
.b2b .hero-photo { order: -1; position: relative; }
.b2b .hero-photo img { width: 100%; aspect-ratio: 3/2; object-fit: cover;
	-webkit-mask-image: radial-gradient(ellipse 75% 78% at 55% 50%, #000 60%, transparent 100%);
	mask-image: radial-gradient(ellipse 75% 78% at 55% 50%, #000 60%, transparent 100%); }
.b2b .hero-copy { text-align: center; display: grid; gap: 22px; justify-items: center; }
.b2b .hero h1 { display: grid; gap: 0; }
.b2b .hero h1 .caps { font-size: clamp(22px, 3.2vw, 34px); line-height: 1.35; }
.b2b .hero h1 .script { font-size: clamp(64px, 9vw, 104px); margin-top: -.08em; }
.b2b .hero-lead { max-width: 30em; font-size: 18px; color: var(--graphite); }
.b2b .hero-cta { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; }
.b2b .facts { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 22px; list-style: none; margin: 6px 0 0; padding: 0; font-size: 15px; color: var(--graphite); }
.b2b .facts li { display: flex; align-items: center; gap: 8px; }
.b2b .facts li::before { content: ""; width: 6px; height: 6px; background: var(--gold); transform: rotate(45deg); }
@media (min-width: 900px) {
	.b2b .hero-grid { grid-template-columns: 5fr 7fr; gap: 0; }
	.b2b .hero-photo { order: 0; }
	.b2b .hero-copy { text-align: left; justify-items: start; position: relative; z-index: 1; }
	.b2b .hero-cta, .b2b .facts { justify-content: flex-start; }
}

/* ---------- sticky sub-nav ---------- */
.b2b .subnav { position: sticky; top: env(safe-area-inset-top, 0px); z-index: 20; background: rgba(255, 255, 255, .94); backdrop-filter: blur(8px); border-block: 1px solid var(--linen); }
.b2b .subnav .wrap { display: flex; align-items: center; gap: 6px; overflow-x: auto; scrollbar-width: none; }
.b2b .subnav .wrap::-webkit-scrollbar { display: none; }
.b2b .subnav a { flex: none; text-decoration: none; font-size: 15px; letter-spacing: .04em; padding: 14px 12px; color: var(--graphite); }
.b2b .subnav a:hover { color: var(--ink); }
.b2b .subnav .btn { margin-left: auto; padding: .7em 1.3em; font-size: 14px; color: #fff; }

/* ---------- pre koho ---------- */
.b2b .who { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: clamp(20px, 3vw, 32px); }
.b2b .who-card { display: grid; gap: 12px; }
.b2b .who-card .ph { overflow: hidden; aspect-ratio: 4/3; background: var(--cream); }
.b2b .who-card img { width: 100%; height: 100%; object-fit: cover; }
.b2b .who-card h3 { font: 400 15px/1.2 var(--sans); letter-spacing: .2em; text-transform: uppercase; color: var(--ink); display: flex; justify-content: space-between; align-items: center; padding-top: 6px; border-top: 1px solid var(--linen); }
.b2b .who-card h3 span { color: var(--taupe); font-size: 13px; letter-spacing: .08em; text-transform: none; }
.b2b .who-card p { color: var(--graphite); font-size: 16px; }

/* ---------- darčeky a ceny ---------- */
/* flex namiesto gridu: keď sa 3 karty zalomia (tablet 2 + 1), posledná ostane v strede, nie osamotená vľavo */
.b2b .tiers { display: flex; flex-wrap: wrap; justify-content: center; gap: clamp(20px, 3vw, 32px); align-items: stretch; }
.b2b .tier { flex: 1 1 300px; max-width: 380px; position: relative; background: #fff; display: flex; flex-direction: column; text-align: center; cursor: pointer; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s, transform .3s; }
.b2b .tier:hover { box-shadow: inset 0 0 0 1px var(--taupe); }
.b2b .tier.is-on { box-shadow: inset 0 0 0 2px var(--gold); }
.b2b .tier.is-on .tier-body::before { content: "✓ Vybraté"; position: absolute; top: 14px; right: 14px; font-size: 12px; letter-spacing: .14em; text-transform: uppercase; background: #fff; color: var(--gold-deep); padding: .35em .8em; }
.b2b .tier img { width: 100%; aspect-ratio: 1/1; object-fit: cover; pointer-events: none; }
.b2b .ribbon { position: absolute; top: 0; left: 0; right: 0; z-index: 1; background: var(--gold); color: #fff; font: 500 12px/1 var(--sans); letter-spacing: .28em; text-transform: uppercase; padding: 11px 8px; }
.b2b .tier.featured.is-on .tier-body::before { top: 50px; }
.b2b .tier.featured h3 { font-size: 48px; }
.b2b .tier.featured:not(.is-on) { box-shadow: inset 0 0 0 1px var(--gold); }
.b2b .tier.featured .price b { font-size: 40px; }
@media (min-width: 900px) {
	.b2b .tier.featured { transform: translateY(-18px); }
	.b2b .tiers { padding-top: 18px; }
}
.b2b .tier-body { padding: 26px 24px 30px; display: flex; flex-direction: column; gap: 10px; flex: 1; }
.b2b .tier h3 { font-family: var(--script); font-weight: 500; color: var(--taupe); font-size: 46px; line-height: 1; }
.b2b .tier .desc { color: var(--graphite); font-size: 16px; min-height: 3.3em; }
.b2b .price { font: 500 15px/1 var(--sans); color: var(--graphite); letter-spacing: .06em; margin-top: auto; padding-top: 8px; }
.b2b .price b { font: 600 34px/1 var(--sans); color: var(--gold-deep); letter-spacing: 0; margin: 0 .15em; }
.b2b .tier .btn { margin-top: 14px; align-self: center; }
.b2b .terms { margin-top: clamp(32px, 4vw, 48px); display: grid; gap: 1px; background: var(--sand); border: 1px solid var(--sand); }
.b2b .term { background: #fff; padding: 22px 24px; display: grid; gap: 4px; align-content: start; }
.b2b .term strong { font: 500 20px/1.25 var(--sans); color: var(--ink); }
.b2b .term span { font-size: 15px; color: var(--graphite); }
.b2b .term.discount strong { color: var(--gold-deep); }
.b2b .term-k { font-size: 12px !important; letter-spacing: .22em; text-transform: uppercase; color: var(--taupe-dark) !important; }
.b2b .term strong span { font: inherit; color: inherit; }
.b2b .flash { animation: b2b-flash .6s; }
@keyframes b2b-flash { from { background: var(--cream); } to { background: #fff; } }
.b2b .wholesale { margin-top: 22px; display: flex; flex-wrap: wrap; gap: 14px 24px; align-items: center; justify-content: space-between; padding: 22px 26px; background: #fff; border: 1px dashed var(--taupe); }
.b2b .wholesale p { max-width: 44em; }

/* ---------- náhľad loga ---------- */
.b2b .preview { display: grid; grid-template-columns: 1fr; gap: clamp(28px, 5vw, 64px); align-items: center; }
@media (min-width: 880px) { .b2b .preview { grid-template-columns: 6fr 5fr; } }
.b2b .stage { position: relative; container-type: inline-size; max-width: 560px; margin-inline: auto; width: 100%; }
.b2b .stage img.base { width: 100%; aspect-ratio: 600/620; object-fit: cover; }
/* pozície sedia na zlatý rámček v img/pre-firmy/sablona-etiketa.jpg */
.b2b .lbl-logo, .b2b .lbl-text { position: absolute; display: flex; align-items: center; justify-content: center; text-align: center; overflow: hidden; }
.b2b .lbl-logo { left: 32.5%; width: 34.5%; top: 43.5%; height: 12.5%; }
.b2b .lbl-logo img { max-width: 100%; max-height: 100%; object-fit: contain; mix-blend-mode: multiply; transform: scale(var(--s, 1)); }
.b2b .lbl-logo .ph { font-family: var(--display); letter-spacing: .12em; font-size: 4.1cqw; color: #2e2a28; opacity: .9; white-space: nowrap; transform: scale(var(--s, 1)); }
.b2b .lbl-text { left: 30.5%; width: 38.5%; top: 59.2%; height: 8.6%; font-family: var(--script); font-size: 4.6cqw; color: #3a3431; line-height: 1; white-space: nowrap; }
.b2b .note-under { margin-top: 12px; font-size: 14px; color: var(--graphite); text-align: center; }
.b2b .tools { display: grid; gap: 18px; }
.b2b .tools h3 { font: 300 30px/1.2 var(--sans); color: var(--ink); }
.b2b .drop { position: relative; display: grid; gap: 6px; justify-items: center; text-align: center; padding: 26px 18px; border: 1px dashed var(--taupe); background: #fff; cursor: pointer; transition: background .2s; }
.b2b .drop:hover, .b2b .drop.over { background: var(--cream); }
.b2b .drop strong { font-weight: 500; color: var(--ink); }
.b2b .drop span { font-size: 14px; color: var(--graphite); }
.b2b .drop input { position: absolute; opacity: 0; width: 1px; height: 1px; }
/* odporúčania k logu + výsledok kontroly nahratého súboru */
.b2b .tips { display: grid; gap: 6px; list-style: none; margin: 0; padding: 16px 18px; background: var(--cream); font-size: 15px; color: var(--graphite); }
.b2b .tips strong { color: var(--ink); font-weight: 500; }
.b2b .tips li { display: flex; gap: 10px; align-items: baseline; }
.b2b .tips li::before { content: ""; flex: none; width: 5px; height: 5px; background: var(--gold); transform: rotate(45deg) translateY(-2px); }
.b2b .tips li.tips-head::before { display: none; }
.b2b .logo-check { font-size: 15px; padding-left: 12px; border-left: 3px solid var(--taupe); }
.b2b .logo-check.ok { border-color: #6b8f5e; }
.b2b .logo-check.warn { border-color: var(--gold); color: var(--gold-deep); }
.b2b .logo-check.bad { border-color: var(--error); color: var(--error); }

/* ---------- mriežky so 4 položkami (podmienky, postup, piliere) ----------
   auto-fit by na tablete dal 3 + 1; pevné 1 → 2 × 2 → 4 stĺpce ostanú vždy vyvážené */
.b2b .terms, .b2b .steps, .b2b .why { grid-template-columns: 1fr; }
@media (min-width: 600px) { .b2b .terms, .b2b .steps, .b2b .why { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 960px) { .b2b .terms, .b2b .steps, .b2b .why { grid-template-columns: repeat(4, 1fr); } }

/* ---------- formulárové prvky ---------- */
/* min-width:0 – položka gridu sa inak nezúži pod šírku svojho obsahu (dátum na iOS) */
.b2b .row2 { display: grid; gap: 6px; min-width: 0; }
.b2b label, .b2b .lab { font: 500 14px/1.3 var(--sans); letter-spacing: .04em; color: var(--ink); }
.b2b input[type=text], .b2b input[type=email], .b2b input[type=tel], .b2b input[type=number], .b2b input[type=date], .b2b select, .b2b textarea { width: 100%; font: 400 16px/1.4 var(--sans); color: var(--charcoal); padding: .8em .9em; border: 1px solid var(--linen); border-radius: 0; background: #fff; }
/* iOS Safari: natívne dátumové pole má vlastnú minimálnu šírku, ignoruje width:100%
   a na mobile vytŕča z bunky doprava. appearance:none ho zmení na bežné pole
   (výber dátumu po ťuknutí ostáva); len pre iOS, inde by zmizla ikonka kalendára. */
.b2b input[type=date] { min-width: 0; display: block; }
@supports (-webkit-touch-callout: none) {
	.b2b input[type=date] { -webkit-appearance: none; appearance: none; min-height: 3.05em; text-align: left; }
	.b2b input[type=date]::-webkit-date-and-time-value { text-align: left; }
}
.b2b input:focus, .b2b select:focus, .b2b textarea:focus { border-color: var(--taupe); outline: 2px solid var(--gold-soft); outline-offset: 0; }
.b2b input[type=range] { width: 100%; accent-color: var(--gold); }
.b2b .hint { font-size: 14px; color: var(--graphite); }

/* ---------- postup ---------- */
.b2b .steps { display: grid; gap: clamp(24px, 3vw, 40px); list-style: none; margin: 0; padding: 0; counter-reset: s; }
.b2b .steps li { display: grid; gap: 10px; counter-increment: s; position: relative; padding-top: 18px; border-top: 1px solid var(--taupe); }
.b2b .steps li::before { content: counter(s); font-family: var(--script); font-size: 64px; line-height: .8; color: var(--taupe); }
.b2b .steps h3 { font: 500 19px/1.3 var(--sans); color: var(--ink); }
.b2b .steps p { font-size: 16px; color: var(--graphite); }

/* ---------- realizácie ---------- */
.b2b .gallery { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(8px, 1.4vw, 16px); }
.b2b .gallery img { width: 100%; aspect-ratio: 1/1; object-fit: cover; }

/* ---------- prečo ---------- */
.b2b .why { display: grid; gap: clamp(24px, 3vw, 36px); text-align: center; }
/* align-content:start – inak grid roztiahne riadky kratších stĺpcov a nadpisy nesedia v jednej línii */
.b2b .why > div { display: grid; gap: 10px; justify-items: center; align-content: start; }
.b2b .why img { width: 128px; height: 128px; border-radius: 50%; object-fit: cover; }
.b2b .why h3 { font: 300 18px/1.3 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--ink); }
.b2b .why p { font-size: 16px; color: var(--graphite); max-width: 22em; }

/* ---------- dopytový formulár ---------- */
.b2b .form-grid { display: grid; grid-template-columns: 1fr; gap: clamp(28px, 4vw, 56px); align-items: start; }
@media (min-width: 960px) { .b2b .form-grid { grid-template-columns: 4fr 8fr; } }
.b2b .aside { display: grid; gap: 18px; align-content: start; }
@media (min-width: 960px) { .b2b .aside { position: sticky; top: 90px; } }
.b2b .aside img { width: 100%; max-width: 340px; aspect-ratio: 4/5; object-fit: cover; -webkit-mask-image: linear-gradient(#000 70%, transparent); mask-image: linear-gradient(#000 70%, transparent); }
.b2b .aside blockquote { margin: 0; font-size: 18px; color: var(--charcoal); }
/* podpis vždy na jeden riadok: veľkosť podľa šírky stĺpca (cqi = % šírky .sig), max 40px */
.b2b .sig { display: grid; gap: 8px; margin: 28px 0 14px; container-type: inline-size; }
.b2b .sig-hi { font-size: 18px; color: var(--charcoal); }
.b2b .sig .script { justify-self: start; padding: 4px 0; white-space: nowrap; font-size: 30px; font-size: min(40px, 8.8cqi); }
/* podpis sa „dopíše“ zľava doprava (ako na /o-nas); .write pridáva business.js */
.b2b .sig.write .script { clip-path: inset(-25% 102% -25% -4%); transition: clip-path 1.7s cubic-bezier(.45, .1, .35, 1) .35s; }
.b2b .sig.write.is-in .script { clip-path: inset(-25% -4% -25% -4%); }
.b2b .sig small { font-size: 14px; color: var(--graphite); }
.b2b .contact { display: grid; gap: 4px; font-size: 16px; padding-top: 14px; border-top: 1px solid var(--linen); }
.b2b form.inq { background: #fff; padding: clamp(22px, 4vw, 44px); display: grid; gap: 22px; border: 1px solid var(--sand); }
.b2b .form-body { display: grid; gap: 26px; }
.b2b .fs { display: grid; gap: 16px; border: 0; margin: 0; padding: 0; min-width: 0; }
.b2b .fs legend { padding: 0; margin-bottom: 12px; font: 400 13px/1 var(--sans); letter-spacing: .24em; text-transform: uppercase; color: var(--taupe-dark); }
.b2b .cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap: 16px; }
.b2b .chips { position: relative; display: flex; flex-wrap: wrap; gap: 8px; }
.b2b .chips input { position: absolute; opacity: 0; pointer-events: none; }
.b2b .chips label { font-weight: 400; font-size: 15px; padding: .55em 1.1em; border: 1px solid var(--linen); cursor: pointer; background: #fff; transition: all .15s; }
.b2b .chips input:checked + label { background: var(--taupe); border-color: var(--taupe); color: #fff; }
.b2b .chips input:focus-visible + label { outline: 2px solid var(--gold-deep); outline-offset: 2px; }
.b2b .estimate { display: grid; gap: 6px; padding: 18px 20px; background: var(--cream); }
.b2b .estimate .big { font: 500 26px/1.1 var(--sans); color: var(--ink); font-variant-numeric: tabular-nums; }
.b2b .estimate .big b { color: var(--gold-deep); font-weight: 600; }
.b2b .estimate .nudge { font-size: 15px; color: var(--gold-deep); }
.b2b .estimate .err { font-size: 15px; color: var(--error); }
.b2b .logo-att { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; font-size: 15px; }
.b2b .logo-att img { width: 64px; height: 64px; object-fit: contain; background: var(--cream); padding: 6px; }
.b2b .check { display: flex; gap: 10px; align-items: flex-start; font-weight: 400; font-size: 15px; }
.b2b .check input { margin-top: .3em; accent-color: var(--gold); }
.b2b .check a { text-decoration: underline; text-underline-offset: 2px; }
.b2b .hp { position: absolute; left: -9999px; }
.b2b .submit-row { display: flex; flex-wrap: wrap; gap: 14px; align-items: center; justify-content: space-between; }
.b2b .form-err { color: var(--error); }
.b2b .thanks { text-align: center; display: grid; gap: 12px; justify-items: center; padding: 30px 10px; }
.b2b .thanks .script { font-size: 64px; }

/* ---------- dialóg „Prevziať z vizualizácie?“ ---------- */
/* margin:auto centruje modálny dialóg – style.css ho globálnym * { margin:0 } zrušil */
.b2b dialog.leftover { margin: auto; border: 0; padding: clamp(22px, 4vw, 34px); width: calc(100% - 32px); max-width: 560px; background: #fff; color: var(--charcoal); box-shadow: 0 20px 60px rgba(44, 41, 43, .25); }
/* ::backdrop nededí CSS premenné, preto farba natvrdo */
.b2b dialog.leftover::backdrop { background: rgba(44, 41, 43, .45); }
.b2b .leftover h3 { font-family: var(--script); font-weight: 500; color: var(--taupe); font-size: 40px; line-height: 1; margin-bottom: 12px; }
.b2b .leftover p { color: var(--graphite); }
.b2b .leftover strong { color: var(--ink); font-weight: 500; }
.b2b .leftover-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; }
/* na desktope vedľa seba; keď sa nezmestia (mobil), každé tlačidlo na celú šírku */
.b2b .leftover-actions .btn { flex: 1 1 auto; }

/* ---------- FAQ ---------- */
.b2b .faq { max-width: 820px; margin-inline: auto; border-top: 1px solid var(--linen); }
.b2b .faq details { border-bottom: 1px solid var(--linen); }
.b2b .faq summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; gap: 16px; padding: 20px 4px; font: 400 19px/1.35 var(--sans); color: var(--ink); }
.b2b .faq summary::-webkit-details-marker { display: none; }
.b2b .faq summary::after { content: "+"; font-size: 26px; line-height: 1; color: var(--taupe); transition: transform .2s; }
.b2b .faq details[open] summary::after { transform: rotate(45deg); }
.b2b .faq details p { padding: 0 4px 22px; color: var(--graphite); max-width: 62ch; }

/* ---------- mobilná lišta s CTA ---------- */
.b2b .mcta { position: fixed; left: 0; right: 0; bottom: 0; z-index: 30; padding: 10px 16px calc(10px + env(safe-area-inset-bottom, 0px)); background: rgba(255, 255, 255, .96); border-top: 1px solid var(--linen); display: flex; gap: 12px; align-items: center; justify-content: space-between; font-size: 14px; }
.b2b .mcta .btn { padding: .85em 1.4em; }
@media (min-width: 760px) { .b2b .mcta { display: none; } }
/* aby lišta neprekryla spodok pätky (pätka je mimo <main>, preto :has) */
@media (max-width: 759px) { body:has(.b2b) .footer { padding-bottom: 80px; } }
