/* ============================================================ DŘEVORA - ZN — sdílená navigace + patička Jeden zdroj pravdy pro všechny stránky. Načítá se jako POSLEDNÍ v , takže přebíjí starší inline pravidla. ============================================================ */ /* ---------- HEADER ---------- */ header{ position:sticky;top:0;z-index:50; background:rgba(43,42,41,.97); -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px); border-bottom:1px solid rgba(255,255,255,.07); } .nav{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:14px 28px;max-width:1180px;margin:0 auto} .nav-logo{display:flex;align-items:center;flex-shrink:0;border:none} .nav-logo svg{height:34px;width:auto;display:block} .nav-links{display:flex;gap:22px;align-items:center;flex-wrap:nowrap} .nav-links a{ color:#cfc9c0;font-family:'Barlow Condensed',sans-serif;font-weight:600; text-transform:uppercase;letter-spacing:.04em;font-size:.96rem;transition:.18s; display:inline-flex;align-items:center;gap:7px;white-space:nowrap;border:none; } .nav-links a:hover{color:var(--orange,#F18917)} /* aktivní stránka */ .nav-links a.active,.nav-links a[aria-current="page"]{color:var(--orange,#F18917)} /* pořadová čísla jen na mobilu */ .nav-links a .ix{display:none} /* ---- dropdown Sortiment ---- */ .nav-drop{position:relative;display:inline-flex;align-items:center} .nav-drop-head{display:inline-flex;align-items:center} .nav-drop-toggle{cursor:pointer} .nav-drop-btn{ display:inline-flex;align-items:center;justify-content:center; background:none;border:none;padding:2px 2px 2px 4px;margin:0;cursor:pointer;color:#7d766c; } .nav-drop-btn .caret{transition:transform .22s,color .18s;display:block} .nav-drop:hover .nav-drop-toggle,.nav-drop:hover .nav-drop-btn{color:var(--orange,#F18917)} .nav-drop:hover .caret{transform:rotate(180deg)} .nav-drop-menu{ position:absolute;top:100%;left:-14px;min-width:210px; background:#33302e;border:1px solid rgba(255,255,255,.1); border-top:3px solid var(--orange,#F18917);border-radius:0 0 7px 7px; padding:8px 0;margin-top:14px; box-shadow:0 22px 44px -20px rgba(0,0,0,.6); opacity:0;visibility:hidden;transform:translateY(-8px); transition:.22s cubic-bezier(.2,.7,.2,1);z-index:60; } .nav-drop::after{content:"";position:absolute;top:100%;left:0;right:0;height:18px} .nav-drop:hover .nav-drop-menu,.nav-drop.open .nav-drop-menu{opacity:1;visibility:visible;transform:none} .nav-drop-menu a{ display:block;padding:11px 22px;color:#cfc9c0;font-size:.98rem; letter-spacing:.04em;border-bottom:1px solid rgba(255,255,255,.05);white-space:nowrap;border-left:none;border-right:none; font-family:'Barlow Condensed',sans-serif;font-weight:600;text-transform:uppercase;transition:.16s; } .nav-drop-menu a:last-child{border-bottom:none} .nav-drop-menu a:hover{color:var(--orange,#F18917);background:rgba(241,137,23,.08)} /* ---- telefon CTA ---- */ .nav-phone{ display:inline-flex;align-items:center;gap:8px;flex-shrink:0; background:var(--orange,#F18917);color:#fff;padding:9px 16px;border-radius:3px; font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:1.02rem;white-space:nowrap; transition:.2s;border:none; } .nav-phone:hover{background:var(--orange-deep,#EC691F)} /* ---- burger ---- */ .burger{ display:none;flex-direction:column;justify-content:center;gap:5px; cursor:pointer;width:42px;height:42px;padding:0; background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12); border-radius:6px;align-items:center;transition:.2s; } .burger:hover{background:rgba(241,137,23,.18);border-color:var(--orange,#F18917)} .burger span{ width:20px;height:2px;background:#fff;border-radius:2px; transition:.28s cubic-bezier(.5,.2,.2,1);transform-origin:center; } .burger.active{background:var(--orange,#F18917);border-color:var(--orange,#F18917)} .burger.active span:nth-child(1){transform:translateY(7px) rotate(45deg)} .burger.active span:nth-child(2){opacity:0;transform:scaleX(0)} .burger.active span:nth-child(3){transform:translateY(-7px) rotate(-45deg)} .nav-backdrop{ display:none;position:fixed;inset:0;z-index:40; background:rgba(20,19,18,.6);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px); opacity:0;transition:opacity .3s; } .nav-backdrop.show{opacity:1} .nav-mobile-foot{display:none} /* ---------- MOBILNÍ NAVIGACE ---------- */ @media(max-width:900px){ .nav-links{ position:fixed;top:0;right:0;width:min(360px,86vw);height:100vh;height:100dvh; background:linear-gradient(165deg,#33302e 0%,#211f1e 100%); flex-direction:column;align-items:stretch;justify-content:flex-start; padding:96px 0 28px;gap:0;z-index:45; transform:none;transition:opacity .32s ease, visibility .32s ease; box-shadow:-20px 0 50px -20px rgba(0,0,0,.6);overflow-y:auto; } .nav-links:not(.open){width:0;min-width:0;overflow:hidden;visibility:hidden;opacity:0;box-shadow:none} .nav-links.open{transform:none;opacity:1;visibility:visible} /* telefon v horní liště: na mobilu jen ikona, číslo je dostupné v zásuvce menu */ .nav-phone span{display:none} .nav-links > a{ display:flex;align-items:center;gap:16px; padding:17px 30px;font-size:1.5rem;color:#e7e2d9; border-bottom:1px solid rgba(255,255,255,.055); opacity:0;transform:translateX(24px); } .nav-links.open > a,.nav-links.open > .nav-drop{ opacity:1;transform:none; transition:opacity .4s ease,transform .4s ease,color .15s; } .nav-links.open > a:nth-child(1){transition-delay:.10s} .nav-links.open > .nav-drop:nth-child(2){transition-delay:.16s} .nav-links.open > a:nth-child(3){transition-delay:.22s} .nav-links.open > a:nth-child(4){transition-delay:.28s} .nav-links.open > a:nth-child(5){transition-delay:.34s} .nav-links > a:active{background:rgba(241,137,23,.1)} .nav-links a .ix{ display:inline-block;font-size:.82rem;font-weight:700;color:var(--orange,#F18917); letter-spacing:.08em;min-width:24px; } /* ---- Sortiment jako rozklikávací akordeon ---- */ .nav-drop{ display:flex;flex-direction:column;align-items:stretch; opacity:0;transform:translateX(24px); } .nav-drop-head{ display:flex;align-items:center;justify-content:space-between; border-bottom:1px solid rgba(255,255,255,.055); } .nav-drop-head .nav-drop-toggle{ flex:1;display:flex;align-items:center;gap:16px; padding:17px 30px;font-size:1.5rem;color:#e7e2d9; } .nav-drop-btn{ width:62px;height:62px;color:#9b948a;flex-shrink:0; } .nav-drop-btn .caret{width:18px;height:18px;transition:transform .28s} .nav-drop.open .nav-drop-btn .caret{transform:rotate(180deg)} .nav-drop::after{display:none} /* zavřeno = sbaleno; otevře se až po ťuknutí na šipku */ .nav-drop-menu{ position:static;opacity:1;visibility:visible;transform:none; background:rgba(0,0,0,.18);border:none;border-radius:0; margin:0;padding:0;box-shadow:none;min-width:0; max-height:0;overflow:hidden;transition:max-height .34s ease; } .nav-drop.open .nav-drop-menu{max-height:520px} .nav-drop-menu a{ font-size:1.12rem;padding:13px 30px 13px 56px;color:#bdb6ab; border-bottom:1px solid rgba(255,255,255,.04); } .nav-mobile-foot{ display:block;margin-top:auto;padding:26px 30px 6px; opacity:0;transform:translateY(16px); } .nav-links.open .nav-mobile-foot{opacity:1;transform:none;transition:.45s ease .46s} .nm-call{ display:flex !important;align-items:center;justify-content:center;gap:10px; background:var(--orange,#F18917);color:#fff !important; padding:14px 20px !important;border-radius:6px;border:none !important; font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:1.25rem !important; } .nm-mail{ display:block !important;text-align:center;color:#b3aca2 !important; font-size:1rem !important;padding:14px 0 6px !important;border:none !important; } .nm-hours{ text-align:center;color:#7d766c;font-size:.86rem; font-family:'Barlow Condensed',sans-serif;letter-spacing:.06em;text-transform:uppercase; } .burger{display:flex;z-index:46} body.menu-open{overflow:hidden} } /* ============================================================ PATIČKA — jednotná na všech stránkách ============================================================ */ footer{background:#211f1e;color:#9b948a;padding:58px 0 26px} .foot-grid{ display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:40px;margin-bottom:40px; max-width:1180px;margin-left:auto;margin-right:auto;padding:0 28px; } footer .flogo svg{height:auto;width:210px;max-width:60%;display:block;margin-bottom:18px} footer p{font-size:.96rem;line-height:1.7} footer h4{ font-family:'Barlow Condensed',sans-serif;color:#fff;text-transform:uppercase; letter-spacing:.1em;font-size:1.05rem;margin-bottom:16px; } footer .fcol{display:block} footer .fcol a,footer .fcol div{display:block;width:100%;font-size:.96rem;margin-bottom:9px;transition:.16s;white-space:normal;color:#9b948a;border:none} footer .fcol a:hover{color:var(--orange,#F18917)} .firmy-badge-foot{margin-top:18px;display:flex;justify-content:flex-start} .firmy-badge-foot img{height:42px;width:auto;display:block} .firmy-badge-foot a{border:none;line-height:0;opacity:.92;transition:opacity .2s} .firmy-badge-foot a:hover{opacity:1} .foot-bottom{ border-top:1px solid rgba(255,255,255,.08);padding-top:22px; max-width:1180px;margin:0 auto;padding-left:28px;padding-right:28px; display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px 20px; font-size:.86rem;color:#6f6960; } .foot-bottom a{color:#8a8378;border:none} .foot-bottom a:hover{color:var(--orange,#F18917)} .foot-credit{display:flex;align-items:center;gap:12px;flex-wrap:wrap} .foot-credit .sep{color:#48433c} .credit-link{color:#8a8378;font-weight:600;transition:.16s} .credit-link:hover{color:var(--orange,#F18917)} @media(max-width:780px){ .foot-grid{grid-template-columns:1fr;gap:32px;text-align:center} footer .flogo svg{margin-left:auto;margin-right:auto} .firmy-badge-foot{justify-content:center} .foot-bottom{justify-content:center;text-align:center;flex-direction:column;align-items:center;gap:12px} .foot-credit{justify-content:center} } /* Telefony a e-maily se nikdy nelámou přes řádky (vždy vcelku na jednom řádku) */ a[href^="tel:"], a[href^="mailto:"]{white-space:nowrap} footer .fcol a[href^="tel:"], footer .fcol a[href^="mailto:"]{white-space:nowrap} /* pomocná třída: nezalomitelný úsek (telefon/e-mail v textu) */ .nowrap{white-space:nowrap}