/* Stránka VIP Elf pas (vip-pas.php) – staví na css/blog.css (proměnné, tlačítka, navigace, patička).
   Předpona vp-. Signatura: kalendář s 24 dvířky, vyznačené české svátky. */

/* Úvod: papír se zrnem jako hlavička článku */
.vp-hero{background:var(--bl-papir);position:relative;overflow:hidden}
.vp-hero:after{content:"";position:absolute;inset:0;opacity:.07;pointer-events:none;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.75' numOctaves='3'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>")}
.vp-hero .bl-wrap{display:grid;grid-template-columns:7fr 5fr;gap:40px;align-items:end;position:relative;z-index:1;padding-top:44px}
.vp-hero-txt{padding-bottom:56px}
.vp-hero h1{margin:16px 0 0;font-size:clamp(3rem,7vw,5.2rem);color:var(--bl-zelena);line-height:1}
.vp-hero h1 .bl-script{display:block;font-size:clamp(1.9rem,4vw,2.9rem);margin:.1em 0 .45em .5em;line-height:1.1}
.vp-lead{font-size:1.18rem;max-width:52ch;margin:0 0 26px;line-height:1.6}
.vp-actions{display:flex;gap:18px;align-items:center;flex-wrap:wrap}
.vp-actions .vp-more{font-weight:700;color:var(--bl-zelena)!important;text-decoration:none}
.vp-actions .vp-more:hover{text-decoration:underline}
.vp-facts{display:flex;gap:8px 22px;flex-wrap:wrap;margin:28px 0 0;padding:0;list-style:none;color:var(--bl-ink-2);font-size:.92rem}
.vp-facts li{display:flex;align-items:center;gap:.45rem}
.vp-facts i{color:var(--bl-salvej-tmava)}
.vp-hero-elf{justify-self:center;align-self:end}
.vp-hero-elf img{display:block;max-height:470px;width:auto;filter:drop-shadow(0 18px 24px rgba(51,50,49,.25))}
.vp-soon{display:inline-flex;align-items:center;gap:.45rem;background:var(--bl-zelena);color:#fff;border-radius:999px;padding:.3rem .85rem;font-size:.8rem;font-weight:700;letter-spacing:.03em}

/* Plán na každý den: hlavní slib VIP (večer, ráno, odpoledne + ukázka) */
.vp-plan{margin:72px 0 0}
.vp-plan h2{margin:0 0 .4rem;font-size:2.4rem;color:var(--bl-ink)}
.vp-plan h2 .bl-script{font-size:2.4rem;margin-left:.3em}
.vp-plan-lead{font-size:1.12rem;max-width:60ch;margin:0 0 28px;color:var(--bl-ink)}
.vp-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin:0;padding:0;list-style:none}
.vp-steps li{background:var(--bl-bila);border-radius:var(--bl-r);padding:28px 26px;box-shadow:0 14px 34px -26px rgba(6,74,60,.35);border-top:4px solid var(--bl-salvej)}
.vp-steps i{font-size:1.5rem;color:var(--bl-zelena);background:var(--bl-papir);width:52px;height:52px;border-radius:50%;display:grid;place-items:center;margin-bottom:14px}
.vp-steps h3{margin:0 0 .45rem;font-size:1.45rem;color:var(--bl-zelena)}
.vp-steps p{margin:0;color:var(--bl-ink-2);line-height:1.6}
.vp-sample{margin:28px 0 0;background:var(--bl-papir);border-radius:var(--bl-r);padding:30px 32px;border:2px dashed var(--bl-salvej)}
.vp-sample figcaption{font-size:.78rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--bl-salvej-tmava);margin-bottom:.4rem}
.vp-sample h3{margin:0 0 16px;font-size:1.7rem;color:var(--bl-zelena)}
.vp-sample h3 small{font-family:'Open Sans',sans-serif;font-size:.85rem;font-weight:700;color:#fff;background:var(--bl-zelena);border-radius:999px;padding:.2rem .7rem;margin-left:.4rem;vertical-align:middle;letter-spacing:0}
.vp-sample-grid{display:grid;grid-template-columns:1fr 1.6fr;gap:28px}
.vp-sample-grid strong{display:block;color:var(--bl-ink);margin-bottom:.35rem}
.vp-sample-grid ul,.vp-sample-grid ol{margin:0;padding-left:1.2rem;color:var(--bl-ink);line-height:1.65}
.vp-sample-morning{margin:18px 0 0;background:var(--bl-bila);border-left:4px solid var(--bl-salvej);border-radius:10px;padding:14px 18px;color:var(--bl-ink)}
.vp-plan-more{margin:18px 0 0;color:var(--bl-ink-2);max-width:62ch}

/* Kalendář: tmavě zelená se sněhem, 24 dvířek */
.vp-cal{margin:72px 0 0;background:var(--bl-zelena);color:#fff;border-radius:var(--bl-r);display:grid;grid-template-columns:5fr 6fr;gap:40px;align-items:center;padding:48px;
  background-image:radial-gradient(circle,rgba(255,255,255,.28) 1.2px,transparent 2px);background-size:110px 110px}
.vp-cal h2{margin:0 0 .6rem;font-size:2.3rem;color:#fff}
.vp-cal h2 .bl-script{display:block;font-size:2.3rem;margin:.05em 0 0 .5em}
.vp-cal p{color:rgba(255,255,255,.9);margin:0 0 1rem;max-width:46ch}
.vp-cal .vp-note{font-size:.88rem;color:rgba(255,255,255,.75)}
.vp-doors{display:grid;grid-template-columns:repeat(6,1fr);gap:10px;margin:0;padding:0;list-style:none}
.vp-doors li{aspect-ratio:1;background:var(--bl-krem);border-radius:10px;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--bl-ink);
  font-family:'Anton',sans-serif;font-size:1.5rem;line-height:1;position:relative;box-shadow:inset 0 -3px 0 rgba(6,74,60,.12)}
.vp-doors li.svatek{background:var(--bl-salvej);color:#fff;box-shadow:inset 0 -3px 0 rgba(0,0,0,.12)}
.vp-doors li small{font-family:'Open Sans',sans-serif;font-size:.6rem;font-weight:700;letter-spacing:.02em;margin-top:5px;text-transform:uppercase;text-align:center;line-height:1.1}
.vp-doors li.dnes{outline:3px dashed rgba(255,255,255,.75);outline-offset:3px}

/* Co v pasu bude: střídavé řádky elfka + text */
.vp-feats{margin:72px auto 0;display:grid;gap:40px}
.vp-feat{display:grid;grid-template-columns:200px 1fr;gap:40px;align-items:center;max-width:900px}
.vp-feat:nth-child(even){grid-template-columns:1fr 200px;margin-left:auto}
.vp-feat:nth-child(even) img{order:2}
.vp-feat img{width:100%;max-height:230px;object-fit:contain;filter:drop-shadow(0 14px 18px rgba(51,50,49,.2))}
.vp-feat h3{margin:0 0 .5rem;font-size:1.9rem;color:var(--bl-zelena)}
.vp-feat p{margin:0;font-size:1.06rem;color:var(--bl-ink);max-width:56ch}
.vp-feats-head{margin:80px 0 -24px}
.vp-feats-head h2{margin:0;font-size:2.4rem;color:var(--bl-ink)}
.vp-feats-head h2 .bl-script{font-size:2.4rem;margin-left:.3em}

/* Balíček, loňské rodiny, v kostce */
.vp-cards{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin:80px 0 0}
.vp-card{background:var(--bl-bila);border-radius:var(--bl-r);padding:32px;box-shadow:0 14px 34px -26px rgba(6,74,60,.35)}
.vp-card h3{margin:0 0 .6rem;font-size:1.6rem;color:var(--bl-zelena)}
.vp-card p{margin:0;color:var(--bl-ink-2)}
.vp-card .vp-tag{display:inline-block;font-size:.75rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--bl-salvej-tmava);margin-bottom:.5rem}

.vp-brief{margin:56px 0 0;border-top:1px solid var(--bl-linka);padding-top:36px;display:grid;grid-template-columns:260px 1fr;gap:32px}
.vp-brief h2{margin:0;font-size:1.9rem;color:var(--bl-ink)}
.vp-brief dl{display:grid;grid-template-columns:150px 1fr;gap:10px 20px;margin:0}
.vp-brief dt{font-weight:700;color:var(--bl-zelena)}
.vp-brief dd{margin:0;color:var(--bl-ink)}
.vp-brief .vp-stav{grid-column:2;font-size:.85rem;color:var(--bl-ink-2);margin:6px 0 0}

/* Formulář zájmu */
.vp-signup{margin:80px 0 0;background:var(--bl-zelena);color:#fff;border-radius:var(--bl-r);display:grid;grid-template-columns:1fr auto;align-items:end;overflow:hidden;
  background-image:radial-gradient(circle,rgba(255,255,255,.28) 1.2px,transparent 2px);background-size:110px 110px;scroll-margin-top:96px}
.vp-signup-txt{padding:48px 48px 44px}
.vp-signup h2{margin:0 0 .4rem;font-size:2.3rem;color:#fff}
.vp-signup h2 .bl-script{display:block;font-size:2.3rem;margin:.05em 0 .25em .5em}
.vp-signup p{color:rgba(255,255,255,.88);margin:0 0 1.2rem;max-width:54ch}
.vp-signup > img{height:320px;width:auto;margin:24px 48px 0 0;filter:drop-shadow(0 18px 24px rgba(0,0,0,.35))}
.vp-form{display:grid;grid-template-columns:1fr 1.3fr auto;gap:10px;max-width:720px}
.vp-form input{width:100%;border:0;border-radius:999px;padding:.85rem 1.2rem;font:inherit;font-size:1rem;color:var(--bl-ink);background:#fff}
.vp-form input:focus{outline:3px solid var(--bl-salvej);outline-offset:2px}
.vp-form .vp-note-in{grid-column:1/-1}
.vp-form .bl-btn{white-space:nowrap}
.vp-form .bl-btn:hover{background:#fff;color:var(--bl-zelena)!important}
.vp-form .vp-hp{position:absolute;left:-9999px;opacity:0}
.vp-small{font-size:.85rem;color:rgba(255,255,255,.75);margin:12px 0 0!important}
.vp-ok{background:rgba(255,255,255,.12);border-radius:12px;padding:18px 20px;max-width:620px}
.vp-ok b{display:block;font-size:1.15rem;margin-bottom:.2rem}
.vp-err{background:#fbe5e8;color:#9b1830;border-radius:10px;padding:10px 14px;font-weight:600;margin:0 0 12px;max-width:620px}

/* Časté otázky */
.vp-faq{margin:80px 0 80px}
.vp-faq h2{margin:0 0 24px;font-size:2.2rem;color:var(--bl-ink)}
.vp-faq h2 .bl-script{font-size:2.2rem;margin-left:.3em}
.vp-faq-list{display:grid;grid-template-columns:1fr 1fr;gap:8px 48px}
.vp-faq-item{border-top:1px solid var(--bl-linka);padding:18px 0}
.vp-faq-item h3{margin:0 0 .4rem;font-family:'Open Sans',sans-serif;font-weight:700;font-size:1.05rem;color:var(--bl-zelena);text-transform:none;letter-spacing:0}
.vp-faq-item p{margin:0;color:var(--bl-ink-2);font-size:.98rem;line-height:1.65}

@media (max-width:991.98px){
  .vp-hero .bl-wrap{grid-template-columns:1fr 220px}
  .vp-hero-elf img{max-height:300px}
  .vp-cal{grid-template-columns:1fr;padding:36px 28px}
}
@media (max-width:860px){
  .vp-steps,.vp-sample-grid{grid-template-columns:1fr}
  .vp-cards,.vp-brief,.vp-faq-list{grid-template-columns:1fr}
  .vp-signup{grid-template-columns:1fr}
  .vp-signup > img{height:200px;margin:0 auto 0 28px}
  .vp-signup-txt{padding:36px 28px 8px}
  .vp-form{grid-template-columns:1fr}
}
@media (max-width:640px){
  .vp-hero .bl-wrap{grid-template-columns:1fr;padding-top:32px}
  .vp-hero-elf{display:none}
  .vp-hero-txt{padding-bottom:36px}
  .vp-doors{grid-template-columns:repeat(4,1fr);gap:8px}
  .vp-doors li{font-size:1.3rem}
  .vp-cal h2,.vp-signup h2{font-size:1.9rem}
  .vp-cal h2 .bl-script,.vp-signup h2 .bl-script{font-size:1.9rem}
  .vp-feat,.vp-feat:nth-child(even){grid-template-columns:96px 1fr;gap:18px}
  .vp-feat:nth-child(even) img{order:0}
  .vp-feat h3{font-size:1.45rem}
  .vp-feats{gap:40px}
  .vp-brief dl{grid-template-columns:1fr;gap:2px}
  .vp-brief dd{margin-bottom:10px}
  .vp-brief .vp-stav{grid-column:1}
  .vp-card{padding:24px}
  .vp-plan h2,.vp-plan h2 .bl-script{font-size:1.9rem}
  .vp-sample{padding:22px 20px}
  .vp-steps li{padding:22px 20px}
}
