/* PÚDER – editoriál s veľkými fotkami v farbách tlačenej pozvánky */
html[data-style="puder"] body{background:#fdf7f0}
html[data-style="puder"] .switch-bar{background:rgba(253,247,240,.8);border-bottom-color:rgba(205,64,38,.15)}

.puder{
  /* farby a písmo podľa tlačenej pozvánky */
  --paper:#fdf7f0;        /* krémový papier pozvánky */
  --blush:#f8e6d9;        /* druhá plocha – zosvetlená broskyňa z palety */
  --red:#cd4026;          /* rumelka pozvánky – nadpisy, kresby, tlačidlá (4.5:1) */
  --red-text:#b8361f;     /* o odtieň tmavšia na drobný text (5.5:1) */
  --hand:"Mynerve",cursive; /* najbližšie k písmu pozvánky s plnou CZ/SK diakritikou; jedna hrúbka */
  --sans:"Instrument Sans",system-ui,sans-serif;
  --serif:"Instrument Serif",Georgia,serif;
  --line:rgba(205,64,38,.25);
  --grain:.22;
  color:var(--red-text);
  font-family:var(--sans);
  font-size:15px;line-height:1.65;
}
.puder section{border-bottom:1px solid var(--line)}
.p-offer,.p-count,.p-rsvp{background:var(--blush)}

/* ---------- typografia ---------- */
.p-h2{font-family:var(--serif);font-weight:400;color:var(--red);font-size:clamp(2.2rem,4.6vw,3.6rem);line-height:1.04;letter-spacing:-.005em}
.p-script{font-family:var(--hand);font-weight:400;color:var(--red);font-size:1em;line-height:.9;letter-spacing:0;position:relative;display:inline-block;white-space:nowrap}
.p-script svg{position:absolute;left:-4%;bottom:-.08em;width:108%;height:.3em;stroke-width:1.4}
.p-script svg path{vector-effect:non-scaling-stroke}
.p-mono{font-family:var(--serif);color:var(--red);font-size:1rem;letter-spacing:.02em}
.p-vlabel{font-size:.68rem;letter-spacing:.24em;text-transform:uppercase;color:var(--red)}
.p-link{
  display:inline-block;font-family:var(--serif);font-style:italic;font-size:.95rem;text-transform:uppercase;letter-spacing:.04em;
  color:var(--red);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px;
}
.p-link:hover{text-decoration-thickness:2px}
.p-btn{
  display:inline-block;padding:14px 34px;border:1px solid var(--red);color:var(--red);text-decoration:none;
  font-family:var(--serif);font-size:1.15rem;text-transform:uppercase;letter-spacing:.06em;transition:background .25s,color .25s;
}
.p-btn:hover{background:var(--red);color:var(--paper)}

/* ---------- horná lišta ---------- */
.p-top{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px clamp(16px,4vw,48px);border-bottom:1px solid var(--line)}
.p-nav{display:flex;gap:clamp(14px,3vw,36px)}
.p-top-right{display:flex;align-items:center;gap:clamp(14px,3vw,32px)}
.p-lang{color:var(--red)}
.p-nav a{font-family:var(--serif);color:var(--red);text-decoration:none;text-transform:uppercase;font-size:1.05rem}
.p-nav a:hover{text-decoration:underline;text-underline-offset:3px}
.p-nav sup,.p-offer sup{font-family:var(--sans);font-size:.55em;letter-spacing:.06em;margin-right:4px}
@media (max-width:680px){.p-nav{display:none}}

/* ---------- hero ---------- */
.p-hero{position:relative;margin:clamp(10px,1.4vw,18px);border-bottom:0!important}
.p-hero img{width:100%;height:min(82svh,720px);object-fit:cover;object-position:center 15%;filter:saturate(.85) contrast(.95)}
.p-quote{
  position:absolute;left:clamp(18px,5vw,64px);top:52%;max-width:min(78%,22rem);
  font-family:var(--hand);font-size:clamp(1.5rem,3.2vw,2.2rem);line-height:1.15;color:#fff;
  text-shadow:0 1px 12px rgba(0,0,0,.25);transform:rotate(-3deg);
}
.p-quote cite{display:block;font-style:normal;font-size:.55em;margin-top:.6em;opacity:.9}
.p-cheers{position:absolute;right:clamp(18px,6vw,80px);top:clamp(18px,8vw,90px);width:clamp(54px,8vw,92px);height:auto;aspect-ratio:64/56;color:#fff;stroke-width:1.4}
.p-hero-title{
  position:absolute;right:clamp(18px,5vw,64px);bottom:clamp(16px,4vw,40px);
  font-family:var(--serif);font-weight:400;color:#fff;font-size:clamp(2.4rem,7vw,5.6rem);line-height:1;text-shadow:0 2px 24px rgba(0,0,0,.25)
}
.p-hero-title em{font-family:var(--hand);font-style:normal;font-size:.9em}

/* ---------- príbeh ---------- */
.p-story{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,7vw,110px);align-items:center;padding:clamp(56px,9vw,120px) clamp(24px,7vw,110px)}
.p-story-media{position:relative;padding-left:34px}
.p-vlabel:not(.p-vlabel--inline){position:absolute;left:0;top:0;writing-mode:vertical-rl;transform:rotate(180deg)}
.p-vlabel--inline{margin-bottom:18px}
.p-framed{position:relative}
.p-framed img{width:100%;aspect-ratio:4/5;object-fit:cover;filter:grayscale(1) contrast(1.05)}
.p-frame{position:absolute;inset:-14px -12px -18px -10px;width:calc(100% + 22px);height:calc(100% + 32px);color:var(--red);stroke-width:1.5}
.p-frame path{vector-effect:non-scaling-stroke}
.p-frame-heart{position:absolute;right:2px;bottom:-26px;width:16px;height:16px;fill:var(--red);stroke:none}
.p-story-text p{max-width:30em;margin-top:1.1em}
.p-story-text .p-h2{margin-bottom:.6em}
.p-story-text .p-link{display:block;text-align:right;margin-top:3em}

/* ---------- program (pás „offerings“) ---------- */
.p-offer{display:grid;grid-template-columns:1fr minmax(240px,34%);align-items:stretch}
.p-offer-list{padding:clamp(28px,4vw,48px) clamp(24px,5vw,64px);border-right:1px solid var(--line);display:flex;flex-direction:column;justify-content:center}
.p-script--title{font-size:clamp(2.4rem,4.2vw,3.2rem);line-height:1;transform:rotate(-5deg);transform-origin:left;margin-bottom:6px}
.p-offer ol{display:flex;flex-wrap:wrap;gap:12px clamp(20px,5vw,64px)}
.p-offer li{font-family:var(--serif);text-transform:uppercase;color:var(--red);font-size:clamp(1.6rem,3vw,2.4rem);line-height:1}
.p-offer li small{display:block;font-family:var(--sans);text-transform:none;font-size:.78rem;color:var(--red);margin-top:6px;letter-spacing:.06em}
.p-offer-img{width:100%;height:100%;min-height:220px;object-fit:cover}

/* ---------- celý program ---------- */
.p-timeline{padding:clamp(48px,7vw,90px) clamp(24px,7vw,110px)}
.p-timeline ul{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line)}
.p-timeline li{display:grid;grid-template-columns:auto 1fr;gap:16px;padding:22px 18px 22px 0;border-bottom:1px solid var(--line)}
.p-timeline time{font-family:var(--serif);color:var(--red);font-size:1.7rem;line-height:1}
.p-timeline h3{font-family:var(--serif);font-weight:400;text-transform:uppercase;color:var(--red);font-size:1.15rem;line-height:1.1}
.p-timeline p{font-size:.85rem;margin-top:4px}

