/* ============================================================
   foukačka.cz — LP HERO s formulářem a cutout fotkou
   (doplňkové styly k styles.css; hlavička v LP režimu bez menu)
   ============================================================ */

/* ---------- HLAVIČKA (LP režim) ---------- */
/* CTA tlačítko zůstává viditelné i na mobilu (menu/burger na LP není). */
@media(max-width:880px){
  .header--lp .header-cta .btn{display:inline-flex;padding:12px 18px;min-height:42px;font-size:14px;}
}

/* ---------- HERO ---------- */
/* Pozadí #F5F2EA = barva zapečená ve fotce (cutout), okraje fotky dokrývá maska. */
.lphero{position:relative;z-index:2;background:#F5F2EA;}
.lphero .wrap{display:grid;grid-template-columns:minmax(0,.98fr) minmax(0,1.02fr);
  gap:clamp(24px,3.4vw,44px);align-items:stretch;}
.lphero-copy{padding-block:clamp(44px,6vw,80px) clamp(56px,8vw,96px);align-self:center;}
/* Eyebrow (Praha) bez akcentové linky — stejně jako v hero na ostatních LP. */
.lphero .eyebrow::before{display:none;}

/* ---------- HERO MEDIA (formulář + cutout za ním) ---------- */
.lphero-media{position:relative;min-height:540px;display:flex;align-items:flex-end;
  padding-block:clamp(32px,4vw,52px) 0;}
.lphero-cutout{position:absolute;bottom:0;right:clamp(-44px,-3vw,-16px);z-index:1;
  transform:scaleX(-1);
  height:calc(100% + clamp(12px,2.4vw,44px));width:auto;max-width:none;
  -webkit-mask-image:linear-gradient(to right,transparent 0,#000 36px,#000 calc(100% - 36px),transparent 100%),
    linear-gradient(to bottom,transparent 0,#000 44px);
  -webkit-mask-composite:source-in;
  mask-image:linear-gradient(to right,transparent 0,#000 36px,#000 calc(100% - 36px),transparent 100%),
    linear-gradient(to bottom,transparent 0,#000 44px);
  mask-composite:intersect;}

/* ---------- HERO FORMULÁŘ ---------- */
.lphero-form{position:relative;z-index:2;width:min(404px,100%);background:#fff;
  border:1px solid var(--line);border-radius:18px;padding:clamp(22px,2.4vw,28px);
  box-shadow:var(--shadow-md);margin-bottom:clamp(-64px,-4vw,-44px);}
.lphero-form h2{font-family:var(--font-display);font-weight:600;font-size:22px;line-height:1.2;
  letter-spacing:-.015em;color:var(--fk-green);margin:0 0 16px;}
.lpf-grid{display:grid;gap:10px;}
.lpf-row{display:grid;grid-template-columns:1.35fr 1fr;gap:10px;}
/* E-mail | Město — druhé dvojpole, aby hero formulář nenarostl o řádek. */
.lpf-row--city{grid-template-columns:1.25fr 1fr;}
.lphero-form .input{width:100%;min-height:46px;padding:12px 14px;border:1.5px solid var(--line-strong);
  border-radius:10px;font-family:var(--font-body);font-size:15px;color:var(--fk-ink);
  background:#fff;outline:none;transition:border-color var(--dur),box-shadow var(--dur);}
.lphero-form .input::placeholder{color:var(--fk-stone-500);}
.lphero-form .input:focus{border-color:var(--fk-green-bright);box-shadow:0 0 0 3px rgba(26,107,58,.12);}
.lphero-form .input.err{border-color:#C2410C;background:#FEF2EC;}
.lphero-form .lpf-msg{min-height:58px;resize:none;line-height:1.4;}
.lpf-gdpr{display:flex;gap:9px;align-items:flex-start;margin:12px 0 14px;
  font-size:12.5px;line-height:1.45;color:var(--fk-stone-500);cursor:pointer;}
.lpf-gdpr input{margin:2px 0 0;width:15px;height:15px;flex:0 0 auto;accent-color:var(--fk-green);}
.lpf-gdpr a{text-decoration:underline;text-underline-offset:2px;}
.lpf-gdpr.err{color:#C2410C;}
.lpf-gdpr.err a{color:#C2410C;}
.lphero-form .btn[aria-busy="true"]{opacity:.7;pointer-events:none;}
.lpf-google{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:14px;
  font-size:13px;color:var(--fk-stone-500);}
.lpf-google svg.g{width:16px;height:16px;}
.lpf-google b{font-family:var(--font-display);font-weight:700;font-size:13.5px;color:var(--fk-ink);}
.lpf-google .stars{display:flex;gap:1px;color:#FBBC05;}
.lpf-google .stars svg{width:13px;height:13px;fill:currentColor;}

/* ---------- RESPONSIVE ---------- */
@media(max-width:880px){
  .lphero .wrap{grid-template-columns:1fr;gap:0;}
  /* z-index: na úzkých displejích smí odrážky přetéct přes béžový okraj fotky (dělník je vpravo). */
  .lphero-copy{padding-block:40px 12px;position:relative;z-index:2;}
  .lphero-copy .h1 br{display:none;}
  /* Záporný margin přitahuje fotku blíž k odrážkám. */
  .lphero-media{min-height:0;display:block;padding:0;margin-top:-24px;}
  .lphero-form{width:100%;margin-top:150px;margin-bottom:-6px;}
  .lphero-cutout{height:340px;bottom:auto;top:0;right:-16px;
    -webkit-mask-image:linear-gradient(to right,transparent 0,#000 24px,#000 calc(100% - 24px),transparent 100%);
    mask-image:linear-gradient(to right,transparent 0,#000 24px,#000 calc(100% - 24px),transparent 100%);}
}
@media(max-width:560px){
  /* Velikost ve vw drží zalomení nadpisu při všech šířkách telefonu:
     výchozí = 2řádkové titulky (ferrari), --h1-3l = 3řádkové (úspora, Praha). */
  .lphero-copy .h1{font-size:clamp(29px,9.4vw,40px);}
  .lphero--h1-3l .lphero-copy .h1{font-size:clamp(31px,10.8vw,44px);}
}