/* ===== Vlastní styly: galerie, lightbox, recenze, přihlašovací lišta ===== */
:root{
  --mp-pink:#e84393;
  --mp-pink-d:#c93182;
  --mp-soft:#fdeef4;
  --mp-ink:#4a4a4a;
}

/* ---- horní lišta s přihlášením (vpravo nahoře) ---- */
.mp-topbar{position:fixed;top:10px;right:12px;z-index:99999;display:flex;gap:8px}
.mp-topbar-btn{
  font-family:system-ui,'Segoe UI',Arial,sans-serif;font-size:13px;font-weight:600;
  background:rgba(232,67,147,.92);color:#fff;padding:7px 14px;border-radius:999px;
  text-decoration:none;box-shadow:0 4px 14px rgba(232,67,147,.35);backdrop-filter:blur(2px);
  transition:transform .15s,background .15s;line-height:1
}
.mp-topbar-btn:hover{background:var(--mp-pink-d);transform:translateY(-1px);color:#fff}
.mp-topbar-ghost{background:rgba(255,255,255,.92);color:var(--mp-pink-d);box-shadow:0 4px 14px rgba(0,0,0,.12)}

/* ---- společný kontejner (širší) ---- */
.mp-container{max-width:1180px;margin:0 auto;padding:0 20px}

/* ===== Galerie „Ukázky mojí práce" ===== */
.mp-gallery-section{padding:30px 0 50px}
.mp-gallery-section .mp-gallery-title{
  font-family:'playwrite-us-trad', sans-serif !important;  /* stejný font jako „Co na nás říkají zákazníci" */
  font-size:36px !important;
  font-weight:400 !important;
  font-style:normal !important;
  color:var(--mp-pink);text-align:center;margin:0 0 28px;line-height:1.3
}
@media(max-width:600px){.mp-gallery-section .mp-gallery-title{font-size:28px !important}}
.mp-gallery-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:26px
}
.mp-card{
  margin:0;background:#fff;border-radius:16px;overflow:hidden;cursor:pointer;
  box-shadow:0 6px 20px rgba(0,0,0,.08);transition:transform .2s,box-shadow .2s;
  display:flex;flex-direction:column;border:1px solid #f3e3ec
}
.mp-card:hover,.mp-card:focus{transform:translateY(-5px);box-shadow:0 14px 32px rgba(232,67,147,.22);outline:none}
.mp-card-imgwrap{position:relative;width:100%;aspect-ratio:4/5;overflow:hidden;background:#f6eaf1}
.mp-card-imgwrap img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .35s}
.mp-card:hover .mp-card-imgwrap img{transform:scale(1.06)}
.mp-card-cap{
  padding:13px 14px;font-family:system-ui,'Segoe UI',Arial,sans-serif;
  font-size:15px;color:var(--mp-ink);text-align:center;font-weight:500
}
.mp-empty{text-align:center;color:#b39;opacity:.6}

/* ===== Lightbox ===== */
.mp-lightbox{position:fixed;inset:0;z-index:100000;display:none;align-items:center;justify-content:center;padding:20px}
.mp-lightbox.open{display:flex}
.mp-lightbox-backdrop{position:absolute;inset:0;background:rgba(40,20,30,.82);backdrop-filter:blur(3px)}
.mp-lightbox-dialog{
  position:relative;background:#fff;border-radius:18px;max-width:1150px;width:96vw;
  max-height:96vh;display:flex;flex-direction:column;padding:16px;overflow:hidden;
  box-shadow:0 24px 70px rgba(0,0,0,.5);animation:mpPop .22s ease
}
@keyframes mpPop{from{transform:scale(.93);opacity:0}to{transform:scale(1);opacity:1}}
.mp-lightbox-stage{
  position:relative;flex:1 1 auto;min-height:240px;overflow:hidden;border-radius:12px;
  background:#f6eaf1;display:flex;align-items:center;justify-content:center;touch-action:none
}
.mp-lightbox-img{
  max-width:100%;max-height:74vh;width:auto;height:auto;object-fit:contain;display:block;cursor:zoom-in;
  transform-origin:center center;will-change:transform;
  user-select:none;-webkit-user-select:none;-webkit-user-drag:none
}
.mp-lightbox-img.zoomed{cursor:grab}
.mp-lightbox-img.dragging{cursor:grabbing}
.mp-lightbox-hint{color:#a98ca0;font-size:13px;text-align:center;margin-top:10px}
.mp-lightbox-title{font-family:'playwrite-us-trad','Segoe Script',cursive;color:var(--mp-pink);font-size:26px;font-weight:400;margin:16px 6px 6px;text-align:center}
.mp-lightbox-desc{font-family:system-ui,'Segoe UI',Arial,sans-serif;color:var(--mp-ink);font-size:16px;line-height:1.6;margin:0 8px 8px;text-align:center;white-space:pre-wrap;max-height:16vh;overflow:auto}
.mp-lightbox-close{
  position:absolute;top:10px;right:14px;width:40px;height:40px;border-radius:50%;
  border:none;background:rgba(0,0,0,.45);color:#fff;font-size:26px;line-height:1;cursor:pointer;z-index:2
}
.mp-lightbox-close:hover{background:var(--mp-pink)}

/* ===== Recenze ===== */
.mp-reviews{padding:10px 0 30px}
.mp-reviews-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;margin-bottom:30px}
.mp-review{
  background:#fff;border-radius:16px;padding:22px;box-shadow:0 6px 20px rgba(0,0,0,.07);
  border:1px solid #f3e3ec;display:flex;flex-direction:column
}
.mp-stars{color:#f5b301;letter-spacing:3px;font-size:18px;margin-bottom:8px}
.mp-stars .mp-star{opacity:.28}
.mp-stars .mp-star.on{opacity:1}
.mp-review-text{color:var(--mp-ink);font-size:16px;line-height:1.6;flex:1}
.mp-review-name{margin-top:12px;font-weight:700;color:var(--mp-pink-d)}
.mp-review-reply{margin-top:14px;background:var(--mp-soft);border-radius:10px;padding:12px 14px;font-size:15px;color:#5a4450}
.mp-reply-label{color:var(--mp-pink-d);font-weight:700}

/* formulář recenze – oddělené od navigačních tlačítek recenzí */
.mp-review-form-wrap{text-align:center;margin-top:46px;padding-top:32px;border-top:1px solid #f0d9e6}
.mp-btn{
  display:inline-block;background:var(--mp-pink);color:#fff;border:none;border-radius:999px;
  padding:13px 30px;font-size:16px;font-weight:600;cursor:pointer;font-family:system-ui,'Segoe UI',Arial,sans-serif;
  transition:background .15s,transform .15s;text-decoration:none
}
.mp-btn:hover{background:var(--mp-pink-d);transform:translateY(-1px);color:#fff}
.mp-review-form{
  max-width:560px;margin:22px auto 0;background:#fff;border-radius:16px;padding:26px;
  box-shadow:0 8px 26px rgba(0,0,0,.1);text-align:left;border:1px solid #f3e3ec
}
.mp-field{margin-bottom:16px}
.mp-field label{display:block;font-weight:600;margin-bottom:7px;color:var(--mp-ink);font-family:system-ui,'Segoe UI',Arial,sans-serif}
.mp-field input[type=text],.mp-field textarea{
  width:100%;padding:12px 14px;border:1.5px solid #eccada;border-radius:10px;font-size:15px;
  font-family:system-ui,'Segoe UI',Arial,sans-serif;box-sizing:border-box
}
.mp-field input:focus,.mp-field textarea:focus{outline:none;border-color:var(--mp-pink)}
.mp-star-input{display:inline-flex;gap:4px;font-size:30px;cursor:pointer;user-select:none}
.mp-star-input .mp-star{color:#ddd;transition:color .1s}
.mp-star-input .mp-star.on{color:#f5b301}
.mp-hp{position:absolute !important;left:-9999px !important;width:1px;height:1px;opacity:0}
.mp-flash{
  max-width:560px;margin:0 auto 22px;background:#eafaf0;color:#1e8e4e;border-radius:12px;
  padding:14px 18px;text-align:center;font-size:16px;font-weight:600
}

@media(max-width:900px){.mp-gallery-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){
  .mp-gallery-grid{grid-template-columns:repeat(2,1fr);gap:14px}
}

/* ---- zobrazit více / méně (galerie i recenze) ---- */
.mp-card.mp-hidden,.mp-review.mp-hidden{display:none}
.mp-btn[hidden]{display:none}   /* aby atribut hidden fungoval i na tlačítkách */
.mp-gallery-actions,.mp-reviews-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:30px}
.mp-btn-ghost{background:#fff;color:var(--mp-pink-d);border:2px solid var(--mp-pink)}
.mp-btn-ghost:hover{background:var(--mp-soft);color:var(--mp-pink-d)}

/* ---- průměrné hodnocení recenzí ---- */
.mp-reviews-summary{display:flex;flex-direction:column;align-items:center;gap:4px;margin:0 auto 28px}
.mp-avg-line{display:flex;align-items:baseline;gap:8px}
.mp-avg-num{font-size:46px;font-weight:800;color:var(--mp-pink);line-height:1}
.mp-avg-out{font-size:20px;color:#a98ca0;font-weight:600}
.mp-avg-stars{color:#f5b301;letter-spacing:2px;font-size:22px}
.mp-avg-stars .mp-star{opacity:.28}
.mp-avg-stars .mp-star.on{opacity:1}
.mp-avg-count{color:#a98ca0;font-size:14px}

/* ===== Odkazy na sociální sítě (patička) ===== */
.mp-social{display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap;margin:0}
.mp-social-link{
  display:inline-flex;align-items:center;justify-content:center;
  width:46px;height:46px;border-radius:50%;color:#fff;
  box-shadow:0 5px 16px rgba(0,0,0,.18);
  transition:transform .18s ease,box-shadow .18s ease,filter .18s ease;
  text-decoration:none
}
.mp-social-link svg{width:22px;height:22px;display:block}
.mp-social-link:hover{transform:translateY(-3px) scale(1.06);box-shadow:0 10px 24px rgba(0,0,0,.28);filter:brightness(1.06);color:#fff}
.mp-social-link:focus-visible{outline:3px solid rgba(232,67,147,.55);outline-offset:3px}
.mp-social-facebook{background:#1877f2}
.mp-social-instagram{background:radial-gradient(circle at 30% 107%,#fdf497 0%,#fdf497 5%,#fd5949 45%,#d6249f 60%,#285aeb 90%)}

/* ===== Jemné naběhnutí prvků při scrollu (reveal on scroll) ===== */
@media (prefers-reduced-motion: no-preference){
  .mp-reveal{opacity:0;transform:translateY(28px);transition:opacity .7s cubic-bezier(.22,.61,.36,1),transform .7s cubic-bezier(.22,.61,.36,1);will-change:opacity,transform}
  .mp-reveal.is-visible{opacity:1;transform:none}
  /* tlačítko „Napsat recenzi" – naběhne s jemným poskočením */
  .mp-reveal-pop{opacity:0;transform:translateY(18px) scale(.92);transition:opacity .5s ease,transform .6s cubic-bezier(.34,1.56,.64,1);will-change:opacity,transform}
  .mp-reveal-pop.is-visible{opacity:1;transform:none}
  /* galerie – karty naskáčou postupně (po dojetí JS třídu odebere kvůli rychlému hoveru) */
  .mp-reveal-stagger .mp-card{opacity:0;transform:translateY(26px) scale(.98)}
  .mp-reveal-stagger.is-visible .mp-card{opacity:1;transform:none;transition:opacity .6s ease,transform .6s cubic-bezier(.22,.61,.36,1)}
}

/* ---- Mobil/tablet (hamburger menu ≤1024px): přihlašovací tlačítko jako plovoucí bublina dole-vpravo, ať nepřekrývá menu ---- */
@media(max-width:1024px){
  .mp-topbar{top:auto;left:auto;right:16px;bottom:16px;flex-direction:column;align-items:flex-end;gap:10px;z-index:9999}
  .mp-topbar-btn{font-size:14px;padding:11px 18px;box-shadow:0 8px 22px rgba(232,67,147,.45)}
  .mp-topbar-ghost{box-shadow:0 8px 22px rgba(0,0,0,.18)}
}