/* LineArch -- System layer (P1-P3, 2026-10-25)
   Loaded LAST on every page, after the page's own inline <style>, so these
   rules win over the per-page copies without editing 25 inline blocks.
   Each block names the audit finding it resolves (A4-A14). */

/* ---------- A6: heading leading ---------- */
h1,h2,h3,h4{line-height:1.15;}

/* ---------- A4: one page-head system, two sizes ---------- */
h1 .l{display:block;font-weight:300;}
h1 .b{font-weight:800;}
h1 .acc{border-bottom:3px solid var(--accent);padding-bottom:.04em;}
/* large: main pages (Domov, Služby, Projekty, Cenník, O nás, Kontakt, Dopyt) */
.hero h1,.ppage-hero h1{
  font-family:"LA Outfit",sans-serif;font-weight:300;
  font-size:clamp(2.6rem,5.2vw,4.2rem);line-height:1.04;margin:0 0 1.5rem;text-wrap:balance;
}
.hero p,.ppage-hero p{max-width:34rem;}
.ppage-hero{padding:1.5rem 0 3rem;}
/* small: Články, article pages, legal */
.blog-hero h1,.article-hero h1,.legal-hero h1{
  font-family:"LA Outfit",sans-serif;font-weight:700;
  font-size:clamp(1.9rem,3.6vw,2.75rem);line-height:1.15;margin:0 0 1rem;max-width:44rem;text-wrap:balance;
}
.blog-hero,.legal-hero{padding:1.5rem 0 2.5rem;}
.hero .eyebrow,.ppage-hero .eyebrow,.blog-hero .eyebrow,.article-hero .eyebrow,.legal-hero .eyebrow{
  display:block;margin:0 0 1rem;
}
.article-hero .back{display:flex;width:max-content;margin-bottom:1.25rem;}

