/* masomarket.cz 2026: Bootstrap 5 + vlastní styly (barvy, písmo Rubik a ilustrace jako dřív) */
:root {
	--mm-yellow: #febd11;
	--mm-yellow-dark: #e0a400;
	--mm-brown: #291b0e;
	--mm-grey: #eae3d2;
	--mm-beige: #dbc9a1;
	--mm-muted: #6e6253;
	--bs-body-font-family: "Rubik", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
	--bs-body-color: #2a2118;
	--bs-link-color-rgb: 41, 27, 14;
	--bs-link-hover-color-rgb: 0, 0, 0;
}

@font-face { font-family: iconset; src: url(../fonts/iconset.woff?a7pnfw) format("woff"), url(../fonts/iconset.ttf?a7pnfw) format("truetype"); font-weight: 400; font-style: normal; font-display: swap; }
.ico { font-family: iconset; font-style: normal; font-weight: 400; line-height: 1; display: inline-block; speak: none; -webkit-font-smoothing: antialiased; }
.ico-chicken::before { content: "\e900"; }
.ico-mail::before { content: "\f003"; }
.ico-phone::before { content: "\f095"; }
.ico-right::before { content: "\f105"; }
.ico-down::before { content: "\f107"; }
.ico.flip { transform: scaleX(-1); }

body { line-height: 1.7; -webkit-font-smoothing: antialiased; }
h1, h2, h3, .h4 { font-weight: 700; color: inherit; }
h2 { font-size: clamp(1.8rem, 4vw, 2.6rem); margin-bottom: 1.25rem; }
a { text-underline-offset: .2em; }
html { scroll-behavior: smooth; }
section[id] { scroll-margin-top: 80px; }