/* ---------- odpočítavanie ---------- */
.p-count{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:clamp(16px,4vw,56px);padding:clamp(40px,6vw,72px) 24px}
.p-count .p-script--title{transform:rotate(-5deg)}
.p-countdown{display:flex}
.p-countdown div{padding:0 clamp(12px,3vw,34px);border-left:1px solid var(--line);text-align:center}
.p-countdown div:first-child{border-left:0}
.p-countdown b{display:block;font-family:var(--serif);font-weight:400;color:var(--red);font-size:clamp(2.6rem,7vw,5rem);line-height:1;font-variant-numeric:tabular-nums}
.p-countdown span{font-size:.62rem;letter-spacing:.24em;text-transform:uppercase}

/* ---------- miesto ---------- */
.p-venue{display:grid;grid-template-columns:minmax(240px,40%) 1fr}
.p-venue>img{width:100%;height:100%;min-height:320px;object-fit:cover;border-right:1px solid var(--line)}
.p-venue-text{padding:clamp(40px,6vw,90px) clamp(24px,6vw,90px)}
.p-venue-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px 40px;margin-top:36px}
.p-venue-grid h3{font-family:var(--serif);font-weight:400;text-transform:uppercase;color:var(--red);font-size:1.35rem;border-top:1px solid var(--line);padding-top:12px;margin-bottom:6px}
.p-venue-grid p{font-size:.9rem}
.p-venue-grid .p-link{margin-top:8px}