/* ---------- A10 + A11: navigation with a primary action ---------- */
.logo{display:inline-flex;align-items:center;min-height:44px;}
nav a.nav-cta{
  display:inline-flex;align-items:center;min-height:2.5rem;padding:0 1.05rem;
  background:var(--ink);color:#fff;border-radius:2px;transition:background .2s;
}
nav a.nav-cta::after{display:none;}
nav a.nav-cta:hover,nav a.nav-cta[aria-current="page"]{background:var(--accent);color:#fff;}
/* hamburger from 1024 px down (the menu used to wrap onto a second row at tablet widths) */
@media (max-width:1024px){
  .navtoggle{
    display:block;background:none;border:1px solid var(--line);width:2.75rem;height:2.75rem;
    position:relative;cursor:pointer;
  }
  .navtoggle span,.navtoggle span::before,.navtoggle span::after{
    content:"";position:absolute;left:50%;top:50%;width:1.1rem;height:2px;background:var(--ink);
    transform:translate(-50%,-50%);transition:transform .2s,opacity .2s;
  }
  .navtoggle span::before{transform:translateY(-6px);}
  .navtoggle span::after{transform:translateY(6px);}
  .navtoggle[aria-expanded="true"] span{background:transparent;}
  .navtoggle[aria-expanded="true"] span::before{transform:rotate(45deg);}
  .navtoggle[aria-expanded="true"] span::after{transform:rotate(-45deg);}
  header nav{display:block;width:100%;max-height:0;overflow:hidden;transition:max-height .25s ease;order:3;}
  header nav.open{max-height:40rem;}
  header nav ul{flex-direction:column;gap:0;margin-top:1.2rem;}
  header nav li{border-bottom:1px solid var(--line);}
  header nav a{display:block;padding:.9rem .1rem;font-size:.85rem;}
  header nav a::after{display:none;}
  header nav li.nav-cta-item{border-bottom:none;padding:1rem 0 .4rem;}
  header nav a.nav-cta{display:flex;justify-content:center;min-height:3rem;padding:0 1rem;}
}

/* ---------- A5: grey panels get inner padding ---------- */
.services,.pricing{padding:clamp(2.5rem,5vw,4rem) clamp(1.25rem,4vw,3rem);}

/* ---------- A7: one closing call-to-action ---------- */
.cta-grid{grid-template-columns:1fr;}
.cta h2{max-width:38rem;}
.cta .eyebrow{color:#AFC2CE;}
.cta-contacts{list-style:none;margin:1.6rem 0 0;padding:0;display:flex;flex-wrap:wrap;gap:.25rem 2.2rem;}
.cta-contacts a{
  display:inline-flex;align-items:center;min-height:44px;
  font-family:"LA Outfit",sans-serif;font-weight:700;font-size:clamp(1.2rem,2.2vw,1.45rem);color:var(--bg);
}
.cta-contacts a:hover{color:var(--accent-light);}

/* ---------- A8: credentials strip, label always under the value ---------- */
.stats-row > div{flex-direction:column;align-items:flex-start;gap:.35rem;}
.stats-row .lbl{font-size:.8125rem;}

/* ---------- A9: projects -- one card per project, grid + gallery ---------- */
.pcard-open{display:block;width:100%;padding:0;border:0;cursor:zoom-in;font:inherit;color:inherit;}
.pcard-open img{transition:transform .5s ease;}
.pcard-open:hover img,.pcard-open:focus-visible img{transform:scale(1.03);}
.pcard-count{
  position:absolute;right:.6rem;bottom:.6rem;z-index:1;background:rgba(22,50,74,.9);color:#fff;
  font-family:"LA Inter",sans-serif;font-weight:700;font-size:.75rem;letter-spacing:.03em;padding:.4rem .6rem;border-radius:2px;
}
@media (min-width:768px){
  .pcards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2.2rem 1.6rem;overflow:visible;margin:1.6rem 0 0;padding:0;cursor:auto;scroll-snap-type:none;}
  .pcard{flex:none;}
  .pscroll-nav{display:none !important;}
}
@media (min-width:1024px){ .pcards{grid-template-columns:repeat(3,minmax(0,1fr));} }
@media (max-width:767px){ .pcard{flex:0 0 78%;} .pcards{margin:1.2rem 0 0;padding:.3rem 0 1.2rem;} }
.lightbox{border:0;padding:0;margin:0;background:transparent;width:100%;height:100%;max-width:none;max-height:none;color:#EAF1F5;}
.lightbox::backdrop{background:rgba(10,22,34,.94);}
.lightbox figure{margin:0;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.9rem;padding:4rem 5rem 2rem;}
.lightbox img{max-width:100%;max-height:calc(100% - 4rem);object-fit:contain;}
.lightbox figcaption{font-family:"LA Inter",sans-serif;font-size:.95rem;text-align:center;}
.lightbox figcaption b{font-family:"LA Outfit",sans-serif;}
.lb-btn{
  position:absolute;width:48px;height:48px;border-radius:50%;border:1px solid rgba(234,241,245,.35);
  background:rgba(22,50,74,.6);color:#EAF1F5;font-size:1.4rem;line-height:1;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
}
.lb-btn:hover{background:var(--accent);border-color:var(--accent);}
.lb-close{top:1rem;right:1rem;}
.lb-prev{left:1rem;top:50%;transform:translateY(-50%);}
.lb-next{right:1rem;top:50%;transform:translateY(-50%);}
@media (max-width:640px){
  .lightbox figure{padding:4rem .75rem 5.5rem;}
  .lb-prev,.lb-next{top:auto;bottom:1rem;transform:none;}
  .lb-prev{left:calc(50% - 60px);} .lb-next{right:calc(50% - 60px);}
}

/* ---------- A12: readable type sizes ---------- */
.eyebrow{font-size:.8125rem;}
.kinfo-block .k,.kfield label,.dlabel,.calc-label,.team-license,.meta,footer.site .meta{font-size:.8125rem;}
.status-badge{font-size:.75rem;}
.pnote,.calc-fine{font-size:.875rem;}
@media (max-width:640px){
  html body p:not(.eyebrow):not(.pnote):not(.calc-fine):not(.meta){font-size:1rem;}
}

/* ---------- A13: touch targets ---------- */
.kinfo-block .v a,.ksocial a{display:inline-flex;align-items:center;min-height:44px;}
#calc-export{min-height:44px;}
.ksubmit,.dsubmit{min-height:48px;}

/* ---------- A14: line length ---------- */
.explainer p{max-width:70ch;}

/* ---------- A12/A13 follow-up after the device audit ---------- */
label.dlabel,.dfield label.dlabel,.kfield label,.brow .n,.calc-result-label{font-size:.8125rem;}
.kconsent label,.dconsent label{font-size:.875rem;line-height:1.6;min-height:1.5rem;}
.kconsent input[type=checkbox],.dconsent input[type=checkbox]{width:1.25rem;height:1.25rem;margin-top:.1rem;accent-color:var(--accent);}

/* =====================================================================
   P2 (2026-10-25)
   ===================================================================== */

/* ---------- A15: homepage sections ---------- */
.home-sec{padding:clamp(3.5rem,7vw,5.5rem) 0 0;}
.home-sec:last-child{padding-bottom:clamp(3.5rem,7vw,5.5rem);}
.home-sec > .link-arrow{margin-top:2rem;display:inline-flex;}
.hsvc,.hsteps{list-style:none;margin:0;padding:0;display:grid;gap:0 2.4rem;}
.hsvc{grid-template-columns:repeat(3,minmax(0,1fr));}
.hsvc li,.hsteps li{border-top:1px solid var(--line);padding:1.3rem 0 1.5rem;}
.hsvc .n,.hsteps .n{font-family:"LA Outfit",sans-serif;font-weight:700;font-size:.875rem;color:var(--accent);}
.hsvc h3,.hsteps h3{font-family:"LA Outfit",sans-serif;font-weight:700;font-size:1.15rem;margin:.45rem 0 .5rem;}
.hsvc p,.hsteps p{margin:0;color:var(--ink-soft);font-size:.9375rem;line-height:1.6;}
.hsteps{grid-template-columns:repeat(5,minmax(0,1fr));gap:0 1.6rem;}
.hsteps li{border-top:2px solid var(--ink);}
.hcats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1.4rem;}
.hcat{display:flex;flex-direction:column;color:var(--ink);}
.hcat-photo{display:block;aspect-ratio:4/3;overflow:hidden;background:var(--panel);}
.hcat-photo img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease;}
.hcat:hover .hcat-photo img,.hcat:focus-visible .hcat-photo img{transform:scale(1.03);}
.hcat-name{font-family:"LA Outfit",sans-serif;font-weight:700;font-size:1.15rem;margin-top:.9rem;}
.hcat-n{font-size:.875rem;color:var(--ink-soft);margin-top:.2rem;}
.hcat:hover .hcat-name{color:var(--accent);}
.harts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.4rem;}
.hart{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:3px;padding:1.5rem;color:var(--ink);background:#fff;transition:border-color .2s;}
.hart:hover{border-color:var(--accent);}
.hart h3{font-family:"LA Outfit",sans-serif;font-weight:700;font-size:1.1rem;line-height:1.3;margin:0 0 .7rem;text-wrap:balance;}
.hart p{margin:0 0 1.2rem;color:var(--ink-soft);font-size:.9375rem;line-height:1.6;flex:1;}
.hart .link-arrow{align-self:flex-start;}
@media (max-width:1024px){
  .hsvc{grid-template-columns:repeat(2,minmax(0,1fr));}
  .hsteps{grid-template-columns:1fr;}
  .hsteps li{display:grid;grid-template-columns:3rem 1fr;column-gap:.4rem;border-top-width:1px;border-top-color:var(--line);}
  .hsteps li .n{grid-row:span 2;padding-top:.2rem;}
  .hsteps li h3{margin-top:0;}
  .hcats{grid-template-columns:repeat(2,minmax(0,1fr));}
  .harts{grid-template-columns:1fr;}
}
@media (max-width:560px){
  .hsvc{grid-template-columns:1fr;}
  .hcats{gap:1.4rem 1rem;}
  .hcat-name{font-size:1rem;}
}

/* ---------- A18: articles -- table of contents, byline, author ---------- */
.article-meta{margin:1rem 0 0;font-size:.875rem;color:var(--ink-soft);}
.article-meta a{color:var(--ink);border-bottom:1px solid var(--line);}
.article-meta a:hover{border-color:var(--accent);color:var(--accent);}
.article-layout{display:grid;grid-template-columns:minmax(0,42rem) minmax(0,17rem);justify-content:space-between;gap:3rem;}
.article-aside{order:2;padding:3rem 0;}
.toc{position:sticky;top:1.5rem;border-left:2px solid var(--line);padding:.2rem 0 .2rem 1.2rem;}
.toc-h{margin:0 0 .6rem;font-family:"LA Outfit",sans-serif;font-weight:700;font-size:.8125rem;letter-spacing:.08em;text-transform:uppercase;}
.toc ol{list-style:none;margin:0;padding:0;}
.toc li{margin:0;}
.toc a{display:block;padding:.4rem 0;font-size:.9rem;line-height:1.4;color:var(--ink-soft);}
.toc a:hover{color:var(--accent);}
.article-main .article-body{padding-bottom:2rem;}
.article-body h2{scroll-margin-top:1.5rem;}
.article-author{border-top:1px solid var(--line);padding:1.6rem 0 3rem;max-width:42rem;}
.article-author .eyebrow{display:block;margin:0 0 .6rem;}
.article-author p{margin:0 0 .9rem;color:var(--ink-soft);}
.article-author b{color:var(--ink);}
@media (max-width:1024px){
  .article-layout{grid-template-columns:1fr;gap:0;}
  .article-aside{order:0;padding:2rem 0 0;}
  .toc{position:static;background:var(--panel);border-left:0;border-radius:3px;padding:1.2rem 1.3rem;}
  .toc a{min-height:44px;display:flex;align-items:center;padding:.2rem 0;}
  .article-main .article-body{padding-top:2.2rem;}
}

/* ---------- A17: portrait slot (used once images/martin-sarka.jpg exists) ---------- */
.team-photo.has-img{overflow:hidden;}
.team-photo.has-img::before,.team-photo.has-img::after{display:none;}
.team-photo.has-img img{width:100%;height:100%;object-fit:cover;display:block;}
/* TOC nav must not inherit the header nav look (uppercase, underline bar) */
.toc a{font-family:"LA Inter",sans-serif;text-transform:none;letter-spacing:0;font-weight:400;font-size:.9rem;color:var(--ink-soft);}
.toc a::after{display:none;}

/* =====================================================================
   P3 (2026-10-25): feedback round
   ===================================================================== */

/* ---------- Content width: wider grid, fluid gutters (was 1180 px fixed) ----------
   Grid up to 1360 px of content; gutters grow with the viewport (20 px on phones,
   ~5 vw on laptops, 80 px max). Running text keeps its own reading width. */
.wrap{max-width:calc(1360px + 2 * clamp(1.25rem,5vw,5rem));padding-left:clamp(1.25rem,5vw,5rem);padding-right:clamp(1.25rem,5vw,5rem);}

/* ---------- Heading underline: drawn under the letters, broken around descenders ----------
   (was a border under the whole line box, which sat below the descenders) */
:is(.hero,.ppage-hero,.blog-hero,.legal-hero,.article-hero,body) h1 .acc{
  display:inline;border-bottom:0;padding-bottom:0;
  text-decoration-line:underline;text-decoration-color:var(--accent);
  text-decoration-thickness:max(2px,.055em);text-underline-offset:.13em;
  text-decoration-skip-ink:auto;-webkit-box-decoration-break:clone;box-decoration-break:clone;
}

/* ---------- Page heads without eyebrow: keep the rhythm under the header ---------- */
.hero > div > h1:first-child,.ppage-hero h1:first-child,.blog-hero h1:first-child,.legal-hero h1:first-child{margin-top:.5rem;}

/* ---------- Compact footer (replaces the four-column footer) ---------- */
footer.site-compact{padding:2rem 0 1.4rem;}
.foot-row{display:flex;align-items:center;justify-content:space-between;gap:1rem 2.5rem;flex-wrap:wrap;}
.foot-logo{display:inline-flex;align-items:center;min-height:44px;flex:none;}
.foot-logo img{width:130px;height:auto;}
.foot-nap{margin:0;font-size:.875rem;line-height:1.6;color:var(--ink-soft);text-align:right;}
.foot-nap span{white-space:nowrap;}
.foot-nap a{color:var(--ink);}
.foot-nap a:hover{color:var(--accent);}
.foot-sep{color:var(--ink-soft);opacity:.45;padding:0 .45rem;}
.foot-bottom{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:.2rem 1.5rem;margin-top:1.2rem;padding-top:.6rem;border-top:1px solid var(--line);}
.foot-row + .foot-bottom{margin-top:1.2rem;}
footer.site-compact > .foot-bottom:first-child{margin-top:0;border-top:0;padding-top:0;}
.foot-links{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:0 1.4rem;}
.foot-links a{display:inline-flex;align-items:center;min-height:44px;font-size:.875rem;color:var(--ink-soft);}
.foot-links a:hover{color:var(--accent);}
@media (max-width:760px){
  .foot-nap{text-align:left;}
  .foot-nap span{display:block;white-space:normal;}
  .foot-nap .foot-sep{display:none;}
}

/* ---------- Section rhythm: spacing that was missing (measured on all pages) ---------- */
/* last section before the dark "Máte projekt?" band (O nás, Cenník FAQ, ...) */
.wrap:has(+ section.cta) > section:last-child{padding-bottom:clamp(3.5rem,7vw,5.5rem);}
/* Cenník: calculator heading sat 13-15 px under the grey price panel */
.pricing + .calc-teaser{padding-top:clamp(2.5rem,5vw,4rem);}
/* Kontakt, GDPR: first heading sat 15 px under the dividing line */
.kontakt,.legal{padding-top:clamp(2rem,4vw,3rem);}

/* ---------- F4: responsive images -- <picture> adds no box, the <img> keeps its layout ---------- */
picture{display:contents;}

/* ---------- F4: portal mock-up text contrast (WCAG AA) ---------- */
.portal-mock .portal-tblock .pill{color:#7D4A1F;}
.portal-mock .portal-panel .row span{color:var(--ink-soft);}

/* ---------- F5: Služby -- service arrows always visible (were hover-only, hidden on phones) ---------- */
.srow .go{opacity:1;color:var(--accent);font-size:1.15rem;border-bottom:0;transition:transform .2s;}
.srow:hover .go,.srow .go:focus-visible{transform:translateX(4px);}
@media (max-width:760px){
  .srow{position:relative;}
  .srow h3,.srow p{padding-right:2.75rem;}
  .srow .go{display:inline-flex;position:absolute;right:0;top:50%;transform:translateY(-50%);
    min-width:44px;min-height:44px;align-items:center;justify-content:flex-end;}
  .srow:hover .go,.srow .go:focus-visible{transform:translateY(-50%);}
}

/* ---------- F5: desktop menu -- items and the Cenová ponuka button centred on one line ---------- */
@media (min-width:1025px){
  header nav ul{align-items:center;}
  header nav li{display:flex;align-items:center;}
}

/* ---------- F5: 404 page ---------- */
.notfound-links{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.5rem 2rem;}
.notfound-links a{display:inline-flex;align-items:center;min-height:44px;}

/* ---------- F5: Služby -- arrow touch target 44 px on every width ---------- */
.srow .go{display:inline-flex;min-width:44px;min-height:44px;align-items:center;justify-content:flex-end;}