.btn { border-radius: 0; font-weight: 500; padding: .7rem 1.3rem; }
.btn-maso { --bs-btn-bg: var(--mm-yellow); --bs-btn-border-color: var(--mm-yellow); --bs-btn-color: var(--mm-brown); --bs-btn-hover-bg: var(--mm-yellow-dark); --bs-btn-hover-border-color: var(--mm-yellow-dark); --bs-btn-hover-color: var(--mm-brown); --bs-btn-active-bg: var(--mm-yellow-dark); --bs-btn-active-color: var(--mm-brown); }
.btn-outline-maso { --bs-btn-color: var(--mm-brown); --bs-btn-border-color: var(--mm-brown); --bs-btn-hover-bg: var(--mm-brown); --bs-btn-hover-color: #fff; --bs-btn-hover-border-color: var(--mm-brown); }
.btn-dark { --bs-btn-bg: var(--mm-brown); --bs-btn-border-color: var(--mm-brown); }
.btn .ico { margin: 0 .2rem; }

/* hlavička */
.site-header { position: absolute; top: 0; left: 0; right: 0; z-index: 20; color: #fff; padding: 1rem 0; }
.site-header .container-fluid { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; padding: 0 clamp(1rem, 4vw, 3rem); }
.brand img { display: block; width: clamp(90px, 10vw, 120px); height: auto; }
.header-right { display: flex; flex-direction: column; align-items: flex-end; gap: .5rem; }
.top-header { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .25rem 1.25rem; font-size: .85rem; opacity: .85; }
.top-header a { color: #fff; text-decoration: none; }
.top-header a:hover { text-decoration: underline; }
.site-nav { display: flex; flex-wrap: wrap; gap: .25rem 1.5rem; }
.site-nav a { color: #fff; font-weight: 500; text-decoration: none; padding: .25rem 0; border-bottom: 2px solid transparent; }
.site-nav a:hover { border-color: var(--mm-yellow); }
.nav-toggle { display: none; width: 44px; height: 44px; border: 0; background: none; position: relative; }
.nav-toggle span, .nav-toggle span::before, .nav-toggle span::after { position: absolute; left: 10px; width: 24px; height: 2px; background: #fff; content: ""; transition: transform .25s; }
.nav-toggle span { top: 21px; } .nav-toggle span::before { top: -7px; left: 0; } .nav-toggle span::after { top: 7px; left: 0; }
.nav-toggle[aria-expanded="true"] span { background: transparent; }
.nav-toggle[aria-expanded="true"] span::before { transform: translateY(7px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] span::after { transform: translateY(-7px) rotate(-45deg); }
@media (max-width: 767.98px) {
	.nav-toggle { display: block; }
	.top-header { display: none; }
	.site-nav { display: none; position: absolute; top: 100%; left: 0; right: 0; background: var(--mm-brown); flex-direction: column; padding: .5rem 1.5rem 1rem; }
	.site-nav.open { display: flex; }
	.site-nav a { padding: .7rem 0; border-bottom: 1px solid rgba(255,255,255,.1); }
}

/* úvod: dřevo jako dřív */
.hero { position: relative; color: #fff; background: var(--mm-brown) url(../img/main-banner-1000.webp) center top / cover no-repeat; padding: clamp(8rem, 16vw, 11rem) 0 clamp(6rem, 12vw, 8.5rem); overflow: hidden; }
@media (min-width: 1000px) { .hero { background-image: url(../img/main-banner.webp); } }
.hero h1 { font-size: clamp(2rem, 5.5vw, 3.6rem); font-weight: 900; line-height: 1.1; color: #fff; margin: 0 0 2rem; }
.hero-buttons { display: flex; flex-wrap: wrap; justify-content: center; gap: .75rem; }
.hero-sub { padding: clamp(8rem, 14vw, 10rem) 0 3rem; }
.hero-sub h1 { font-size: clamp(1.8rem, 4.5vw, 2.8rem); margin: 0; }
.site-motto { position: absolute; right: clamp(1rem, 5vw, 4rem); bottom: 1.5rem; text-align: center; color: var(--mm-yellow); }
.site-motto .ico-chicken { font-size: 3.5rem; }
.site-motto p { margin: 0; font-weight: 700; font-size: .9rem; color: #fff; }
.chat-bubble { position: absolute; right: 85%; bottom: 85%; width: 11rem; background: #fff; color: var(--mm-brown); border-radius: 1rem; padding: .6rem .8rem; font-size: .85rem; line-height: 1.3; min-height: 3.2rem; }
.chat-bubble span { position: absolute; left: .8rem; right: .8rem; top: 50%; transform: translateY(-50%); display: block; text-align: center; animation: bubble 8s infinite; }
.chat-bubble span + span { animation-delay: 4s; opacity: 0; }
@keyframes bubble { 0%, 45% { opacity: 1; } 50%, 95% { opacity: 0; } 100% { opacity: 1; } }
.hero-down { position: absolute; left: 50%; bottom: 1rem; transform: translateX(-50%); color: #fff; font-size: 2rem; text-decoration: none; animation: bounce 2s infinite; }
@keyframes bounce { 0%, 100% { transform: translate(-50%, 0); } 50% { transform: translate(-50%, 8px); } }
@media (max-width: 767.98px) { .site-motto { display: none; } }

/* sekce */
.section { padding: clamp(3.5rem, 8vw, 6rem) 0; }
.section-grey { background: var(--mm-grey); }
.section-beige { background: var(--mm-beige); }
.section-brown { background: var(--mm-brown); color: #fff; }
.section-brown a, .section-brown h2, .section-brown h3 { color: #fff; }
.narrow { max-width: 860px; }
.subtitle { font-size: clamp(1.1rem, 2.2vw, 1.4rem); max-width: 32rem; margin: 0 auto 2rem; }
.order-buttons { display: flex; flex-wrap: wrap; justify-content: center; gap: .75rem; margin-bottom: 2.5rem; }
.divider-chicken { font-size: 2.7rem; color: var(--mm-brown); opacity: .6; margin-bottom: 1.5rem; }
.contact-person a { margin-left: .5rem; }
.section-grey p { font-size: 1.05rem; }
.section-buttons { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; margin-top: 2rem; }
.text-block h2, .text-block h3 { font-size: clamp(1.5rem, 3vw, 2.1rem); }
.veterinary { max-height: 320px; width: auto; }

/* kontakt a mapa */
.contact-row h3 { font-size: 1.1rem; color: var(--mm-yellow) !important; margin: 1.25rem 0 .4rem; }
.contact-row h3:first-child { margin-top: 0; }
.contact-row p, .contact-row dl { margin-bottom: .5rem; color: rgba(255,255,255,.85); }
.contact-row dt { font-weight: 400; color: rgba(255,255,255,.6); font-size: .9rem; }
.contact-row dd { margin-bottom: .4rem; }
.map iframe { display: block; width: 100%; height: 420px; border: 0; filter: grayscale(.3); }

/* patička */
.site-footer { background: #1b1209; color: rgba(255,255,255,.6); text-align: center; padding: 2rem 0; font-size: .9rem; }
.site-footer .ico-chicken { font-size: 2rem; color: var(--mm-yellow); }
.site-footer a { color: rgba(255,255,255,.8); }
.site-footer p { margin: .5rem 0 0; }

/* vyskakovací okno (nabídka práce) */
.popup { border: 0; padding: 2rem; max-width: min(36rem, calc(100vw - 2rem)); box-shadow: 0 20px 60px rgba(0,0,0,.4); }
.popup::backdrop { background: rgba(20,12,4,.6); }
.popup-title { font-size: 1.5rem; font-weight: 900; text-align: center; margin: 0 0 1rem; }
.popup-body p { margin-bottom: .5rem; }
.popup-body .red { color: #c8102e; font-weight: 700; }
.popup-close { position: absolute; top: .5rem; right: .75rem; border: 0; background: none; font-size: 2rem; line-height: 1; color: #999; }
.popup .btn { display: block; margin: 1.25rem auto 0; }

/* podstránky (dotazník, zpravodaj, obsah, login) */
.page-body { padding: clamp(2.5rem, 6vw, 4rem) 0 clamp(3rem, 7vw, 5rem); }
.page-body .form-control, .page-body .form-select { border-radius: 0; }
.hidn, .hide { display: none !important; }
.form-group { margin-bottom: 1rem; }
.pull-right, .float-right { float: right; } .pull-left, .float-left { float: left; }
.cls { clear: both; }
.img-responsive { max-width: 100%; height: auto; }
.btn-block { display: block; width: 100%; }
.marginT1 { margin-top: 10px !important; } .marginT2 { margin-top: 20px !important; } .marginT3 { margin-top: 30px !important; } .marginT4 { margin-top: 40px !important; } .marginT5 { margin-top: 50px !important; } .marginT6 { margin-top: 60px !important; }
.marginB0 { margin-bottom: 0 !important; } .marginB1 { margin-bottom: 10px !important; } .marginB2 { margin-bottom: 20px !important; } .marginB3 { margin-bottom: 30px !important; } .marginB4 { margin-bottom: 40px !important; } .marginB5 { margin-bottom: 50px !important; }
.paddingB0 { padding-bottom: 0 !important; }
@media (min-width: 768px) { .col-md-offset-4 { margin-left: 33.333333%; } .justify-content-md-center > .col-md-offset-4 { margin-left: 0; } }
@media (min-width: 576px) { #dotaznikform .form-label.col-sm-3, #form .form-label.col-sm-3 { text-align: right; padding-top: .6rem; } }
.admin-float { position: fixed; right: 0; bottom: 0; z-index: 1000; background: #fff; padding: 1rem 1.5rem; box-shadow: 0 0 20px rgba(0,0,0,.2); text-align: center; }

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	.hero-down, .chat-bubble span { animation: none; }
	.chat-bubble span + span { display: none; }
}
@media print {
	.site-header, .map, .popup, .hero-down, .site-motto { display: none; }
	.hero { background: none; color: #000; padding: 1rem 0; }
	.hero h1 { color: #000; }
}
