/* Hlavni menu trealitni.cz — spolecne pro vsechny stranky (vklada build-web.mjs).
   id="hdr" a trida .solid zustavaji kvuli skriptu homepage, ktery pri rolovani prepina .solid.
   Homepage: pruhledne nad tmavym hero, po odrolovani svetle. Ostatni stranky: rovnou .solid + .tn-sticky. */
.tn{--tn-gold:#c08a2d;--tn-gold-2:#e3b765;--tn-navy:#162a3d;--tn-cream:#faf7f1;--tn-line:#ece6da;
  position:fixed;inset:0 0 auto 0;z-index:100;padding:16px 0;
  font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  transition:background .35s,box-shadow .35s,padding .35s}
.tn.tn-sticky{position:sticky;top:0}
.tn-in{width:min(100% - clamp(32px,7vw,96px),1200px);margin-inline:auto;display:flex;align-items:center;gap:clamp(16px,2vw,28px)}
.tn a{text-decoration:none}

.tn-brand{display:flex;align-items:center;gap:11px;margin-right:auto;flex:none;
  font-weight:800;font-size:18px;letter-spacing:-.01em;color:#fff}
.tn-mark{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;flex:none;
  background:linear-gradient(150deg,var(--tn-gold),var(--tn-gold-2));color:#241701;
  font-family:"Fraunces",Georgia,serif;font-weight:700;font-size:20px;box-shadow:0 8px 20px -8px rgba(192,138,45,.8)}
.tn-brand b{font-weight:800}
.tn-brand i{font-style:normal;font-weight:600;color:var(--tn-gold-2)}

.tn-menu{display:flex;align-items:center;gap:clamp(14px,1.7vw,24px)}
.tn-link{color:#fff;font-weight:600;font-size:15px;padding:8px 0;border-bottom:2px solid transparent;white-space:nowrap;transition:color .2s,border-color .2s}
.tn-link:hover,.tn-link[aria-current="page"]{color:var(--tn-gold-2);border-color:var(--tn-gold-2)}

.tn-actions{display:flex;align-items:center;gap:14px;flex:none}
.tn-tel{display:inline-flex;align-items:center;gap:8px;font-weight:700;font-size:15px;color:#fff;white-space:nowrap}
.tn-tel svg{width:17px;height:17px;color:var(--tn-gold-2)}
.tn-cta{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:12px 22px;
  background:linear-gradient(135deg,var(--tn-gold),var(--tn-gold-2));color:#241701;font-weight:700;font-size:15px;white-space:nowrap;
  box-shadow:0 14px 30px -14px rgba(192,138,45,.7);transition:transform .3s cubic-bezier(.2,1.5,.4,1),box-shadow .3s}
.tn-cta:hover{transform:translateY(-2px);box-shadow:0 20px 38px -14px rgba(192,138,45,.85)}

/* svetla verze: po odrolovani na homepage, na ostatnich strankach vzdy, a kdyz je otevrene mobilni menu */
.tn.solid,.tn.open{background:rgba(250,247,241,.94);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
  box-shadow:0 1px 0 var(--tn-line),0 10px 30px -20px rgba(22,42,61,.4)}
/* zuzeni jen pri rolovani, ne pri otevreni menu - jinak by se behem animace spatne zmerila vyska pro panel */
.tn.solid{padding:10px 0}
.tn.solid .tn-brand,.tn.solid .tn-link,.tn.solid .tn-tel,
.tn.open .tn-brand,.tn.open .tn-link,.tn.open .tn-tel{color:var(--tn-navy)}
.tn.solid .tn-brand i,.tn.open .tn-brand i{color:var(--tn-gold)}
.tn.solid .tn-link:hover,.tn.solid .tn-link[aria-current="page"]{color:var(--tn-gold);border-color:var(--tn-gold)}
.tn.solid .tn-tel svg{color:var(--tn-gold)}

.tn :focus-visible{outline:2px solid var(--tn-gold-2);outline-offset:3px;border-radius:6px}
.tn.solid :focus-visible,.tn.open :focus-visible{outline-color:var(--tn-gold)}

/* hamburger + mobilni panel */
.tn-burger{display:none;place-items:center;width:44px;height:44px;border:0;border-radius:12px;cursor:pointer;
  background:rgba(255,255,255,.14);color:#fff;transition:background .2s}
.tn.solid .tn-burger,.tn.open .tn-burger{background:rgba(22,42,61,.07);color:var(--tn-navy)}
.tn-burger svg{width:24px;height:24px}
.tn-burger .tn-x,.tn.open .tn-burger .tn-bars{display:none}
.tn.open .tn-burger .tn-x{display:block}
.tn-panel{display:none}

@media (max-width:1240px){.tn-tel{display:none}}
@media (max-width:1060px){
  .tn-menu{display:none}
  .tn-burger{display:grid}
  /* panel az ke spodnimu okraji obrazovky, at pod nim neprosvita stranka (lista s tlacitky, bublina);
     --tn-h nastavi nav.js podle skutecne vysky hlavicky */
  .tn.open .tn-panel{display:block;position:absolute;left:0;right:0;top:100%;
    height:calc(100vh - var(--tn-h,64px));height:calc(100dvh - var(--tn-h,64px));overflow-y:auto;overscroll-behavior:contain;
    background:var(--tn-cream);border-top:1px solid var(--tn-line)}
  html.tn-lock{overflow:hidden}
}
@media (max-width:520px){
  .tn-cta{display:none}
  .tn-brand{font-size:16.5px}
}
.tn-panel-in{width:min(100% - 32px,560px);margin-inline:auto;padding:14px 0 28px;display:grid;gap:4px}
.tn-plink{display:flex;align-items:center;justify-content:space-between;padding:15px 4px;border-bottom:1px solid var(--tn-line);
  color:var(--tn-navy);font-family:"Fraunces",Georgia,serif;font-weight:600;font-size:21px}
.tn-plink::after{content:"→";font-family:"Inter",sans-serif;font-size:17px;color:var(--tn-gold)}
.tn-plink[aria-current="page"]{color:var(--tn-gold)}
.tn-pcall{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:18px}
.tn-pcall a{display:flex;flex-direction:column;gap:2px;padding:12px 14px;border:1px solid var(--tn-line);border-radius:14px;background:#fff;color:var(--tn-navy);font-size:13px}
.tn-pcall b{font-size:16px}
.tn-pcta{margin-top:12px;display:flex;justify-content:center;border-radius:999px;padding:15px 22px;
  background:linear-gradient(135deg,var(--tn-gold),var(--tn-gold-2));color:#241701;font-weight:700;font-size:16px}
.tn-pmail{margin-top:10px;text-align:center;color:#5d6b78;font-size:14px}
@media (prefers-reduced-motion:reduce){.tn,.tn-cta,.tn-link{transition:none}}