/*
Theme Name: Vypleteno.cz 0.9.3 Media Polish
Author: Pavel Bachman / Vypleteno.cz
Description: Lehký WordPress motiv s běžnými WordPress stránkami a bez JS přepínání obsahu.
Version: 0.9.3
Text Domain: vypleteno
*/

:root{--ink:#211C57;--muted:#6f6a64;--paper:#fbfaf7;--line:#ded8cf;--accent:#F57139;--soft:#f3efe9;--max:1180px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:'Trebuchet MS', Arial, sans-serif;line-height:1.58}
.wrap{max-width:var(--max);margin:auto;padding:0 28px}a{color:inherit}
header{position:sticky;top:0;z-index:10;border-bottom:1px solid var(--line);background:rgba(251,250,247,.97)}
.nav{min-height:78px;display:flex;align-items:center;justify-content:space-between;gap:28px}
.brand{text-decoration:none;font-weight:700;font-size:22px;line-height:1;cursor:pointer}.brand small{display:block;font-size:10px;letter-spacing:3px;font-weight:400;color:var(--accent);margin-top:7px}
nav{display:flex;gap:24px;font-size:14px;align-items:center}nav a{text-decoration:none;cursor:pointer}nav a:hover,.active{color:var(--accent)}
.menu{display:none;border:0;background:none;font-size:26px}
.page{display:none}.page.active-page{display:block}
.hero{padding:84px 0 88px}.hero-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:72px;align-items:center}
.pagehead{padding:92px 0 66px}.ey{text-transform:uppercase;letter-spacing:1.4px;color:var(--accent);font-size:20px;font-weight:700;margin-bottom:14px}
h1{font-size:clamp(44px,5.5vw,76px);line-height:1.04;letter-spacing:-2.4px;margin:0 0 24px}h2{font-size:clamp(28px,3.2vw,43px);line-height:1.15;letter-spacing:-1.2px;margin:0 0 20px}
.lead{font-size:20px;max-width:780px}.motto{font-size:21px;margin:0 0 24px}.location{font-size:16px;margin:0 0 30px}
.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}.btn{display:inline-block;text-decoration:none;border:1px solid var(--ink);padding:13px 20px;font-size:13px;font-weight:700;cursor:pointer}.btn.primary{background:var(--ink);color:#fff}
.portrait{width:min(390px,100%);aspect-ratio:1;border-radius:50%;overflow:hidden;border:1.5px solid var(--accent);justify-self:end;background:var(--soft);transform:translateY(-80px)}.portrait img{width:100%;height:100%;object-fit:cover;object-position:48% 42%}
section{padding:82px 0;border-top:1px solid var(--line)}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:64px}.home-services h2{font-size:clamp(27px,2.65vw,36px)}.soft{background:var(--soft)}.center{text-align:center}
.link{display:inline-block;text-decoration:none;font-weight:700;border-bottom:1px solid var(--accent);margin-top:10px;cursor:pointer}
.price{font-size:42px;font-weight:700;line-height:1.05;margin:4px 0 8px}.note,.sub{font-size:14px;color:var(--muted)}
.quote-wrap{max-width:860px;margin:0 auto;text-align:center}.mobile-break{display:none}.desktop-space{display:inline}.quote-intro{font-size:17px;color:var(--muted);margin-bottom:18px}.quote{font-size:clamp(32px,4.5vw,58px);line-height:1.12;font-weight:700;letter-spacing:-1.5px;margin:0}
.narrow,.story{max-width:850px}.card{padding:36px;border:1px solid var(--line);background:#fff}.card.primary{background:var(--soft)}
.video{aspect-ratio:16/9;border:1px solid var(--line);background:var(--soft);display:grid;place-items:center;text-align:center;color:var(--muted)}
.price-row{display:grid;grid-template-columns:1fr auto;gap:20px;padding:20px 0;border-bottom:1px solid var(--line);align-items:baseline}.price-row:first-of-type{border-top:1px solid var(--line)}.price-row strong{font-size:20px;white-space:nowrap}
.map{min-height:300px;background:var(--soft);border:1px solid var(--line);display:grid;place-items:center;text-align:center;color:var(--muted)}
footer{border-top:1px solid var(--line);padding:32px 0;color:var(--muted);font-size:13px}.foot{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}
@media(max-width:820px){.wrap{padding:0 20px}.nav{min-height:68px}.menu{display:block}nav{display:none;position:absolute;left:0;right:0;top:68px;background:var(--paper);padding:20px;border-bottom:1px solid var(--line);flex-direction:column;align-items:flex-start}nav.open{display:flex}.hero{padding:56px 0 64px}.hero-grid,.grid2{grid-template-columns:1fr;gap:34px}.portrait{justify-self:center;width:min(290px,78vw);transform:none}.hero .motto{font-size:15px;white-space:nowrap}.hero .location{font-size:13px;white-space:nowrap}.hero .actions{display:grid;grid-template-columns:1fr;width:100%}.hero .actions .btn{width:100%;text-align:center}.pagehead{padding:62px 0 46px}section{padding:60px 0}h1{letter-spacing:-1.7px}.home-services h2{font-size:clamp(28px,3.2vw,43px)}
.home-pricing .ey{font-size:31px;letter-spacing:1.2px;margin-bottom:10px;line-height:1.1}
.home-pricing .pricing-condition{font-size:28px;margin:0 0 5px}
.home-pricing .pricing-amount{font-size:31px!important;margin:0}
.home-pricing .pricing-item{padding:8px 0 28px}
.home-pricing .pricing-item + .pricing-item{border-top:1px solid var(--line);padding-top:30px}.mobile-break{display:block}.desktop-space{display:none}
.home-contact-actions{display:grid;grid-template-columns:1fr 1fr;gap:12px;width:100%}
.home-contact-actions .btn{width:100%;text-align:center;padding-left:8px;padding-right:8px}

.price-row{gap:12px}.price-row strong{font-size:18px}}

.brand-d2{display:flex;align-items:center;width:210px;height:58px}
.brand-d2 img{display:block;width:100%;height:100%;object-fit:contain;object-position:left center}
@media(max-width:820px){.brand-d2{width:165px;height:48px}}

.page{display:block!important}
@media(max-width:820px){
  .menu{display:none!important}
  nav{display:flex!important}
}



/* 0.4.0 — navigation only; no page switching */
.menu-toggle{
  display:none;
  border:0;
  background:transparent;
  color:var(--ink);
  font-size:30px;
  line-height:1;
  padding:8px;
  cursor:pointer;
}
.story-link-wrap{padding-top:0;padding-bottom:50px}
.story-link{
  color:var(--accent);
  text-decoration:none;
  font-weight:700;
  font-size:18px;
}
.story-link:hover{text-decoration:underline}

@media(max-width:820px){
  .nav{
    position:relative;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
  }
  .menu-toggle{display:block}
  #primary-nav{
    display:none !important;
    position:absolute;
    left:0;
    right:0;
    top:100%;
    z-index:1000;
    background:var(--paper);
    border-top:1px solid var(--line);
    border-bottom:1px solid var(--line);
    padding:12px 24px 18px;
    box-shadow:0 10px 24px rgba(0,0,0,.06);
  }
  #primary-nav.is-open{
    display:flex !important;
    flex-direction:column;
    align-items:flex-start;
    gap:0;
  }
  #primary-nav a{
    width:100%;
    padding:12px 0;
  }
}


