/* ============================================================
   STUDIO.CSS — studio-specifické overrides nad new-airy.css
   (kostra a tokeny převzaté z maserapp.cz, přebarvené do rose;
   tady jen věci, které se od předlohy liší strukturálně)
   ============================================================ */

/* ── Hero: skleněné kapsle jako CSS (žádné webp rendery) ──
   POZOR: display neřešit tady — mobilní skrytí (≤760) přichází z new-airy,
   desktop flex až v @media(min-width:761px) níž, jinak by se kapsle
   ukázaly i na telefonu. */
.hero-cap{flex-direction:column;gap:7px;background:rgba(255,255,255,.78);-webkit-backdrop-filter:blur(14px) saturate(1.3);backdrop-filter:blur(14px) saturate(1.3);border:1px solid rgba(255,255,255,.9);border-radius:18px;padding:13px 15px;box-shadow:0 24px 60px rgba(43,27,44,.22),inset 0 1px 0 rgba(255,255,255,.9)}
.cap-cal{z-index:4}
.cap-head{display:flex;align-items:center;gap:7px;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#9F404D}
.cap-head svg{flex:0 0 14px}
.cap-row{display:flex;align-items:center;gap:8px;font-size:12.5px;font-weight:700;color:#2A181D;line-height:1.25}
.cap-row .cap-time{flex:0 0 auto;font-size:11px;font-weight:800;color:#9F404D;background:#FFF3F5;border:1px solid #F8E7EA;border-radius:999px;padding:2px 7px}
.cap-row .cap-sub{display:block;font-size:11px;font-weight:600;color:#6F6268}
.cap-stars{font-size:14px;letter-spacing:2px;color:#f4ab00}
.cap-quote{font-size:12.5px;font-weight:700;color:#2A181D;line-height:1.35}
.cap-quote em{display:block;font-style:normal;font-size:11px;font-weight:600;color:#6F6268;margin-top:3px}
.cap-ntf-app{display:flex;align-items:center;gap:7px}
.cap-ntf-app img{width:20px;height:20px;border-radius:6px}
.cap-ntf-app b{font-size:11.5px;font-weight:800;color:#2A181D}
.cap-ntf-app span{margin-left:auto;font-size:10px;font-weight:700;color:#6F6268}
/* mobilní kapsle u #proc jsou stejné divy */
.cap-m.hero-cap{display:none}
@media(max-width:760px){
  .cap-m.hero-cap{display:flex;position:absolute;z-index:2;pointer-events:none;height:auto;animation:capFloat 7s ease-in-out infinite}
  .cap-cal-m{left:6%;top:-92px;width:clamp(150px,44vw,190px)}
  .cap-voice-m{right:5%;top:-64px;width:clamp(150px,44vw,190px)}
}
/* desktop/tablet: kapsle jako flex (přebije display:block z new-airy tablet-portrait pravidla);
   mobilní skrytí (≤760) z new-airy zůstává netknuté */
@media(min-width:761px){.hero-cap.cap-voice,.hero-cap.cap-cal,.hero-cap.cap-map{display:flex}}
@media(min-width:761px) and (max-width:1024px) and (orientation:portrait){.hero-cap.cap-map{display:none}}

/* ── Důvod 1: telefon s reálným screenshotem bookingu ── */
.rez-phone{background:#1E171B;padding:7px;border-radius:32px}
.rez-phone img{border-radius:24px;transform:none;object-fit:cover;object-position:center top}

/* ── Důvod 2: reálné screenshoty místo webp mockupů ── */
.mock.tablet,.mock.phone{border-radius:22px;border:7px solid #1E171B;background:#1E171B;box-shadow:0 30px 70px rgba(43,27,44,.28)}
.mock.phone{border-radius:28px}

/* ── Důvod 4: recenzní karta (CSS-only) ── */
.rev-card{position:relative;background:#fff;border:1px solid var(--line);border-radius:24px;padding:22px 22px 18px;box-shadow:0 30px 70px rgba(43,27,44,.16);max-width:420px;margin:0 auto}
.rev-head{display:flex;align-items:center;gap:10px;padding-bottom:13px;border-bottom:1px solid #F8E7EA;margin-bottom:14px}
.rev-head .rev-score{font-size:26px;font-weight:900;color:#2A181D;letter-spacing:-.03em}
.rev-head .rev-stars{color:#f4ab00;font-size:15px;letter-spacing:2px}
.rev-head .rev-count{margin-left:auto;font-size:11.5px;font-weight:700;color:#6F6268}
.rev-item{padding:11px 13px;border:1px solid #F8E7EA;border-radius:15px;background:#FFF9FA;margin-bottom:9px}
.rev-item .ri-stars{color:#f4ab00;font-size:12px;letter-spacing:1.6px}
.rev-item p{margin:5px 0 4px;font-size:13px;line-height:1.45;color:#453740;font-weight:600}
.rev-item .ri-who{display:flex;align-items:center;gap:6px;font-size:11px;font-weight:800;color:#2A181D}
.rev-item .ri-check{display:inline-flex;align-items:center;gap:3px;color:#9F404D;font-weight:700}
.rev-item .ri-check svg{width:11px;height:11px}
.rev-foot{text-align:center;font-size:11px;font-weight:700;color:#6F6268;padding-top:4px}

/* ── 7 dalších: provozovny karta ── */
.fcard.locs{display:flex;flex-direction:column;gap:8px}
.loc-row{display:flex;align-items:center;gap:9px;padding:8px 10px;border:1px solid #F8E7EA;border-radius:12px;background:#FFF9FA}
.loc-row svg{flex:0 0 15px;color:#9F404D}
.loc-row b{display:block;font-size:12.5px;color:#2A181D;font-weight:800}
.loc-row span{display:block;font-size:11px;color:#6F6268;font-weight:600}
.loc-row .loc-day{margin-left:auto;font-size:10px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:#9F404D;background:#FFF3F5;border-radius:999px;padding:3px 8px;border:1px solid #F8E7EA}

/* ── 7 dalších: AI asistent karta ── */
.fcard.ai{display:flex;flex-direction:column;gap:8px}
.ai-cmd{display:flex;gap:9px;align-items:flex-start}
.ai-cmd .ai-mic{flex:0 0 26px;width:26px;height:26px;border-radius:999px;background:linear-gradient(135deg,#C55C63,#9F404D);display:flex;align-items:center;justify-content:center;color:#fff}
.ai-cmd .ai-mic svg{width:13px;height:13px}
.ai-cmd p{margin:0;font-size:12.5px;line-height:1.4;color:#2A181D;font-weight:700;font-style:italic}
.ai-res{font-size:11.5px;font-weight:700;color:#9F404D;padding-left:35px}

/* ── Dostupnost: kompozice 3 reálných zařízení (CSS) ── */
.device-trio{position:relative;display:flex;align-items:flex-end;justify-content:center;gap:0;margin:34px auto 10px;max-width:980px}
.dt-laptop{position:relative;z-index:1;width:66%;border-radius:14px 14px 0 0;border:10px solid #1E171B;border-bottom:0;background:#1E171B;box-shadow:0 40px 90px rgba(43,27,44,.24)}
.dt-laptop img{display:block;width:100%;height:auto;border-radius:6px 6px 0 0}
.dt-laptop:after{content:"";position:absolute;left:-6%;right:-6%;bottom:-12px;height:12px;background:linear-gradient(180deg,#2C2026,#1E171B);border-radius:0 0 14px 14px}
.dt-tablet{position:relative;z-index:2;width:30%;margin-left:-8%;margin-bottom:-6px;border-radius:18px;border:8px solid #1E171B;background:#1E171B;box-shadow:0 34px 70px rgba(43,27,44,.3)}
.dt-tablet img{display:block;width:100%;height:auto;border-radius:10px}
.dt-phone{position:relative;z-index:3;width:15%;margin-left:-6%;margin-bottom:-10px;border-radius:22px;border:6px solid #1E171B;background:#1E171B;box-shadow:0 28px 60px rgba(43,27,44,.34)}
.dt-phone img{display:block;width:100%;height:auto;border-radius:16px}
@media(max-width:760px){
  .device-trio{flex-wrap:wrap;align-items:flex-end}
  .dt-laptop{width:100%}
  .dt-tablet{width:44%;margin-left:4%;margin-top:-30px}
  .dt-phone{width:24%;margin-left:-10%;margin-bottom:-4px}
}
/* tlačítko "Spustit aplikaci" místo store badges */
.web-badge{display:inline-flex;align-items:center;gap:10px;background:#1E171B;color:#fff;border-radius:14px;padding:11px 20px;font-weight:800;font-size:15px;text-decoration:none;box-shadow:0 18px 44px rgba(30,23,27,.3);transition:transform .18s ease,box-shadow .18s ease}
.web-badge:hover{transform:translateY(-2px);box-shadow:0 24px 54px rgba(30,23,27,.36)}
.web-badge svg{width:16px;height:16px}
.web-badge small{display:block;font-size:10.5px;font-weight:700;opacity:.75;line-height:1.1}
.web-badge .wb-txt{display:flex;flex-direction:column;align-items:flex-start;line-height:1.15}
.badge-note{display:inline-flex;align-items:center;gap:7px;margin-left:12px;font-size:12.5px;font-weight:800;color:#9F404D;background:#FFF3F5;border:1px solid #F8E7EA;border-radius:999px;padding:9px 14px}
@media(max-width:560px){.badge-note{margin-left:0;margin-top:10px}}

/* ── Trust band (místo testimonialu, dokud není reálná reference) ── */
.trust-facts{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.trust-fact{display:inline-flex;align-items:center;gap:8px;font-size:12.5px;font-weight:800;color:#2A181D;background:rgba(255,255,255,.7);border:1px solid rgba(159,64,77,.18);border-radius:999px;padding:9px 14px}
.trust-fact svg{width:13px;height:13px;color:#9F404D}

/* ── Hero: tmavý kontrastní závoj po vzoru původního webu ── */
.hero-veil{background:linear-gradient(92deg,rgba(28,17,21,.74) 0%,rgba(28,17,21,.52) 36%,rgba(28,17,21,.24) 64%,rgba(28,17,21,.10) 100%)}
.hero-photo h1{color:#fff;text-shadow:0 2px 26px rgba(0,0,0,.45),0 1px 3px rgba(0,0,0,.35);font-size:clamp(46px,5.2vw,76px);line-height:1.04;letter-spacing:-.035em}
.hero-photo h1 .hl2{color:#EBA9AF}
.hero-photo .hero-copy p{color:rgba(255,255,255,.95);text-shadow:0 1px 14px rgba(0,0,0,.5),0 1px 3px rgba(0,0,0,.4);max-width:560px;font-weight:600}
.hero-badge{display:inline-flex;align-items:center;gap:8px;margin-bottom:20px;font-size:13px;font-weight:800;letter-spacing:.01em;color:#fff;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.34);border-radius:999px;padding:8px 15px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);text-shadow:none}
.hero-badge svg{width:14px;height:14px;flex:0 0 14px}
.hero .actions .btn.run{background:linear-gradient(135deg,#C55C63,#9F404D);color:#fff;border:0}
.hero .actions .btn.run::after{background:linear-gradient(135deg,#C55C63,#9F404D)}
.hero .actions .btn.run .l1{color:#fff}
.hero .actions .btn.run .l2{color:rgba(255,255,255,.85)}
.hero .actions .btn.outline{background:rgba(255,255,255,.15);color:#fff;border-color:rgba(255,255,255,.5);-webkit-backdrop-filter:blur(12px) saturate(1.3);backdrop-filter:blur(12px) saturate(1.3)}
.hero-applink{color:#fff;text-shadow:0 1px 12px rgba(0,0,0,.55)}

/* mobil: závoj přes celou výšku (text i tlačítka na tmavém) */
@media(max-width:760px){
  .hero-veil{background:linear-gradient(180deg,rgba(28,17,21,.66) 0%,rgba(28,17,21,.36) 44%,rgba(28,17,21,.58) 100%)}
}

/* ── drobnosti ── */
.brand img,.fb img{border-radius:7px}
.ntf .appic img{border-radius:6px}