/* ---------- pás s fotkou ---------- */
.p-band{position:relative;padding:clamp(10px,1.4vw,18px)}
.p-band img{width:100%;height:clamp(280px,48vw,560px);object-fit:cover;filter:saturate(.8)}
.p-quote--band{top:auto;bottom:14%}

/* ---------- RSVP ---------- */
.p-rsvp{text-align:center;padding:clamp(64px,10vw,130px) 24px}
.p-rsvp-title{font-family:var(--serif);font-weight:400;color:var(--red);font-size:clamp(4.4rem,14vw,10rem);line-height:.9}
.p-rsvp-title .p-script{font-size:1em;line-height:0;margin-left:.04em}
.p-rsvp p:not(.p-vlabel){max-width:30em;margin:22px auto 34px}

.p-foot{text-align:center;padding:48px 24px 56px}
.p-foot .p-script{font-size:2rem;line-height:1.2;white-space:normal}
.p-foot .p-mono{margin-top:6px;font-size:.95rem}

/* ---------- mobil ---------- */
@media (max-width:820px){
  .p-story,.p-offer,.p-venue{grid-template-columns:1fr}
  .p-story-media{max-width:420px}
  .p-offer-list{border-right:0;border-bottom:1px solid var(--line)}
  .p-offer-img{height:260px}
  .p-venue>img{min-height:0;height:260px;border-right:0;border-bottom:1px solid var(--line)}
  .p-timeline ul{grid-template-columns:1fr 1fr}
}
@media (max-width:520px){
  .p-timeline ul,.p-venue-grid{grid-template-columns:1fr}
  .p-quote{top:auto;bottom:42%}
  .p-countdown div{padding:0 10px}
}

/* ---------- jemný pohyb ---------- */
.p-hero,.p-offer,.p-venue{overflow:hidden}
html.anim .p-hero img{animation:p-settle 2.4s cubic-bezier(.2,.7,.2,1) both}
@keyframes p-settle{from{transform:scale(1.07);opacity:.4}to{transform:none;opacity:1}}
html.anim .p-hero .p-quote,html.anim .p-hero-title,html.anim .p-cheers{animation:p-fade 1.2s .9s ease both}
html.anim .p-hero-title{animation-delay:1.3s}
html.anim .p-cheers{animation-delay:1.7s}
@keyframes p-fade{from{opacity:0;translate:0 14px}to{opacity:1;translate:0 0}}

/* vynáranie po stĺpcoch, rámik a podčiarknutie sa dokreslia po vynorení */
html.anim .p-story-text{transition-delay:.15s}
html.anim .p-timeline li:nth-child(3n+2){transition-delay:.12s}
html.anim .p-timeline li:nth-child(3n){transition-delay:.24s}
html.anim .p-countdown{transition-delay:.15s}
html.anim .p-frame{transition-delay:.4s}
html.anim .p-script svg{transition-delay:.9s;transition-duration:1s}

.p-offer-img,.p-venue>img{transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.p-offer-img:hover,.p-venue>img:hover{transform:scale(1.04)}
