/**
* MK-Clean Genus: Master Blocks Styling
* Verze: 2.1 - Fix pro kompletní zobrazení mobilního menu a 3 čáry hamburgeru.
*/
/* Globální typografie */
body,
p,
button,
input,
select,
textarea {
font-family: var(--mk-font-body, system-ui);
font-size: var(--mk-text-size, 18px);
line-height: var(--mk-line-height, 1.65);
color: var(--color-secondary, #212529);
}
h1, h2, h3, h4, h5, h6 {
font-family: var(--mk-font-heading, system-ui);
line-height: 1.2;
color: var(--color-secondary, #212529);
}
h1 { font-size: var(--mk-h1-size, 46px); }
h2 { font-size: var(--mk-h2-size, 32px); }
h3 { font-size: var(--mk-h3-size, 24px); }
.mk-small-text,
small { font-size: var(--mk-small-text-size, 15px); }
/* Textové bloky – omezení šířky dle zadání */
.mk-prose {
max-width: var(--mk-prose-max, 760px);
}
/* Stejná vertikální mezera mezi odstavci i u seznamu v úvodních sekcích */
.mk-home-intro .mk-prose > p + p,
.mk-home-intro .mk-prose > p + ul,
.mk-home-intro .mk-prose > ul + p {
margin-top: 1em;
}
/* Sekce – vertikální spacing dle zadání */
.mk-page-section {
padding-top: var(--mk-section-pad-y, 90px);
padding-bottom: var(--mk-section-pad-y, 90px);
}
@media (max-width: 782px) {
.mk-page-section {
padding-top: var(--mk-section-pad-y-mobile, 56px);
padding-bottom: var(--mk-section-pad-y-mobile, 56px);
}
}
/* CTA tlačítka – jednotné rozměry + mezera nad CTA */
.mk-cta {
margin-top: var(--mk-cta-gap-top, 28px);
}
.mk-cta .wp-block-button__link,
.mk-cta.wp-block-button__link,
.mk-cta-link {
padding: var(--mk-cta-pad-y, 14px) var(--mk-cta-pad-x, 26px) !important;
border-radius: var(--mk-cta-radius, 10px) !important;
font-weight: 600 !important;
}
/* CTA blok Gutenberg – tlačítka na střed řádku (úvodní stránka, O nás, …) */
.wp-block-buttons.mk-cta {
display: flex;
flex-wrap: wrap;
justify-content: center;
}
/* Výchozí mezera mezi obsahem a CTA */
.mk-page-section .wp-block-buttons {
margin-top: var(--mk-cta-gap-top, 28px);
}
/* Alternující pozadí sekcí */
.mk-page-section.mk-section-alt {
background: #f7f7f7;
}
/* ==========================================================================
Homepage – nové intro sekce
========================================================================== */
.mk-home-intro {
max-width: 1200px;
margin-left: auto;
margin-right: auto;
padding-left: 1.5rem;
padding-right: 1.5rem;
box-sizing: border-box;
}
.mk-home-intro h2 {
margin-top: 0;
}
.mk-home-why h2,
.mk-home-when h2 {
color: var(--color-primary);
}
.mk-home-bullets {
margin: 0 0 0 1.1rem;
padding: 0;
/* Stejný font jako u (blog.css);
jinak dědí Inter z body → jiný vzhled než odstavce */
font-family: var(--wp--preset--font-family--system, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif);
}
.mk-home-bullets li + li {
margin-top: 0.35em;
}
.mk-home-value-cards {
margin-top: 1.25rem;
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 1rem;
}
.mk-home-value-card {
background: #fff;
border: 1px solid rgba(0, 0, 0, 0.08);
border-radius: 10px;
padding: 1rem 1.1rem;
box-shadow: 0 2px 12px rgba(0,0,0,0.04);
font-size: var(--mk-text-size, 18px);
line-height: var(--mk-line-height, 1.65);
display: flex;
align-items: center;
gap: 0.85rem;
}
.mk-home-value-card__icon {
flex: 0 0 auto;
width: 48px;
height: 48px;
object-fit: contain;
display: block;
}
.mk-home-value-card__label {
flex: 1 1 auto;
font-weight: 600;
color: var(--color-secondary);
}
.mk-home-when.mk-section-alt .mk-home-value-card {
background: #fff;
}
@media (max-width: 900px) {
.mk-home-value-cards {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}
@media (max-width: 782px) {
.mk-home-intro {
padding-left: 1rem;
padding-right: 1rem;
}
.mk-home-value-cards {
grid-template-columns: 1fr;
gap: 0.75rem;
}
.mk-home-value-card {
padding: 0.85rem 1rem;
gap: 0.75rem;
}
.mk-home-value-card__icon {
width: 40px;
height: 40px;
}
}
/* ==========================================================================
1. ZÁKLADNÍ STRUKTURA (Sticky Footer)
========================================================================== */
html, body { height: 100%; margin: 0; overflow-x: hidden; }
.wp-site-blocks { display: flex; flex-direction: column; min-height: 100vh; }
.mk-site-root { display: flex !important; flex-direction: column !important; flex: 1 !important; width: 100%; }
.mk-site-root > main { flex: 1 0 auto !important; min-height: 0; }
/* Kotvy: po kliku scroll s rezervou pod sticky hlavičkou */
html { scroll-padding-top: 80px; }
.mk-site-root > main.mk-main-content { padding-top: 0; padding-bottom: 2rem; }
footer.wp-block-template-part, .mk-site-footer {
flex-shrink: 0;
margin-top: auto !important;
position: relative;
z-index: 10;
}
/* Šablona page.html – obsah a pozadí na celou šířku */
.mk-site-root.alignfull { width: 100% !important; max-width: none !important; }
.mk-main-content.alignfull { width: 100% !important; max-width: none !important; box-sizing: border-box; }
.mk-main-content.alignfull .wp-block-post-content { max-width: none !important; }
/* Zrušení constrained layoutu – bloky (mk-intro-section, mk-card-section atd.) na celou šířku */
.mk-main-content.alignfull .is-layout-constrained,
.mk-main-content.alignfull .wp-block-group-is-layout-constrained { max-width: none !important; width: 100% !important; }
/* ==========================================================================
2. HLAVIČKA (Základní rozvržení)
========================================================================== */
.site-header-container {
display: grid !important;
grid-template-columns: auto minmax(0, 1fr) auto;
gap: 12px;
align-items: center;
padding: 0.5rem clamp(1.5rem, 5vw, var(--mk-page-edge, 5%)) !important;
background: #ffffff;
position: sticky;
top: 0;
z-index: 9999;
box-shadow: 0 2px 15px rgba(0,0,0,0.05);
min-height: 80px;
}
/* Logo - zachování rozměrů */
.site-header-container img,
.site-header-container .wp-block-site-logo img {
width: 123px !important;
height: auto !important;
object-fit: contain !important;
}
/* Kontakt vpravo */
.header-contact-box .contact-link { display: flex; align-items: center; text-decoration: none; }
.header-contact-box .contact-icon { width: 48px !important; height: 48px !important; margin-right: 12px; flex-shrink: 0; }
/* Ikona telefonu jako maska – stejná barva jako hamburger menu (primary) */
.header-contact-box .contact-icon-mask {
display: inline-block;
width: 48px !important;
height: 48px !important;
background-color: var(--wp--preset--color--primary, var(--color-primary));
-webkit-mask: var(--phone-icon-url) no-repeat center / contain;
mask: var(--phone-icon-url) no-repeat center / contain;
}
.header-contact-box .contact-text { display: flex !important; flex-direction: column !important; line-height: 1.2; }
.header-contact-box .contact-label { font-size: 0.75rem; font-weight: 700; color: var(--wp--preset--color--primary); }
.header-contact-box .contact-number { font-size: 1.15rem; font-weight: 700; color: #333; }
/* ==========================================================================
3. DESKTOP NAVIGACE (900px+)
========================================================================== */
@media (min-width: 900px) {
/* Skrytí hamburgeru na desktopu */
.wp-block-navigation__responsive-container-open { display: none !important; }
.wp-block-navigation__responsive-container {
display: flex !important;
position: static !important;
visibility: visible !important;
opacity: 1 !important;
background: transparent !important;
}
.wp-block-navigation__container {
display: flex !important;
flex-direction: row !important;
gap: 1.1rem !important;
list-style: none !important;
flex-wrap: nowrap !important;
}
.wp-block-navigation-item a {
font-size: clamp(0.9rem, 0.6rem + 0.5vw, 1.1rem) !important;
font-weight: 600 !important;
color: var(--wp--preset--color--secondary) !important;
text-decoration: none !important;
padding: 4px 8px !important;
white-space: nowrap !important;
}
/* Desktop – kontakt vpravo mírně kompaktnější, aby se vše vešlo i kolem hranice breakpointu */
.header-contact-box .contact-icon {
width: 42px !important;
height: 42px !important;
margin-right: 10px;
}
.header-contact-box .contact-label {
font-size: 0.7rem !important;
}
.header-contact-box .contact-number {
font-size: 1rem !important;
}
.wp-block-navigation-item a:hover { color: var(--color-primary) !important; }
}
/* ==========================================================================
4. MOBILNÍ NAVIGACE (Pod 900px)
========================================================================== */
@media (max-width: 1020px) {
/* Pořadí: logo → (mezera) → ikona telefonu → ikona menu (vpravo) */
.site-header-container {
display: flex !important;
align-items: center;
grid-template-columns: none;
}
.site-header-container .header-column-left {
order: 1;
flex: 0 0 auto;
}
.site-header-container .header-column-right {
order: 2;
margin-left: auto;
flex: 0 0 auto;
}
.site-header-container .wp-block-navigation {
order: 3;
flex: 0 0 auto;
}
/* Skrytí desktopového menu */
.wp-block-navigation__responsive-container:not(.is-menu-open) { display: none !important; }
/* HAMBURGER IKONA - OPRAVA NA 3 ČÁRY */
.wp-block-navigation__responsive-container-open {
display: flex !important;
width: 38px !important;
height: 24px !important;
background: transparent !important;
border: none !important;
cursor: pointer !important;
position: relative !important;
margin-left: 8px !important;
margin-right: 0 !important;
z-index: 100001 !important;
}
/* Vynucené skrytí původního SVG (dvou čar) */
.wp-block-navigation__responsive-container-open svg { display: none !important; visibility: hidden !important; }
/* Vykreslení 3 čar pomocí CSS */
.wp-block-navigation__responsive-container-open::before {
content: "";
display: block;
width: 100%;
height: 3px;
/* Stejná barva jako ikona telefonu (primary) */
background: var(--wp--preset--color--primary, var(--color-primary));
box-shadow: 0 10px 0 var(--wp--preset--color--primary, var(--color-primary)), 0 -10px 0 var(--wp--preset--color--primary, var(--color-primary));
position: absolute;
top: 50%;
transform: translateY(-50%);
}
/* Mobilní kontakt (jen ikona) */
.header-contact-box .contact-text { display: none !important; }
/* FIX PRO OTEVŘENÉ MENU (Zobrazení všech položek) */
.wp-block-navigation__responsive-container.is-menu-open {
position: absolute !important;
top: 100% !important;
left: 0 !important; right: 0 !important;
background-color: #ffffff !important;
padding: 1.5rem 0 !important;
z-index: 100000 !important;
box-shadow: 0 10px 20px rgba(0,0,0,0.1);
display: block !important;
height: auto !important;
min-height: min-content !important;
overflow: visible !important;
}
/* Vynucení viditelnosti všech vnořených úrovní seznamu */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-dialog,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
display: block !important;
height: auto !important;
min-height: min-content !important;
opacity: 1 !important;
visibility: visible !important;
overflow: visible !important;
margin: 0 !important;
padding: 0 !important;
}
.wp-block-navigation-item a {
font-size: 1.4rem !important;
padding: 15px !important;
display: block !important;
text-align: center;
border-bottom: 1px solid #f0f0f0;
text-decoration: none !important;
color: var(--wp--preset--color--secondary) !important;
}
.wp-block-navigation-item:last-child a { border-bottom: none; }
.wp-block-navigation__responsive-container-close { display: none !important; }
}
/* ==========================================================================
7. DESIGN PATIČKY (Dle obrázku – 3 sloupce, responzivní)
========================================================================== */
.mk-site-footer {
background-color: #1a3e6c !important;
color: #ffffff !important;
font-family: sans-serif;
padding: 2.5rem 1rem 2rem !important;
}
.mk-footer-inner {
max-width: 1200px;
margin: 0 auto;
padding: 0 1rem;
}
/* Sloupce – na malých displayích pod sebou */
.mk-footer-columns {
display: grid !important;
grid-template-columns: 1fr 1fr 1fr;
gap: 2.5rem;
margin-bottom: 1.5rem !important;
}
@media (max-width: 781px) {
.mk-footer-columns {
grid-template-columns: 1fr !important;
gap: 2rem;
}
.mk-footer-col {
flex-basis: 100% !important;
}
}
.mk-site-footer .mk-footer-heading,
.mk-site-footer .wp-block-heading.mk-footer-heading {
color: #ffffff !important;
font-size: 1.125rem !important;
font-weight: 700 !important;
margin: 0 0 1rem !important;
}
.mk-site-footer .mk-footer-address,
.mk-site-footer p {
color: rgba(255, 255, 255, 0.85) !important;
line-height: 1.6;
margin: 0 0 0.25em !important;
font-size: 0.9375rem;
}
/* ==========================================================================
8. STYLING PRO KONTAKTNÍ FORMULÁŘ (bez JS CF7)
========================================================================== */
.wpcf7 .screen-reader-response {
position: absolute;
overflow: hidden;
clip: rect(1px, 1px, 1px, 1px);
clip-path: inset(50%);
height: 1px;
width: 1px;
margin: -1px;
padding: 0;
border: 0;
word-wrap: normal !important;
}
.wpcf7 .hidden-fields-container {
display: none;
}
.mk-card-form .wpcf7-response-output {
margin: 2em 0.5em 1em;
padding: 0.2em 1em;
border: 2px solid transparent; /* výchozí: skryté */
display: none;
}
.mk-card-form .wpcf7-response-output:empty {
display: none;
border-color: transparent;
padding: 0;
margin: 0;
}
.mk-card-form .wpcf7-response-output.wpcf7-validation-errors {
display: block;
border-color: #dc3232; /* červená při chybách */
}
.mk-card-form .wpcf7-response-output.wpcf7-mail-sent-ok {
display: block;
border-color: #b3e5ff; /* světlounce modrá po úspěšném odeslání */
}
.wpcf7 .wpcf7-not-valid-tip {
color: #dc3232;
font-size: 1em;
font-weight: normal;
display: block;
}
/* Kontakt v patičce */
.mk-site-footer .footer-contact-item {
margin-bottom: 1.25rem;
}
.mk-site-footer .footer-contact-item:last-child {
margin-bottom: 0;
}
.contact-sub-label {
font-size: 0.6875rem !important;
font-weight: 700;
letter-spacing: 0.05em;
margin: 0 0 0.25rem !important;
color: rgba(255, 255, 255, 0.6) !important;
text-transform: uppercase;
}
.contact-main-link {
margin: 0 !important;
}
.contact-main-link a {
font-size: 1.25rem !important;
font-weight: 700 !important;
color: #ffffff !important;
text-decoration: none !important;
}
.contact-main-link a:hover {
text-decoration: underline !important;
}
/* Sociální ikony */
.mk-footer-social {
list-style: none !important;
margin: 0 !important;
padding: 0 !important;
display: flex !important;
flex-wrap: wrap;
gap: 0.75rem;
}
.mk-footer-social .wp-block-social-link {
margin: 0 !important;
}
.mk-footer-social .wp-block-social-link a {
display: flex;
align-items: center;
justify-content: center;
color: #ffffff !important;
padding: 0.25rem;
}
.mk-footer-social .wp-block-social-link a:hover {
opacity: 0.85;
}
.mk-footer-social .wp-block-social-link svg {
fill: currentColor !important;
width: 24px;
height: 24px;
}
.mk-site-footer .mk-footer-follow-notes {
margin-top: 1.1rem;
max-width: 36ch;
}
.mk-site-footer .mk-footer-follow-note {
margin: 0 0 0.65rem;
font-size: 0.8125rem;
line-height: 1.55;
color: rgba(255, 255, 255, 0.72) !important;
}
.mk-site-footer .mk-footer-follow-note:last-child {
margin-bottom: 0;
}
/* Tenká oddělovací čára nad spodkem patičky */
.mk-footer-sep {
height: 1px;
background: rgba(255, 255, 255, 0.2);
width: 100%;
margin-top: 0.5rem;
}
/* ==========================================================================
8. HOMEPAGE – nad kotvou #o-nas (přesná replika mk-clean.cz)
========================================================================== */
/* ---------- 8a. Jedno pozadí: nad obsahem i vlnou, končí u spodního okraje vlny (nepřelézá pod vlnu) ---------- */
.mk-main-content {
background-color: #fff;
}
/* Hero řádek začíná na úrovni loga (stejný okraj jako hlavička) */
.mk-hero-and-wave {
position: relative;
width: 100%;
padding: 2rem var(--mk-page-edge, 5%) 0;
box-sizing: border-box;
}
/* Jedna vrstva pozadí přes celou plochu (obsah + vlna), celá šířka viewportu */
.mk-hero-and-wave .mk-hero-bg {
position: absolute;
top: 0;
left: 50%;
transform: translateX(-50%);
width: 100vw;
max-width: none;
height: 100%;
min-height: 100%;
background-position: top center;
background-repeat: no-repeat;
background-size: cover;
z-index: 0;
pointer-events: none;
box-sizing: border-box;
}
/* Horní řádek: dvě poloviny – vlevo text, vpravo pozadí */
.mk-hero-row {
display: grid;
grid-template-columns: 1fr 1fr;
position: relative;
z-index: 2;
min-height: 380px;
}
.mk-hero-left {
position: relative;
display: flex;
align-items: center;
}
.mk-hero-overlay {
position: absolute;
inset: 0;
background: rgba(0, 0, 0, 0.45);
z-index: 0;
pointer-events: none;
}
/* Vnitřní okraj textu – stejný vlevo i vpravo, o něco větší */
.mk-hero-left .mk-intro-content {
position: relative;
z-index: 1;
max-width: 100%;
margin-left: 0;
margin-right: auto;
padding: 2rem 2rem 2rem 2rem;
}
.mk-hero-right {
min-height: 380px;
}
.mk-hero-and-wave .mk-intro-shape {
position: relative;
z-index: 1;
isolation: isolate;
}
/* Kompenzace záporného margin-top a vlny na homepage – patička vždy pod obsahem */
.home .mk-main-content { padding-bottom: 560px; }
/* Homepage: pozadí nad vlnou viditelné – žádné bílé překrytí úvodní sekce */
.home .mk-main-content .mk-intro-section,
.home .mk-main-content .mk-intro-section .wp-block-group { background: transparent !important; }
/* ---------- 8b. Úvodní sekce (obrázek + text + vlna + karta) ---------- */
.mk-intro-section {
position: relative;
background: transparent;
overflow: visible; /* vlna může výběhem (negative margin) do celé šířky */
}
.mk-intro-anchor {
position: absolute;
top: 0; left: 0;
width: 1px; height: 1px;
pointer-events: none;
}
/* Blok s textem – v hero vlevo (viz .mk-hero-left .mk-intro-content), zde fallback */
.mk-intro-content {
position: relative;
max-width: 750px;
margin-left: auto;
margin-right: auto;
}
/* Nadpis – originál: 2.75em / 500 / 1.4em line-height / -1.925px spacing */
.mk-intro-title {
margin-top: 0;
margin-bottom: 0.5rem;
color: #fff;
font-size: var(--mk-h1-size, 46px);
font-weight: 600;
line-height: 1.2;
letter-spacing: -0.02em;
text-shadow: 0 2px 8px rgba(0, 0, 0, 0.45);
}
.mk-intro-title strong {
font-weight: 700;
color: #fff;
}
/* Podtitulek – originál: 1.4em / 300 / 26px line-height / #FFFFFF99 */
.mk-intro-subtitle {
margin-bottom: 1.5rem;
color: #FFFFFF99;
font-size: var(--mk-text-size, 18px);
font-weight: 400;
line-height: var(--mk-line-height, 1.65);
text-shadow: 0 1px 4px rgba(0, 0, 0, 0.35);
}
/* Tlačítko O NÁS – originál: padding 1rem 3rem */
.mk-btn-secondary .wp-block-button__link {
background-color: var(--color-tertiary, #00a1cd) !important;
color: #fff !important;
border-radius: var(--mk-cta-radius, 10px);
font-weight: 600;
font-size: 0.95rem;
letter-spacing: 0.04em;
padding: var(--mk-cta-pad-y, 14px) var(--mk-cta-pad-x, 26px);
text-decoration: none;
border: none;
transition: filter 0.2s;
}
.mk-btn-secondary .wp-block-button__link:hover {
filter: brightness(1.1);
}
/* ---------- 8c. Vlna (shape divider) – celá šířka viewportu ---------- */
.mk-hero-and-wave .mk-intro-shape {
width: 100vw !important;
max-width: none;
margin-left: calc(-50vw + 50%);
margin-right: calc(-50vw + 50%);
line-height: 0;
margin-top: -30px;
pointer-events: none;
box-sizing: border-box;
}
.mk-intro-shape svg {
display: block;
width: 100%;
height: 576px;
}
/* ==========================================================================
8d. Karta (formulář + kontakt) – přesah nad vlnu a pozadí
========================================================================== */
.mk-card-section {
position: relative;
z-index: 10; /* nad vlnou (z-index 1), aby formulář i kontakt byly vidět */
margin-top: -420px; /* výrazný přesah nahoru – překrývá vlnu i hero */
padding-bottom: 2rem;
background-color: transparent;
}
/* Dvousloupcový layout: formulář vlevo 50 %, kontakt vpravo 50 % */
.mk-card-section .wp-block-columns {
display: flex !important;
flex-direction: row !important;
flex-wrap: nowrap !important;
align-items: flex-end;
padding-left: var(--mk-page-edge, 5%);
padding-right: var(--mk-page-edge, 5%);
gap: 0;
}
.mk-card-section .wp-block-column {
flex: 0 0 50% !important;
max-width: 50% !important;
min-width: 0;
box-sizing: border-box;
}
/* Levý sloupec – kontaktní formulář (karta užší, dle obrázku) */
.mk-card-col-left {
padding-right: 2rem;
}
/* Karta formuláře – širší, bílá, zaoblené rohy, stín */
.mk-card-form {
max-width: 560px;
background: #fff;
padding: 2.25rem 2.25rem 2rem;
border-radius: 10px;
box-shadow: 0 8px 28px rgba(0, 0, 0, 0.1), 0 2px 6px rgba(0, 0, 0, 0.06);
}
.mk-card-form-title {
margin-top: 0;
margin-bottom: 0.3em !important;
font-size: 2rem !important;
font-weight: 700 !important;
line-height: 1.25;
letter-spacing: -0.02em;
color: var(--color-dark-blue, #183F72) !important;
}
.mk-card-form-desc {
font-size: 1.1rem;
color: #666;
margin-bottom: 1.5rem;
line-height: 1.5;
}
/* CF7: mezery mezi položkami – každý obal pole i každý odstavec */
.mk-card-form .wpcf7 p {
margin: 0 0 1.5rem 0;
}
.mk-card-form .wpcf7 p:last-of-type {
margin-bottom: 0;
}
.mk-card-form .wpcf7 .wpcf7-form-control-wrap {
display: block !important;
margin-bottom: 1.5rem;
}
/* Pole formuláře – větší písmo, světle šedé, mezera pod polem */
.mk-card-form .wpcf7 input[type="text"],
.mk-card-form .wpcf7 input[type="email"],
.mk-card-form .wpcf7 input[type="tel"],
.mk-card-form .wpcf7 select,
.mk-card-form .wpcf7 textarea {
width: 100%;
padding: 0.85rem 1.1rem;
border: 1px solid #e2e2e2;
border-radius: 6px;
font-size: 1.1rem;
margin-bottom: 0;
background: #f5f5f5;
box-sizing: border-box;
}
.mk-card-form .wpcf7 select {
appearance: auto;
cursor: pointer;
min-height: 3rem;
}
/* Tlačítko ZAVOLEJTE MI – odsazení shora, větší písmo */
.mk-card-form .wpcf7 input[type="submit"] {
width: 100%;
margin-top: 0.5rem;
background-color: var(--color-tertiary, #00a1cd);
color: #fff;
font-weight: 700;
font-size: 1.1rem;
letter-spacing: 0.06em;
text-transform: uppercase;
padding: 0.85rem 1.5rem;
border: none;
border-radius: 6px;
cursor: pointer;
box-shadow: 0 2px 8px rgba(0, 161, 205, 0.3);
transition: background 0.2s, box-shadow 0.2s;
}
.mk-card-form .wpcf7 input[type="submit"]:hover {
filter: brightness(1.08);
box-shadow: 0 3px 12px rgba(0, 161, 205, 0.4);
}
/* ---------- 8e. Pravý sloupec – NEZÁVAZNĚ POPTAT SLUŽBY (dle obrázku) ---------- */
.mk-card-col-right {
display: flex;
flex-direction: column;
justify-content: flex-end;
padding-top: 26rem;
padding-bottom: 2rem;
}
.mk-contact-wrap {
text-align: left;
max-width: 420px;
}
.mk-contact-wrap p {
margin: 0;
}
/* Nadpis – tmavě modrý, tučný, uppercase */
.mk-contact-headline {
margin: 0 0 0.4rem;
font-size: 1.5rem;
font-weight: 700;
color: var(--color-dark-blue, #183F72);
letter-spacing: 0.04em;
text-transform: uppercase;
line-height: 1.3;
}
/* Blok: label + hodnota (telefon / e-mail) – úzké mezery */
.mk-contact-row {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 0.1rem;
margin-bottom: 0.35rem;
}
.mk-contact-row:last-child {
margin-bottom: 0;
}
.mk-contact-label {
font-size: 0.8rem;
font-weight: 600;
line-height: 1.25;
color: #777;
text-transform: uppercase;
letter-spacing: 0.05em;
}
.mk-contact-value {
font-size: 1.5rem;
font-weight: 700;
line-height: 1.3;
color: var(--color-dark-blue, #183F72);
}
.mk-contact-value a {
color: inherit;
text-decoration: none;
}
.mk-contact-value a:hover {
text-decoration: underline;
}
/* E-mail – menší než telefon, odkaz podtržený, hover tyrkysový */
.mk-contact-email {
font-size: 1rem;
font-weight: 700;
line-height: 1.4;
}
.mk-contact-email a {
color: var(--color-dark-blue, #183F72);
text-decoration: underline;
}
.mk-contact-email a:hover {
color: var(--color-tertiary, #00a1cd);
}
/* ==========================================================================
8f. Responzivita homepage
========================================================================== */
@media (max-width: 782px) {
.home .mk-main-content { padding-bottom: 120px; }
.mk-intro-section {
min-height: 450px;
}
.mk-hero-and-wave {
padding: 1.5rem 0 0;
}
.mk-hero-row {
grid-template-columns: 1fr;
min-height: 320px;
}
.mk-hero-right {
display: none;
}
.mk-hero-left {
min-height: 320px;
}
.mk-hero-left .mk-intro-content,
.mk-intro-content {
padding: 2rem 1rem 1rem !important;
padding-top: 2.5rem !important;
padding-bottom: 0 !important;
}
.mk-intro-title {
font-size: var(--mk-h1-size, 30px);
}
.mk-intro-subtitle {
font-size: var(--mk-text-size, 16px);
line-height: var(--mk-line-height, 1.65);
}
.mk-intro-shape svg {
height: 200px;
}
/* Karta */
.mk-card-section {
margin-top: -80px;
}
.mk-card-section .wp-block-columns {
flex-direction: column !important;
}
.mk-card-section .wp-block-column {
flex: 1 1 100% !important;
max-width: none !important;
}
.mk-card-col-left {
padding-right: 0;
margin-bottom: 1.5rem;
}
.mk-card-form {
max-width: none;
padding: 1.5rem;
}
.mk-card-col-right {
padding-top: 2rem; /* na mobilu stačí malé odsazení (sloupce pod sebou) */
padding-bottom: 0;
}
.mk-contact-headline {
font-size: 1.4rem;
}
.mk-contact-value {
font-size: 1.5rem;
}
.mk-contact-email {
font-size: 14px;
}
.mk-contact-wrap {
text-align: left;
}
.mk-contact-row {
justify-content: flex-start;
}
}
/* ==========================================================================
9. VNITŘNÍ STRÁNKY (O nás, Služby, Reference, Ceník, Aktuality)
========================================================================== */
.mk-main-content.mk-page-content {
background-image: none;
padding-bottom: 2rem;
}
.mk-page-section {
max-width: 1200px;
margin-left: auto;
margin-right: auto;
padding: 2rem 1.5rem;
}
/* H1 na všech vnitřních stránkách (kromě homepage) – jednotný styl jako O nás, zarovnání doleva, jen první písmeno velké */
.mk-main-content.mk-page-content .mk-page-title {
margin-top: 0;
margin-bottom: 1.5rem;
font-size: var(--font-size-huge, 3rem);
font-weight: 700;
color: var(--color-primary);
text-align: left;
text-transform: none;
}
.mk-page-title {
margin-top: 0;
margin-bottom: 1rem;
font-size: 2rem;
color: var(--wp--preset--color--secondary, #212529);
}
.mk-page-section-alt {
background-color: var(--wp--preset--color--accent, #e6f0fa);
}
.mk-page-image img {
max-width: 100%;
height: auto;
border-radius: 4px;
box-shadow: 0 4px 20px rgba(0,0,0,0.08);
}
/* Stránka O nás – střídavý layout, obrázky v kolečkách */
.mk-page-o-nas .mk-page-section {
padding: 3rem 1.5rem;
}
.mk-page-o-nas .mk-page-heading {
font-size: var(--font-size-large, 2rem);
font-weight: 700;
color: var(--color-primary);
margin-top: 0;
margin-bottom: 1.5rem;
}
.mk-page-o-nas .mk-page-subheading {
font-size: var(--font-size-medium, 1.25rem);
font-weight: 700;
color: var(--color-primary);
margin-top: 1.5rem;
margin-bottom: 0.5rem;
}
.mk-page-o-nas .mk-page-subheading:first-child {
margin-top: 0;
}
.mk-page-o-nas .mk-page-columns {
display: flex;
flex-direction: row;
align-items: center;
gap: 2.5rem;
flex-wrap: wrap;
}
.mk-page-o-nas .mk-page-text-col {
flex: 1 1 60%;
min-width: 280px;
}
.mk-page-o-nas .mk-page-image-col {
flex: 0 1 35%;
min-width: 240px;
}
/* Sudé řádky: obrázek vlevo, text vpravo */
.mk-page-o-nas .mk-page-section-alt .mk-page-columns {
flex-direction: row-reverse;
}
.mk-page-o-nas .mk-page-section-alt .mk-page-heading {
text-align: right;
}
/* Kruhové obrázky */
.mk-page-o-nas .mk-page-image {
margin: 0;
max-width: 320px;
aspect-ratio: 1;
overflow: hidden;
border-radius: 50%;
}
.mk-page-o-nas .mk-page-section-alt .mk-page-image {
margin-left: 0;
margin-right: auto;
}
/* Stejné pozadí jako .mk-page-section-alt uvnitř sloupce (např. závěrečný blok O nás) */
.mk-page-o-nas .mk-page-o-nas-inline-alt {
background-color: var(--wp--preset--color--accent, #e6f0fa);
padding: 2rem 1.5rem;
margin-top: 2rem;
box-sizing: border-box;
}
.mk-page-o-nas .mk-page-o-nas-inline-alt > .mk-page-subheading:first-child {
margin-top: 0;
}
.mk-page-o-nas .mk-page-section:not(.mk-page-section-alt) .mk-page-image {
margin-right: 0;
margin-left: auto;
}
.mk-page-o-nas .mk-page-image img {
width: 100%;
height: 100%;
object-fit: cover;
border-radius: 50%;
box-shadow: 0 4px 24px rgba(0,0,0,0.12);
}
/* Tlačítka na stránce O nás */
.mk-page-o-nas .wp-block-button__link {
background: var(--color-primary) !important;
color: var(--color-white) !important;
padding: 0.75rem 1.5rem;
border-radius: 6px;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.02em;
border: none;
text-decoration: none;
display: inline-block;
}
.mk-page-o-nas .wp-block-button__link:hover {
filter: brightness(1.1);
}
.mk-page-o-nas .wp-block-buttons {
margin-top: 1.5rem;
}
/* Stránka Služby – nadpis doleva (jednotný H1), úvodní text, dvousloupcový layout s kulatými ikonami */
.mk-page-sluzby .mk-sluzby-intro {
padding-bottom: 2rem;
}
.mk-page-sluzby .mk-sluzby-intro .mk-page-title {
text-align: left;
}
.mk-page-sluzby .mk-sluzby-lead {
font-size: var(--mk-text-size, 18px);
font-family: var(--wp--preset--font-family--system, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif);
line-height: var(--mk-line-height, 1.65);
color: var(--color-secondary);
margin: 0;
max-width: 72ch;
text-align: left;
}
.mk-page-sluzby .mk-sluzby-grid .mk-sluzby-columns {
display: flex;
flex-direction: row;
gap: 3rem;
align-items: flex-start;
flex-wrap: wrap;
}
.mk-page-sluzby .mk-sluzby-col {
flex: 1 1 42%;
min-width: 280px;
}
/* Kulatá ikona – tmavě modrý kruh, bílá pictogram */
.mk-page-sluzby .mk-sluzby-icon-wrap {
width: 90px;
height: 90px;
border-radius: 50%;
background: var(--color-primary);
display: flex;
align-items: center;
justify-content: center;
margin: 0 auto 1.5rem;
}
.mk-page-sluzby .mk-sluzby-icon-img {
width: 48px;
height: 48px;
object-fit: contain;
filter: brightness(0) invert(1);
}
.mk-page-sluzby .mk-sluzby-heading {
font-size: var(--font-size-medium, 1.25rem);
font-weight: 700;
color: var(--color-secondary);
text-align: center;
margin: 0 0 1rem 0;
text-transform: uppercase;
letter-spacing: 0.02em;
}
.mk-page-sluzby .mk-sluzby-text {
text-align: left;
margin-bottom: 1.5rem;
}
.mk-page-sluzby .mk-sluzby-text p {
margin-top: 0;
margin-bottom: 1rem;
line-height: 1.6;
color: var(--color-secondary);
}
.mk-page-sluzby .mk-sluzby-text p:last-child {
margin-bottom: 0;
}
/* Seznamy: stejný font jako u (blog.css mění jen odstavce na system stack;
by jinak dědilo Inter z body). */
.mk-page-sluzby .mk-sluzby-text ul,
.mk-page-sluzby .mk-sluzby-text ol,
.mk-page-sluzby .mk-sluzby-text li {
font-family: var(--wp--preset--font-family--system, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif);
}
.mk-page-sluzby .wp-block-buttons {
margin-top: 0;
margin-bottom: 0;
text-align: center;
}
.mk-page-sluzby .mk-sluzby-btn {
background: var(--color-tertiary, #00a1cd) !important;
color: var(--color-white) !important;
padding: 0.75rem 1.5rem;
border-radius: 6px;
font-weight: 600;
text-decoration: none;
display: block;
width: fit-content;
margin: 0 auto 1.75rem;
border: none;
transition: filter 0.2s;
}
.mk-page-sluzby .mk-sluzby-btn:hover {
filter: brightness(1.1);
}
/* ---------- Stránka Ceník – layout jako na návrhu ---------- */
.mk-page-cenik .mk-cenik-intro {
text-align: left;
}
.mk-page-cenik .mk-cenik-intro p {
max-width: 72ch;
margin-left: 0;
margin-right: auto;
color: var(--color-secondary);
line-height: 1.6;
}
.mk-page-cenik .mk-cenik-intro p + p {
margin-top: 1rem;
}
.mk-cenik-columns {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 1.5rem;
align-items: stretch;
}
.mk-cenik-card {
padding: 1.5rem 2rem;
background: #fff;
border: none;
border-radius: 8px;
box-shadow: 0 2px 12px rgba(0,0,0,0.08);
transition: box-shadow 0.2s;
}
.mk-page-cenik details.mk-cenik-card p {
margin-bottom: 0;
}
.mk-page-cenik .mk-cenik-card:hover {
box-shadow: 0 4px 20px rgba(0,0,0,0.1);
}
.mk-cenik-card h2,
.mk-cenik-card h3 {
margin-top: 0;
margin-bottom: 1.5rem;
font-size: var(--font-size-medium, 1.25rem);
font-weight: 700;
color: var(--color-dark-blue, #183f72);
text-align: center;
text-transform: uppercase;
letter-spacing: 0.02em;
}
.mk-cenik-item {
display: flex;
align-items: center;
justify-content: space-between;
gap: 1rem;
margin-bottom: 1.5rem;
}
.mk-cenik-item:last-child {
margin-bottom: 0;
}
.mk-cenik-desc {
font-size: var(--font-size-small, 0.875rem);
line-height: 1.5;
color: var(--color-secondary);
flex: 1;
min-width: 0;
}
.mk-cenik-price {
font-size: var(--font-size-normal, 1rem);
font-weight: 700;
color: var(--color-dark-blue, #183f72);
flex-shrink: 0;
}
.mk-page-cenik .mk-cenik-footer {
text-align: center;
}
.mk-page-cenik .mk-cenik-footer p {
margin: 0.5rem 0;
color: var(--color-secondary);
line-height: 1.6;
}
.mk-cenik-actions {
margin-bottom: 1.5rem;
}
.mk-cenik-btn {
display: inline-block;
background: var(--color-tertiary, #00a1cd) !important;
color: var(--color-white) !important;
padding: 0.75rem 1.5rem;
border-radius: 6px;
font-weight: 700;
text-decoration: none;
border: none;
transition: filter 0.2s;
}
.mk-cenik-btn:hover {
filter: brightness(1.1);
color: var(--color-white) !important;
}
.mk-page-cenik details.mk-cenik-card {
margin: 0 0 0.75rem;
}
.mk-page-cenik details.mk-cenik-card:last-of-type {
margin-bottom: 0;
}
.mk-page-cenik .mk-cenik-card ul {
margin: 0;
padding-left: 1.25rem;
}
.mk-page-cenik .mk-cenik-card li {
margin-bottom: 0.75rem;
line-height: 1.5;
}
/* ---------- Stránka Reference ---------- */
.mk-page-reference .mk-reference-intro p {
margin: 0 0 1rem;
line-height: 1.6;
color: var(--color-secondary, #212529);
max-width: 72ch;
}
.mk-page-reference .mk-reference-intro p:last-child {
margin-bottom: 0;
}
.mk-reference-gallery {
padding-top: 0.5rem;
}
.mk-ref-columns {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 1.5rem;
align-items: start;
}
.mk-ref-col {
min-width: 0;
}
/* Před / po slider – vlevo nevyčištěný, vpravo vyčištěný */
.mk-ref-before-after {
--slider-pos: 50%;
position: relative;
overflow: hidden;
border-radius: 6px;
box-shadow: 0 2px 12px rgba(0,0,0,0.08);
aspect-ratio: 1;
background: #eee;
}
.mk-ref-before-after .mk-ref-before,
.mk-ref-before-after .mk-ref-after {
position: absolute;
inset: 0;
}
.mk-ref-before-after .mk-ref-before img,
.mk-ref-before-after .mk-ref-after img {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
}
.mk-ref-before-after .mk-ref-after {
clip-path: inset(0 0 0 var(--slider-pos));
pointer-events: none;
}
.mk-ref-before-after .mk-ref-after img {
position: absolute;
inset: 0;
}
.mk-ref-handle {
position: absolute;
top: 0;
bottom: 0;
left: var(--slider-pos);
width: 4px;
transform: translateX(-50%);
cursor: ew-resize;
z-index: 2;
pointer-events: auto;
}
.mk-ref-handle::before {
content: "";
position: absolute;
top: 0;
bottom: 0;
left: 50%;
transform: translateX(-50%);
width: 2px;
background: #fff;
box-shadow: 0 0 4px rgba(0,0,0,0.3);
}
.mk-ref-handle::after {
content: "";
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 40px;
height: 40px;
border-radius: 50%;
border: 3px solid #fff;
background: rgba(255, 255, 255, 0.25);
box-shadow: 0 2px 8px rgba(0,0,0,0.2);
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 12'%3E%3Cpath fill='%23fff' d='M8 2 L2 6 L8 10 Z'/%3E%3Cpath fill='%23fff' d='M16 2 L22 6 L16 10 Z'/%3E%3C/svg%3E");
background-repeat: no-repeat;
background-position: center;
background-size: 14px 7px;
}
/* Modrá CTA sekce s obloukem */
.mk-page-reference .mk-reference-cta {
background-color: var(--color-primary, #0054a6) !important;
color: var(--color-white, #fff);
text-align: center;
padding: 3rem 1.5rem;
margin-left: calc(-50vw + 50%);
margin-right: calc(-50vw + 50%);
max-width: 100vw;
width: 100vw;
box-sizing: border-box;
border-radius: 40% 40% 0 0 / 80px 80px 0 0;
}
.mk-page-reference .mk-reference-trustindex {
max-width: 1200px;
margin-left: auto;
margin-right: auto;
box-sizing: border-box;
text-align: center;
}
.mk-page-reference .mk-reference-cta .wp-block-buttons {
display: flex;
justify-content: center;
flex-wrap: wrap;
}
.mk-page-reference .mk-reference-cta .mk-page-cta-heading {
margin: 0;
font-size: var(--font-size-large, 2rem);
font-weight: 700;
color: var(--color-white, #fff);
}
.mk-reference-gallery .wp-block-image img {
width: 100%;
height: auto;
border-radius: 4px;
}
.mk-ref-label {
font-size: 0.875rem;
font-weight: 600;
color: var(--color-tertiary);
margin: 0 0 1rem 0;
}
/* ---------- Stránka Aktuality ---------- */
.mt-2 { margin-top: 2rem; }
.mk-page-aktuality .mk-aktuality-intro {
text-align: left;
}
.mk-page-aktuality .mk-aktuality-intro .mk-page-heading {
font-size: var(--font-size-large, 2rem);
font-weight: 700;
color: var(--color-primary);
margin-top: 0;
margin-bottom: 1rem;
}
.mk-page-aktuality .mk-aktuality-intro p {
max-width: 72ch;
margin: 0 0 1rem;
line-height: 1.6;
color: var(--color-secondary, #212529);
}
.mk-page-aktuality .mk-aktuality-intro p:last-of-type {
margin-bottom: 0;
}
.mk-page-aktuality .mk-aktuality-reviews {
padding-top: 0.5rem;
}
.mk-page-aktuality .mk-aktuality-reviews-inner {
min-height: 1px; /* aby se Trustindex slider správně vykreslil */
}
.mk-page-aktuality .mk-aktuality-cta {
text-align: center;
}
.mk-page-aktuality .mk-aktuality-cta .mk-page-heading {
font-size: var(--font-size-large, 2rem);
font-weight: 700;
color: var(--color-primary);
margin-top: 0;
margin-bottom: 1rem;
}
.mk-page-aktuality .mk-aktuality-cta p {
margin: 0.5rem 0;
color: var(--color-secondary);
line-height: 1.6;
max-width: 72ch;
margin-left: auto;
margin-right: auto;
}
.mk-page-aktuality .mk-aktuality-cta-buttons {
margin-top: 1.5rem;
justify-content: center;
}
.mk-page-aktuality .mk-aktuality-cta .wp-block-button__link {
background: var(--color-tertiary, #00a1cd) !important;
color: var(--color-white, #fff) !important;
padding: 0.75rem 1.5rem;
border-radius: 6px;
font-weight: 700;
text-decoration: none;
display: inline-block;
}
.mk-page-aktuality .mk-aktuality-cta .wp-block-button__link:hover {
filter: brightness(1.1);
color: var(--color-white, #fff) !important;
}
/* ---------- O nás: odkazy v podnadpisech ---------- */
.mk-page-subheading-link {
color: var(--color-primary, #0054a6);
text-decoration: none;
}
.mk-page-subheading-link:visited {
color: var(--color-primary, #0054a6);
}
.mk-page-subheading-link:hover,
.mk-page-subheading-link:focus,
.mk-page-subheading-link:focus-visible,
.mk-page-subheading-link:active {
color: #000;
}
/* ---------- Stránka Kontakt ---------- */
.mk-page-kontakt .mk-kontakt-lead {
max-width: 72ch;
margin: 0;
color: var(--color-secondary, #212529);
line-height: 1.65;
}
.mk-page-kontakt .mk-page-heading {
font-size: var(--font-size-large, 2rem);
font-weight: 700;
color: var(--color-primary);
margin-top: 0;
margin-bottom: 1.25rem;
}
.mk-kontakt-top-grid {
display: grid;
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
gap: 2.5rem;
align-items: start;
}
.mk-kontakt-map-block {
margin-top: 3rem;
padding-top: 2.5rem;
border-top: 1px solid rgba(0, 0, 0, 0.08);
}
.mk-kontakt-map-block .mk-page-heading {
margin-bottom: 1.25rem;
}
.mk-kontakt-col-form {
text-align: left;
}
.mk-kontakt-info-card {
background: #fff;
border-radius: 10px;
padding: 1.75rem 1.75rem 1.5rem;
box-shadow: 0 4px 24px rgba(0, 0, 0, 0.08);
border: 1px solid rgba(0, 0, 0, 0.06);
}
.mk-page-kontakt .mk-kontakt-col-info .mk-contact-row {
margin-bottom: 1.25rem;
}
.mk-page-kontakt .mk-kontakt-col-info .mk-contact-row:last-child {
margin-bottom: 0;
}
.mk-kontakt-address {
margin: 0;
font-size: var(--mk-text-size, 18px);
line-height: 1.55;
color: var(--color-dark-blue, #183F72);
}
.mk-kontakt-address strong {
font-weight: 700;
}
.mk-kontakt-address-col {
min-width: 0;
}
.mk-kontakt-ico-dic {
display: block;
margin-top: 0.65rem;
font-size: var(--mk-small-text-size, 15px);
line-height: 1.5;
color: inherit;
}
.mk-kontakt-ico-dic-sep {
margin: 0 0.2em;
}
.mk-kontakt-social-label {
margin: 1rem 0 0.4rem;
font-size: 0.6875rem;
font-weight: 700;
letter-spacing: 0.05em;
text-transform: uppercase;
color: #777;
}
.mk-kontakt-social {
list-style: none !important;
margin: 0 !important;
padding: 0 !important;
display: flex !important;
flex-wrap: wrap;
gap: 0.75rem;
}
.mk-kontakt-social .wp-block-social-link {
margin: 0 !important;
}
.mk-kontakt-social .wp-block-social-link a {
display: flex;
align-items: center;
justify-content: center;
color: var(--color-dark-blue, #183F72) !important;
padding: 0.25rem;
text-decoration: none;
transition: color 0.2s;
}
.mk-kontakt-social .wp-block-social-link a:hover {
color: var(--color-tertiary, #00a1cd) !important;
}
.mk-kontakt-social .wp-block-social-link svg {
fill: currentColor !important;
width: 24px;
height: 24px;
}
.mk-kontakt-where {
margin-top: 2.25rem;
padding-top: 0.25rem;
}
.mk-kontakt-where .mk-page-heading {
margin-top: 0;
}
.mk-kontakt-where .mk-kontakt-note:first-of-type {
margin-top: 0;
}
.mk-kontakt-note {
margin: 1.5rem 0 0;
font-size: var(--mk-small-text-size, 15px);
line-height: 1.6;
color: var(--color-secondary, #212529);
max-width: 40ch;
}
.mk-kontakt-map-block .mk-google-map-wrap {
position: relative;
width: 100%;
border-radius: 10px;
overflow: hidden;
box-shadow: 0 8px 28px rgba(0, 0, 0, 0.1), 0 2px 6px rgba(0, 0, 0, 0.06);
aspect-ratio: 16 / 7;
min-height: 300px;
background: #e8eef4;
}
.mk-kontakt-map-block .mk-google-map-wrap iframe {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
border: 0;
display: block;
}
.mk-kontakt-map-link {
margin: 1rem 0 0;
}
.mk-kontakt-directions-link {
display: inline-block;
font-weight: 600;
font-size: var(--mk-small-text-size, 15px);
color: var(--color-tertiary, #00a1cd);
text-decoration: none;
border-bottom: 1px solid transparent;
transition: color 0.2s, border-color 0.2s;
}
.mk-kontakt-directions-link:hover {
color: var(--color-primary, #0054a6);
border-bottom-color: currentColor;
}
/* Úvodní text poptávky je uvnitř karty (.mk-card-form-desc), aby bílé boxy v obou sloupcích začínaly ve stejné výšce pod H2. */
.mk-page-kontakt .mk-contact-page-form-card .mk-card-form-desc {
color: var(--color-secondary, #212529);
line-height: 1.65;
}
.mk-page-kontakt .mk-contact-page-form-card {
max-width: 560px;
margin: 0;
text-align: left;
}
@media (max-width: 782px) {
.mk-page-section {
padding: 1.5rem 1rem;
}
.mk-page-reference .mk-reference-trustindex {
padding-left: 1rem;
padding-right: 1rem;
}
.mk-page-o-nas .mk-page-section {
padding: 2rem 1rem;
}
.mk-page-o-nas .mk-page-columns {
flex-direction: column !important;
}
.mk-page-sluzby .mk-sluzby-columns {
flex-direction: column;
gap: 2.5rem;
}
.mk-page-sluzby .mk-sluzby-col {
flex: 1 1 100%;
min-width: 100%;
}
.mk-page-o-nas .mk-page-section-alt .mk-page-heading {
text-align: left;
}
.mk-page-o-nas .mk-page-text-col,
.mk-page-o-nas .mk-page-image-col {
flex: 1 1 100%;
min-width: 100%;
}
.mk-page-o-nas .mk-page-image {
margin-left: auto !important;
margin-right: auto !important;
max-width: 280px;
}
.mk-cenik-columns {
grid-template-columns: 1fr;
}
.mk-reference-gallery .wp-block-columns {
flex-direction: column;
}
.mk-ref-columns {
grid-template-columns: 1fr;
gap: 2rem;
}
.mk-main-content.mk-page-content .mk-page-title {
font-size: 2rem;
}
.mk-kontakt-top-grid {
grid-template-columns: 1fr;
gap: 2.5rem;
}
.mk-kontakt-map-block {
margin-top: 2rem;
padding-top: 2rem;
}
.mk-kontakt-map-block .mk-google-map-wrap {
aspect-ratio: 4 / 3;
min-height: 220px;
}
.mk-page-kontakt .mk-contact-page-form-card {
padding: 1.5rem;
}
}