/* ==========================================================
   0.6.0 — Native WordPress / Gutenberg pages
   Existing handcrafted pages keep their original .page styles.
   ========================================================== */
.wp-page { padding: 48px 0 72px; }
.wp-content {
  width: min(860px, calc(100% - 40px));
  margin: 0 auto;
}
.wp-content > * { margin-top: 0; margin-bottom: 1.15em; }
.wp-content h1 { margin-bottom: .65em; }
.wp-content h2 { margin-top: 1.8em; margin-bottom: .65em; }
.wp-content h3 { margin-top: 1.5em; margin-bottom: .55em; }
.wp-content p, .wp-content li { line-height: 1.7; }
.wp-content img { max-width: 100%; height: auto; border-radius: 18px; }
.wp-content figure { margin-left: 0; margin-right: 0; }
.wp-content figcaption { font-size: .9rem; opacity: .72; margin-top: .45rem; }
.wp-content .alignwide {
  width: min(1100px, calc(100vw - 40px));
  max-width: none;
  margin-left: 50%;
  transform: translateX(-50%);
}
.wp-content .alignfull {
  width: 100vw;
  max-width: none;
  margin-left: 50%;
  transform: translateX(-50%);
}
.wp-content .wp-block-button__link {
  text-decoration: none;
  border-radius: 999px;
  padding: .75em 1.2em;
}
@media (max-width: 640px) {
  .wp-page { padding-top: 30px; }
  .wp-content { width: min(100% - 28px, 860px); }
}


/* 0.6.1 — editable content presentation */
.wp-content > h1:first-child,
.wp-content > .wp-block-heading:first-child {
  margin-top: 0;
}
.wp-content .wp-block-heading + p {
  max-width: 760px;
}
.wp-content hr,
.wp-content .wp-block-separator {
  margin: 2.4rem 0;
  opacity: .22;
}


/* 0.7.2 — extra Gutenberg blocks must never disappear */
.vypleteno-extra-content {
  padding-top: 0;
  padding-bottom: 52px;
}
.vypleteno-extra-content .wp-content {
  width: 100%;
  margin: 0;
}

/* 0.8.1 kolaudační typografie */
.facade-home .note{font-size:20px!important;line-height:1.45}
.facade-home .soft .wrap>p:last-child{font-size:28px!important;line-height:1.35}
/* redakční pomocné skupiny jsou na webu zpracované fasádou, ne jako extra obsah */

/* 0.8.2: special editorial fields are editor controls, not front-end blocks. */
.vy082-special{display:none!important}

/* 0.8.3 native editorial panels are content controls, not duplicate front-end content */
.vy-editor-panel{display:none!important}

/* 0.8.4 — editor-only panels never appear on frontend */
body:not(.wp-admin) .vy-editor-panel,
body:not(.wp-admin) .vy-editor-controls,
body:not(.wp-admin) .vy082-special{display:none!important}

/* 0.8.7 — Můj příběh: kicker + heading as one visual unit */
.story-title-group{
  margin-bottom: 22px;
}
.story-title-group .ey{
  margin-bottom: 8px;
}
.story-title-group h2{
  margin-top: 0;
  margin-bottom: 0;
}

/* 0.8.8 — final alignment of Můj příběh title group */
.facade-pribeh .story-title-group,
.story-title-group{
  display:block !important;
  width:100% !important;
  max-width:none !important;
  margin:0 0 22px 0 !important;
  padding:0 !important;
  text-align:left !important;
  justify-self:stretch !important;
  align-self:stretch !important;
  grid-column:1 / -1 !important;
}
.facade-pribeh .story-title-group .ey,
.story-title-group .ey{
  display:block !important;
  width:auto !important;
  margin:0 0 8px 0 !important;
  text-align:left !important;
}
.facade-pribeh .story-title-group h2,
.story-title-group h2{
  display:block !important;
  width:100% !important;
  margin:0 !important;
  padding:0 !important;
  text-align:left !important;
}

/* 0.8.9 — Můj příběh title uses the same centered content column as service pages */
.facade-pribeh .story-title-group,
.story-title-group{
  box-sizing:border-box !important;
  width:100% !important;
  max-width:1100px !important;
  margin-left:auto !important;
  margin-right:auto !important;
  padding-left:24px !important;
  padding-right:24px !important;
  text-align:left !important;
  grid-column:auto !important;
}
@media (max-width:700px){
  .facade-pribeh .story-title-group,
  .story-title-group{
    padding-left:18px !important;
    padding-right:18px !important;
  }
}

/* 0.9.0 — story intro deliberately inherits the SAME system as service page intros */
.story-title-like-service{
  width:auto !important;
  max-width:none !important;
  margin-left:auto !important;
  margin-right:auto !important;
  padding-left:0 !important;
  padding-right:0 !important;
  text-align:inherit !important;
  display:block !important;
  grid-column:auto !important;
}
.story-title-like-service .ey{
  width:auto !important;
  max-width:none !important;
  text-align:inherit !important;
}
.story-title-like-service h2{
  width:auto !important;
  max-width:none !important;
  padding:0 !important;
  text-align:inherit !important;
  font:inherit;
}
/* Match the service page title's heading typography exactly via the same values
   used by the theme's pagehead title rule. */
.story-title-like-service h2{
  font-family:var(--font-display, inherit) !important;
  color:var(--navy, #17324d) !important;
}

/* 0.9.1 — no custom typography: inherit exact service pagehead rules */
.story-dovazovani-clone{
  margin-left:auto !important;
  margin-right:auto !important;
}
.story-dovazovani-clone .ey{
  /* intentionally no custom font/color/size */
}
.story-dovazovani-clone h1{
  /* intentionally no custom font/color/size */
}

/* 0.9.2 — same mobile side breathing room as homepage */
@media (max-width:700px){
  .page:not(.home-page) .wrap,
  .active-page:not(.home-page) .wrap{
    box-sizing:border-box !important;
    width:100% !important;
    max-width:100% !important;
    padding-left:24px !important;
    padding-right:24px !important;
  }
  .page:not(.home-page) .wrap .wrap,
  .active-page:not(.home-page) .wrap .wrap{
    padding-left:0 !important;
    padding-right:0 !important;
  }
}

/* 0.9.3 — video always fills its existing 16:9 container */
.page .video video,
.active-page .video video{
  display:block;
  width:100% !important;
  height:auto !important;
  aspect-ratio:16 / 9;
  object-fit:cover;
}

/* Editorial photo panel remains editor-only; facade renders the real portrait. */
.vy093-home-photo-panel{
  display:none !important;
}