/* Thema bridal shower (look branding/bridal3/09: feestwinkel, roségoud, vlaggetjes). SJABLOON van pakket A; eigenaar is nu pakket I4.
   Regels: (1) alleen rol-tokens uit basis.css deel 3 opnieuw zetten, onder [data-thema="shower"];
   (2) eigen onderdelen onderaan, klassen .shw-; (3) hoogstens vier letterbestanden (logo + Fredoka + Nunito + Pacifico);
   (4) feestroze (#E83E8C) haalt met witte of berry tekst geen 4,5:1; daarom is de knop berry met witte tekst en
   is roze alleen voor vlakken, randen en grote koppen. Roségoud nooit als tekstkleur (uitleg.md: zwak contrast). */

[data-thema="shower"]{
  --achter:var(--shw-cream); --tekst:var(--shw-berry); --tekst-zacht:#7A3A58;
  --vlak:var(--white); --vlak-tekst:var(--shw-berry); --rand:var(--shw-berry); --schaduw:var(--shw-pink);
  --accent:var(--shw-blush); --accent-tekst:var(--shw-berry); --bal-kleur:var(--shw-pink); --accent2:var(--shw-pink); --accent2-tekst:var(--white);
  --donker:var(--shw-berry); --donker-tekst:var(--white); --donker-zacht:#F6DCE7; --donker-vlak:#82284F; --donker-accent:var(--shw-blush);
  --link:#A3195B; --focus:var(--shw-berry);
  --knop:var(--shw-berry); --knop-tekst:var(--white); --knop-rand:var(--shw-berry); --knop-schaduw:var(--shw-pink);
  --knop2-tekst:var(--shw-berry); --knop2-rand:var(--shw-berry);
  --letter-kop:"Fredoka",system-ui,sans-serif; --letter-tekst:"Nunito",system-ui,sans-serif; --letter-knop:"Fredoka",system-ui,sans-serif;
  --letter-accent:"Pacifico",cursive; --letter-nummer:"Fredoka",system-ui,sans-serif;
  --kop-gewicht:700; --kop-spatie:-.01em; --kop-hoogte:1.02; --kop-opsz:normal;
  --rond:30px; --rond-klein:20px;
  /* logo gewoon op crème */
  --tv-kast:var(--shw-berry); --tv-schaduw:var(--shw-pink);
  --tv-scherm:radial-gradient(circle at 50% 120%,#FBD3E0 0 45%,transparent 46%),repeating-linear-gradient(90deg,rgba(232,62,140,.07) 0 26px,transparent 26px 52px),#FFF7F0;
  --tv-bal:radial-gradient(circle at 35% 30%,#F7B7D2,#E83E8C 55%,#A3195B); --tv-bal-letter:var(--shw-berry); --tv-bal-tekst:var(--shw-berry);
  --tv-vak:rgba(107,30,69,.10); --tv-vak-tekst:var(--shw-berry); --tv-vak-aan:var(--shw-pink); --tv-vak-aan-tekst:var(--white); --tv-bord-letter:var(--shw-berry);
  --tv-wolk:var(--white); --tv-wolk-tekst:var(--shw-berry); --tv-wolk-wie:#A3195B;
  --tv-liedje:var(--shw-berry); --tv-bingo:var(--shw-pink); --tv-bingo-tekst:var(--shw-berry);
  --kaart-kop:var(--shw-berry); --kaart-kop-tekst:var(--white); --kaart-letter:var(--shw-berry); --kaart-vak:#FFEFF5;
  --kaart-vrij:var(--shw-blush); --kaart-vrij-tekst:var(--shw-berry); --kaart-naam-letter:"Pacifico",cursive;
}
[data-thema="shower"] .scherm{color:var(--shw-berry)}

/* ---------- eigen onderdelen bridal shower (pakket I4): gift bingo-paneel, "Grandma-approved", rustig tempo, "Who wins?" ---------- */

[data-thema="shower"]{
  --shw-slinger:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='336' height='46' viewBox='0 0 336 46'%3E%3Cpath d='M0 5 Q168.0 12 336 5' fill='none' stroke='%236B1E45' stroke-width='2'/%3E%3Cpath d='M4 6.5 L52 6.5 L28 40 Z' fill='%23E83E8C' stroke='%236B1E45' stroke-width='1.6' stroke-linejoin='round'/%3E%3Cpath d='M60 6.5 L108 6.5 L84 40 Z' fill='%23FBD3E0' stroke='%236B1E45' stroke-width='1.6' stroke-linejoin='round'/%3E%3Cpath d='M116 6.5 L164 6.5 L140 40 Z' fill='%23FFD23F' stroke='%236B1E45' stroke-width='1.6' stroke-linejoin='round'/%3E%3Cpath d='M172 6.5 L220 6.5 L196 40 Z' fill='%237FB8E8' stroke='%236B1E45' stroke-width='1.6' stroke-linejoin='round'/%3E%3Cpath d='M228 6.5 L276 6.5 L252 40 Z' fill='%23C98B7B' stroke='%236B1E45' stroke-width='1.6' stroke-linejoin='round'/%3E%3Cpath d='M284 6.5 L332 6.5 L308 40 Z' fill='%23FFFFFF' stroke='%236B1E45' stroke-width='1.6' stroke-linejoin='round'/%3E%3C/svg%3E");
  --shw-confetti:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240' viewBox='0 0 240 240'%3E%3Ccircle cx='123' cy='161' r='3.2' fill='%23E83E8C'/%3E%3Crect x='73' y='40' width='4' height='13' rx='2' fill='%23FFD23F' transform='rotate%28-37 73 40%29'/%3E%3Crect x='226' y='178' width='4' height='13' rx='2' fill='%237FB8E8' transform='rotate%28-60 226 178%29'/%3E%3Ccircle cx='91' cy='133' r='3.2' fill='%23F7A8C8'/%3E%3Crect x='159' y='25' width='4' height='13' rx='2' fill='%23C98B7B' transform='rotate%28-18 159 25%29'/%3E%3Crect x='146' y='162' width='4' height='13' rx='2' fill='%23E83E8C' transform='rotate%2829 146 162%29'/%3E%3Ccircle cx='15' cy='191' r='3.2' fill='%23FFD23F'/%3E%3Crect x='48' y='185' width='4' height='13' rx='2' fill='%237FB8E8' transform='rotate%28-3 48 185%29'/%3E%3Crect x='190' y='113' width='4' height='13' rx='2' fill='%23F7A8C8' transform='rotate%28-40 190 113%29'/%3E%3Ccircle cx='48' cy='65' r='3.2' fill='%23C98B7B'/%3E%3Crect x='33' y='38' width='4' height='13' rx='2' fill='%23E83E8C' transform='rotate%284 33 38%29'/%3E%3Crect x='228' y='156' width='4' height='13' rx='2' fill='%23FFD23F' transform='rotate%28-52 228 156%29'/%3E%3Ccircle cx='203' cy='181' r='3.2' fill='%237FB8E8'/%3E%3Crect x='207' y='196' width='4' height='13' rx='2' fill='%23F7A8C8' transform='rotate%2853 207 196%29'/%3E%3Crect x='31' y='79' width='4' height='13' rx='2' fill='%23C98B7B' transform='rotate%28-34 31 79%29'/%3E%3Ccircle cx='177' cy='62' r='3.2' fill='%23E83E8C'/%3E%3C/svg%3E");
}

/* --- 1. sfeer: zachte strepen op de crème (eigen laag, de tekst meet tegen effen crème), slinger boven de kop --- */
[data-thema="shower"] .kop{padding-top:22px}
[data-thema="shower"] .kop::before{content:"";position:absolute;left:0;right:0;top:0;height:34px;background:var(--shw-slinger) repeat-x 0 0/252px 34px;pointer-events:none}
[data-thema="shower"] main{position:relative;isolation:isolate;overflow-x:clip}
[data-thema="shower"] .achter-licht{position:relative}
[data-thema="shower"] .achter-licht::before{content:"";position:absolute;inset:0;z-index:-1;background:repeating-linear-gradient(90deg,rgba(232,62,140,.045) 0 44px,transparent 44px 88px);pointer-events:none}
[data-thema="shower"] main h2{color:var(--tekst)}
[data-thema="shower"] .achter-accent{--knop:var(--shw-berry);--knop-tekst:var(--white);--knop-rand:var(--shw-berry);--knop-schaduw:var(--shw-pink);--link:var(--shw-berry);--rand:var(--shw-berry)}
[data-thema="shower"] .knop{box-shadow:5px 5px 0 var(--knop-schaduw)}
[data-thema="shower"] .knop-tweede{background:var(--white);box-shadow:none}
[data-thema="shower"] .achter-donker .knop-tweede{background:transparent}
[data-thema="shower"] .label{color:var(--tekst-zacht)}
@media (min-width:760px){ [data-thema="shower"] .kop{padding-top:30px} [data-thema="shower"] .kop::before{height:44px;background-size:336px 44px} }

/* --- 2. opening: duo uitgeknipt op een roze cirkel, confetti, naambordjes zoals op het bord --- */
[data-thema="shower"] .opening{position:relative;overflow:hidden;padding:4px 0 36px}
[data-thema="shower"] .opening-rij{gap:4px}
[data-thema="shower"] .opening-beeld{position:relative;display:flex;justify-content:center;
  background:var(--shw-confetti) 0 0/220px 220px,radial-gradient(closest-side,var(--shw-blush) 0 96%,transparent 97%) 50% 60%/min(60vw,250px) min(60vw,250px) no-repeat}
[data-thema="shower"] .opening-beeld img{width:auto;height:min(24svh,200px);max-height:none;border:0;border-radius:0;object-fit:contain;filter:drop-shadow(0 10px 0 rgba(107,30,69,.10))}
[data-thema="shower"] .opening-beeld::before,[data-thema="shower"] .opening-beeld::after{position:absolute;font-family:"Pacifico",cursive;font-size:15px;line-height:1;padding:7px 12px 9px;border-radius:999px;border:2px solid var(--shw-berry);box-shadow:3px 3px 0 var(--shw-berry);z-index:1}
[data-thema="shower"] .opening-beeld::before{content:"Bella";left:calc(50% - 132px);top:44%;background:var(--shw-pink);color:var(--white);transform:rotate(-8deg)}
[data-thema="shower"] .opening-beeld::after{content:"Bingley";right:calc(50% - 150px);top:70%;background:var(--shw-sky);color:var(--shw-berry);transform:rotate(6deg)}
[data-thema="shower"] .opening h1{font-size:clamp(2.3rem,10vw,5.4rem);max-width:12ch}
[data-thema="shower"] .opening h1::after{content:"";display:block;width:2.6em;height:.32em;margin-top:.12em;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 14'%3E%3Cpath d='M3 9c19-8 38 6 57-1s38-7 57 1' fill='none' stroke='%23E83E8C' stroke-width='5' stroke-linecap='round'/%3E%3C/svg%3E") 0 0/100% 100% no-repeat}
[data-thema="shower"] .opening .lead{font-size:17px;line-height:1.5;color:var(--tekst-zacht)}
[data-thema="shower"] .opening-tekst{gap:12px}
[data-thema="shower"] .opening .label{display:inline-block;background:var(--shw-berry);color:var(--white);padding:6px 14px;border-radius:999px;margin:0;letter-spacing:.14em;font-size:12px}
[data-thema="shower"] .opening-prijs{gap:2px 8px}
[data-thema="shower"] .opening-prijs span{font-size:16px}
[data-thema="shower"] .prijs-groot{color:var(--shw-berry);font-size:38px}
[data-thema="shower"] .opening .knoppen{gap:12px}
@media (min-width:760px){
  [data-thema="shower"] .opening{padding:24px 0 72px}
  [data-thema="shower"] .opening .lead{font-size:20px}
  [data-thema="shower"] .opening-tekst{gap:16px}
  [data-thema="shower"] .opening-prijs{background:var(--white);border:2px dashed var(--shw-pink);border-radius:18px;padding:8px 14px}
  [data-thema="shower"] .opening.met-beeld .opening-rij{grid-template-columns:1fr 1fr;gap:40px}
  [data-thema="shower"] .opening-beeld{background-size:240px 240px,min(46vw,600px) min(46vw,600px);background-position:0 0,50% 55%;padding:20px 0}
  [data-thema="shower"] .opening-beeld img{height:auto;width:100%;max-width:600px}
  [data-thema="shower"] .opening-beeld::before,[data-thema="shower"] .opening-beeld::after{font-size:22px;padding:9px 18px 12px}
  [data-thema="shower"] .opening-beeld::before{left:2%;top:36%}
  [data-thema="shower"] .opening-beeld::after{right:0;top:62%}
}

/* --- 3. geruststelling als feestbordjes, feiten als het klembord van Bella --- */
[data-thema="shower"] .gerust-lijst{grid-template-columns:1fr 1fr}
[data-thema="shower"] .gerust-lijst li{border-radius:999px;border:2px solid var(--shw-berry);background:var(--white);padding:9px 14px;box-shadow:3px 3px 0 var(--shw-blush)}
[data-thema="shower"] .gerust-lijst li:last-child:nth-child(odd){grid-column:1/-1;justify-self:start}
[data-thema="shower"] .gerust-lijst .balletje{background:radial-gradient(circle,var(--white) 0 30%,var(--shw-pink) 34%)}
@media (min-width:1080px){ [data-thema="shower"] .gerust-lijst{grid-template-columns:repeat(5,1fr)} [data-thema="shower"] .gerust-lijst li:last-child:nth-child(odd){grid-column:auto;justify-self:stretch} }
[data-thema="shower"] .blok-feiten{padding-top:48px}
[data-thema="shower"] .feiten{position:relative;margin:0 auto;border-radius:22px;border-width:3px;box-shadow:8px 8px 0 var(--shw-pink);padding-top:44px}
[data-thema="shower"] .feiten::before{content:"";position:absolute;left:50%;top:-16px;width:110px;height:34px;margin-left:-55px;border-radius:10px 10px 14px 14px;background:linear-gradient(#9C7A52,#7A5A38);border:3px solid var(--shw-berry);box-shadow:inset 0 -6px 0 rgba(0,0,0,.18)}
[data-thema="shower"] .feiten .label{color:#B0306B}

/* --- 4. mini-tv: het tv-scherm van het bord ("gift round"), met het duo als postzegel --- */
[data-thema="shower"] .tv{border-radius:24px;box-shadow:8px 8px 0 var(--shw-pink)}
[data-thema="shower"] .scherm::before{content:"";position:absolute;left:4cqw;bottom:2cqw;width:23cqw;aspect-ratio:640/516;background:url(/beeld/shower/duo-plat-320.webp) center bottom/contain no-repeat;display:none}
@container (min-width:560px){ [data-thema="shower"] .scherm::before{display:block} }
[data-thema="shower"] .tv-bal{box-shadow:0 0 0 1.2cqw var(--shw-sun),0 1.8cqw 0 rgba(107,30,69,.25)}
[data-thema="shower"] .tv-wolk{border:.5cqw solid var(--shw-berry)}
[data-thema="shower"] .tv-bingo{font-family:"Pacifico",cursive;font-weight:400;letter-spacing:0}
[data-thema="shower"] .tv-liedje{background:radial-gradient(circle at 50% 40%,#8A2D5C,var(--shw-berry) 70%)}

/* --- 5. stemmen en grappen: kaartjes als cadeaulabels --- */
[data-thema="shower"] .stem{border-width:2px;border-radius:20px;box-shadow:4px 4px 0 var(--shw-blush)}
[data-thema="shower"] .speel{background:var(--shw-berry);color:var(--white)}
[data-thema="shower"] .speel[aria-pressed="true"]{background:var(--shw-pink);color:var(--white)}
[data-thema="shower"] .speel-leeg{background:var(--shw-blush);color:var(--shw-berry);border:2px dashed var(--shw-berry)}
[data-thema="shower"] .grap .stem{position:relative;box-shadow:5px 5px 0 var(--shw-pink);padding-top:22px}
[data-thema="shower"] .grap .stem::before{content:"";position:absolute;right:18px;top:-11px;width:22px;height:22px;border-radius:50%;background:var(--shw-sun);border:2px solid var(--shw-berry)}
[data-thema="shower"] .grap:nth-child(3n+2) .stem::before{background:var(--shw-sky)}
[data-thema="shower"] .grap:nth-child(3n) .stem::before{background:var(--shw-pink)}
@media (min-width:760px){ [data-thema="shower"] .grappen{grid-template-columns:repeat(2,minmax(0,1fr))} [data-thema="shower"] .grap:nth-child(odd) .stem{transform:rotate(-.6deg)} [data-thema="shower"] .grap:nth-child(even) .stem{transform:rotate(.6deg)} }

/* --- 6. presentatoren: Bella roze, Bingley lichtblauw, de figuur staat in de kaart --- */
[data-thema="shower"] .persoon{grid-template-columns:minmax(0,1fr) 36%;column-gap:12px;overflow:hidden;position:relative}
[data-thema="shower"] .persoon > *{grid-column:1}
[data-thema="shower"] .persoon .persoon-beeld{grid-column:2;grid-row:1/5;align-self:end;width:100%;max-height:300px;object-fit:contain;object-position:bottom;border-radius:0;margin-bottom:-22px}
[data-thema="shower"] .persoon .stem{grid-column:1/-1;position:relative;z-index:1}
[data-thema="shower"] .persoon[data-spreker="bella"]{background:#FFE9F2;box-shadow:8px 8px 0 var(--shw-pink)}
[data-thema="shower"] .persoon[data-spreker="bingley"]{background:#E6F1FB;box-shadow:8px 8px 0 var(--shw-sky)}
[data-thema="shower"] .persoon h3{font-family:"Pacifico",cursive;font-weight:400;font-size:clamp(2rem,8vw,2.8rem);line-height:1.2}
[data-thema="shower"] .persoon[data-spreker="bingley"] h3{color:var(--shw-berry);-webkit-text-stroke:0}
@media (min-width:760px){ [data-thema="shower"] .persoon{grid-template-columns:minmax(0,1fr) 40%} [data-thema="shower"] .persoon .persoon-beeld{max-height:380px;margin-bottom:-30px} }

/* --- 7. gift bingo-paneel --- */
.shw-cadeaublok{position:relative;overflow:hidden}
.shw-confetti{position:absolute;inset:0;background:var(--shw-confetti) 0 0/260px 260px;opacity:.55;pointer-events:none}
.shw-cadeau-rij{position:relative;display:grid;gap:28px}
.shw-cadeau-links{display:grid;gap:20px;align-content:start}
.shw-cadeau-links .blok-kop{margin-bottom:4px}
.shw-cadeau-links .blok-kop p{color:var(--shw-berry)}
.shw-cadeaus{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.shw-cadeau{position:relative;width:100%;min-height:44px;display:grid;justify-items:center;gap:4px;padding:10px 6px 10px;background:var(--white);color:var(--shw-berry);border:3px solid var(--shw-berry);border-radius:20px;box-shadow:4px 4px 0 var(--shw-berry);cursor:pointer;font-family:"Fredoka",system-ui,sans-serif;font-weight:700;font-size:16px;line-height:1.1;transition:transform .12s,box-shadow .12s,background .12s}
.shw-cadeau:active{transform:translate(2px,2px);box-shadow:2px 2px 0 var(--shw-berry)}
.shw-cadeau-beeld{display:flex;align-items:center;justify-content:center;width:100%;height:76px}
.shw-cadeau-beeld img{max-height:76px;width:auto;max-width:100%;object-fit:contain;transition:transform .2s}
.shw-cadeau[aria-pressed="true"]{background:var(--shw-cream);border-color:var(--shw-pink);box-shadow:4px 4px 0 var(--shw-pink)}
.shw-cadeau[aria-pressed="true"] .shw-cadeau-beeld img{transform:rotate(-8deg) scale(1.06)}
.shw-vinkje{position:absolute;right:-8px;top:-8px;width:30px;height:30px;padding:5px;border-radius:50%;background:var(--shw-pink);border:2px solid var(--shw-berry);stroke:var(--white);stroke-width:3.4;fill:none;stroke-linecap:round;stroke-linejoin:round;transform:scale(0);transition:transform .18s cubic-bezier(.2,1.6,.4,1)}
.shw-cadeau[aria-pressed="true"] .shw-vinkje{transform:scale(1)}
.shw-wolk{position:relative;display:grid;grid-template-columns:72px minmax(0,1fr);gap:10px;align-items:end}
.shw-wolk-duo{width:72px;height:auto;align-self:end}
.shw-wolk-tekst{position:relative;background:var(--white);color:var(--shw-berry);border:3px solid var(--shw-berry);border-radius:22px;padding:14px 16px;min-height:96px;display:grid;gap:6px;align-content:center;font-weight:700;font-size:17px;line-height:1.4;box-shadow:4px 4px 0 var(--shw-pink)}
.shw-wolk-tekst::before{content:"";position:absolute;left:-13px;bottom:22px;width:20px;height:20px;background:var(--white);border-left:3px solid var(--shw-berry);border-bottom:3px solid var(--shw-berry);transform:rotate(45deg)}
.shw-wolk-tekst b{color:#A3195B}
.shw-wolk-leeg{color:#7A3A58}
.shw-wolk.nieuw .shw-wolk-tekst{animation:wolk .3s ease-out}
.shw-cadeau-rechts{display:grid;gap:16px;justify-items:center}
.shw-giftkaart{position:relative;width:100%;max-width:440px;background:var(--white);color:#2A1020;border:3px solid #2A1020;border-radius:6px;padding:14px 12px 10px;box-shadow:8px 8px 0 var(--shw-berry);transform:rotate(1.2deg)}
.shw-giftkaart-kop{font-family:"Fredoka",system-ui,sans-serif;font-weight:700;font-size:30px;line-height:1;text-align:center}
.shw-giftkaart-zin{text-align:center;font-weight:800;font-size:12px;letter-spacing:.14em;text-transform:uppercase;margin:6px 0 10px}
.shw-giftkaart-raster{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));border:2px solid #2A1020}
.shw-gk-l{font-family:"Fredoka",system-ui,sans-serif;font-weight:700;font-size:22px;text-align:center;border:1px solid #2A1020;padding:2px 0}
.shw-gk-vak{position:relative;aspect-ratio:1;display:flex;align-items:center;justify-content:center;text-align:center;border:1px solid #2A1020;font-size:12px;letter-spacing:-.02em;font-weight:700;line-height:1.1;padding:1px;min-width:0;hyphens:auto;-webkit-hyphens:auto;isolation:isolate}
@media (max-width:419px){ .shw-gk-vak{font-size:10.5px} }
.shw-gk-vak:nth-child(18){font-family:"Pacifico",cursive;font-weight:400;font-size:15px}
.shw-gk-vak::after{content:"";position:absolute;inset:10%;z-index:-1;border-radius:50%;background:rgba(232,62,140,.38);transform:scale(0);transition:transform .2s cubic-bezier(.2,1.6,.4,1)}
.shw-gk-vak.aan::after{transform:scale(1)}
.shw-giftkaart-onder{text-align:center;font-size:12px;font-weight:700;margin-top:8px}
.shw-bingo-stempel{position:absolute;left:50%;top:44%;transform:translate(-50%,-50%) rotate(-12deg);font-family:"Pacifico",cursive;font-size:clamp(34px,10vw,52px);line-height:1.3;color:var(--shw-pink);background:var(--white);border:4px solid var(--shw-pink);border-radius:18px;padding:0 18px 6px;animation:knal .5s cubic-bezier(.2,1.6,.4,1);white-space:nowrap}
.shw-bingo-zin{font-family:"Fredoka",system-ui,sans-serif;font-weight:700;font-size:20px;color:var(--shw-berry)}
.shw-cadeau-knoppen{justify-content:center}
.shw-reacties{grid-column:1/-1;background:var(--white);color:var(--shw-berry);border:3px solid var(--shw-berry);border-radius:20px}
.shw-reacties summary{cursor:pointer;min-height:52px;display:flex;align-items:center;padding:10px 18px;font-family:"Fredoka",system-ui,sans-serif;font-weight:700;font-size:18px}
.shw-reacties-lijst{display:grid;gap:12px;padding:0 14px 16px}
.shw-reacties .stem{box-shadow:none;background:var(--shw-cream)}
@media (min-width:600px){ .shw-cadeaus{gap:14px} .shw-cadeau-beeld{height:96px} .shw-cadeau-beeld img{max-height:96px} .shw-wolk{grid-template-columns:110px minmax(0,1fr)} .shw-wolk-duo{width:110px} .shw-gk-vak{font-size:13px} }
@media (min-width:960px){
  .shw-cadeau-rij{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:56px;align-items:start}
  .shw-reacties-lijst{grid-template-columns:repeat(2,minmax(0,1fr))}
  .shw-giftkaart{padding:20px 18px 14px}
  .shw-gk-vak{font-size:13px}
}

/* --- 8. Grandma-approved: zegel, wat er niet in zit, en de stem --- */
.shw-oma-rij{display:grid;gap:24px;align-items:center}
.shw-zegel{width:min(56vw,230px);justify-self:center}
.shw-zegel svg{width:100%;height:auto;overflow:visible;animation:shw-wieg 6s ease-in-out infinite alternate}
.shw-zegel-rand{fill:var(--shw-pink);stroke:var(--shw-berry);stroke-width:4;stroke-dasharray:6 5}
.shw-zegel-vlak{fill:var(--shw-cream);stroke:var(--shw-berry);stroke-width:3}
.shw-zegel-boog{font-family:"Fredoka",system-ui,sans-serif;font-weight:700;font-size:16px;letter-spacing:.1em;text-transform:uppercase;fill:var(--shw-berry);color:var(--shw-berry)}
.shw-zegel-hart{fill:var(--shw-pink);stroke:var(--shw-berry);stroke-width:3}
@keyframes shw-wieg{from{transform:rotate(-6deg)}to{transform:rotate(6deg)}}
.shw-oma-tekst .blok-kop{margin-bottom:18px}
.shw-niet{list-style:none;margin:0 0 22px;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.shw-niet li{display:inline-flex;align-items:center;gap:8px;background:var(--shw-cream);border:2px solid var(--shw-berry);border-radius:999px;padding:7px 14px 7px 8px;font-weight:800}
.shw-niet li span{text-decoration:line-through;text-decoration-color:var(--shw-pink);text-decoration-thickness:3px}
.shw-niet svg{width:26px;height:26px;padding:5px;border-radius:50%;background:var(--shw-pink);stroke:var(--white);stroke-width:3;stroke-linecap:round;fill:none}
.shw-oma-stem{max-width:560px}
@media (min-width:760px){ .shw-oma-rij{grid-template-columns:260px minmax(0,1fr);gap:56px} .shw-zegel{width:260px} }

/* --- 9. rustig tempo: de showertafel met de telefoon als afstandsbediening --- */
.shw-tempo-rij{display:grid;gap:28px;align-items:center}
.shw-tempo-tekst em{font-style:normal;font-weight:800;background:var(--shw-blush);padding:0 .2em;border-radius:6px;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.shw-tempo-beeld{position:relative;padding-bottom:70px}
.shw-tafel img{width:100%;border:3px solid var(--shw-berry);border-radius:26px;box-shadow:8px 8px 0 var(--shw-blush);transition:filter .3s}
.is-pauze .shw-tafel img{filter:saturate(.55) brightness(1.04)}
.shw-telefoon{position:absolute;left:12px;bottom:0;width:min(56%,230px);background:var(--shw-berry);color:var(--white);border-radius:30px;padding:16px 12px 14px;display:grid;gap:10px;box-shadow:6px 6px 0 var(--shw-pink);border:3px solid var(--shw-berry)}
.shw-telefoon::before{content:"";justify-self:center;width:46px;height:5px;border-radius:5px;background:rgba(255,255,255,.35);margin-top:-6px}
.shw-telefoon-kop{font-size:12px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;text-align:center;color:#F6DCE7}
.shw-telefoon-scherm{display:flex;align-items:center;gap:8px;background:var(--shw-cream);color:var(--shw-berry);border-radius:16px;padding:10px 12px;font-weight:800;font-size:15px;line-height:1.2}
.shw-stip{flex:none;width:10px;height:10px;border-radius:50%;background:#1E9E5A;box-shadow:0 0 0 3px rgba(30,158,90,.22);animation:shw-puls 1.4s ease-in-out infinite}
.is-pauze .shw-stip{background:var(--shw-pink);box-shadow:0 0 0 3px rgba(232,62,140,.25);animation:none}
@keyframes shw-puls{50%{transform:scale(.7)}}
[data-thema="shower"] .shw-taartknop{width:100%;background:var(--shw-pink);color:var(--shw-berry);border-color:var(--white);box-shadow:3px 3px 0 var(--white);font-size:17px;padding:.6em .8em;color:#250615}
.shw-taartknop[aria-pressed="true"]{background:var(--shw-sun)}
.shw-taartknop:disabled{opacity:1;cursor:default}
.shw-taart{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linejoin:round;stroke-linecap:round}
@media (min-width:760px){ .shw-tempo-rij{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:56px} .shw-tempo-beeld{padding-bottom:40px} .shw-telefoon{left:-28px;width:250px} }

/* --- 10. persoonlijke grappen: drie stappen, Bella vinkt af --- */
.shw-stappen-rij{display:grid;grid-template-columns:minmax(0,1fr) 34%;gap:20px 12px;align-items:start}
.shw-stappen-tekst{display:contents}
.shw-stappen-rij h2{grid-column:1;align-self:end}
.shw-stappen-beeld{grid-column:2;grid-row:1/3}
.shw-stappen-prijs{grid-column:1;margin:0;font-weight:700;font-size:17px}
.shw-stappen-prijs b{font-family:"Fredoka",system-ui,sans-serif;font-size:30px;color:var(--shw-berry)}
.shw-stappen-rij:not(:has(.shw-stappen-prijs)) .shw-stappen-beeld{grid-row:1}
.shw-stappen-beeld img{width:100%;max-height:300px;object-fit:contain;object-position:top}
.shw-stappen{grid-column:1/-1;list-style:none;margin:0;padding:0;display:grid;gap:14px;counter-reset:stap}
.shw-stap{display:grid;grid-template-columns:52px minmax(0,1fr);gap:14px;align-items:start;background:var(--achter);border:2px solid var(--shw-berry);border-radius:22px;padding:16px;box-shadow:4px 4px 0 var(--shw-blush)}
.shw-stap-nr{width:52px;height:52px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--white);border:2px solid var(--shw-berry);box-shadow:inset 0 0 0 7px var(--shw-pink);font-family:"Fredoka",system-ui,sans-serif;font-weight:700;font-size:21px;color:var(--shw-berry)}
.shw-stap strong{display:block;font-family:"Fredoka",system-ui,sans-serif;font-weight:700;font-size:20px;line-height:1.2;margin-bottom:4px}
@media (min-width:760px){
  .shw-stappen-rij{grid-template-columns:minmax(0,1fr) 300px;gap:24px 56px}
  .shw-stappen-tekst{display:grid;gap:28px;grid-column:1;grid-row:1}
  .shw-stappen-beeld{grid-row:1;align-self:center}
  .shw-stappen-tekst h2{margin-bottom:-16px}
  .shw-stappen-beeld img{max-height:560px}
  .shw-stappen{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
  .shw-stap{grid-template-columns:1fr;align-content:start;padding:22px}
}

/* --- 11. Who wins? drie minikaarten, kies de bruid of het toeval --- */
.shw-winnaar-rij{display:grid;gap:28px;align-items:center}
.shw-winnaar{display:grid;gap:18px;justify-items:start}
.shw-keuze{display:inline-flex;flex-wrap:wrap;gap:4px;background:var(--white);border:3px solid var(--shw-berry);border-radius:999px;padding:4px}
.shw-keuze-knop{min-height:44px;border:0;border-radius:999px;background:transparent;color:var(--shw-berry);font-family:"Fredoka",system-ui,sans-serif;font-weight:700;font-size:16px;padding:0 16px;cursor:pointer}
.shw-keuze-knop[aria-pressed="true"]{background:var(--shw-berry);color:var(--white)}
.shw-minikaarten{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;width:100%;max-width:560px}
.shw-minikaart{position:relative;background:var(--white);border:3px solid var(--shw-berry);border-radius:16px;box-shadow:4px 4px 0 var(--shw-blush);transition:transform .2s,box-shadow .2s}
.shw-minikaart-naam{background:var(--shw-berry);color:var(--white);text-align:center;font-family:"Fredoka",system-ui,sans-serif;font-weight:700;font-size:16px;line-height:1.15;padding:8px 4px;min-height:52px;border-radius:12px 12px 0 0;display:flex;flex-direction:column;align-items:center;justify-content:center}
.shw-sluier{display:block;font-family:var(--letter-tekst);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:#F6DCE7;font-weight:800}
.shw-minikaart-raster{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;padding:8px}
.shw-minikaart-raster i{aspect-ratio:1;border-radius:8px;background:#FFEFF5;position:relative}
.shw-minikaart-raster i::after{content:"";position:absolute;inset:16%;border-radius:50%;background:var(--shw-pink);transform:scale(0);transition:transform .15s cubic-bezier(.2,1.6,.4,1)}
.shw-minikaart-raster i.aan::after,.shw-minikaart-raster i.vrij::after{transform:scale(1)}
.shw-minikaart-raster i.vrij{background:var(--shw-blush)}
.shw-minikaart-raster i.vrij::after{background:var(--shw-sun)}
.shw-minikaart.wint{transform:translateY(-6px) rotate(-2deg);box-shadow:6px 6px 0 var(--shw-pink)}
.shw-minikaart-bingo{position:absolute;left:50%;top:60%;transform:translate(-50%,-50%) rotate(-12deg);font-family:"Pacifico",cursive;font-size:17px;line-height:1.4;color:var(--shw-berry);background:var(--shw-sun);border:3px solid var(--shw-berry);border-radius:12px;padding:0 10px 4px;white-space:nowrap;animation:knal .5s cubic-bezier(.2,1.6,.4,1)}
.shw-winnaar-uitslag{min-height:1.5em;font-family:"Fredoka",system-ui,sans-serif;font-weight:700;font-size:20px}
@media (min-width:760px){ .shw-winnaar-rij{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px} .shw-minikaart-naam{font-size:18px} .shw-minikaart-bingo{font-size:28px} }

/* --- 12. de muziek: een platenbak met genres, een plaat die draait --- */
.shw-muziek-rij{display:grid;gap:32px;align-items:center}
.shw-platen{position:relative;display:grid;justify-items:center;padding-top:10px}
.shw-plaat{width:min(52vw,220px);aspect-ratio:1;border-radius:50%;background:repeating-radial-gradient(circle,#2A1020 0 2px,#3A1830 2px 4px);display:flex;align-items:center;justify-content:center;box-shadow:6px 6px 0 var(--shw-pink);animation:shw-draai 6s linear infinite}
.shw-plaat span{width:36%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#2A1020 0 9%,var(--shw-pink) 10% 60%,var(--shw-blush) 61%)}
@keyframes shw-draai{to{transform:rotate(360deg)}}
.shw-platenbak{list-style:none;margin:-48px 0 0;padding:16px 14px 18px;position:relative;width:100%;max-width:440px;display:flex;flex-wrap:wrap;justify-content:center;gap:10px;background:var(--shw-berry);border-radius:18px 18px 26px 26px;box-shadow:6px 6px 0 var(--shw-blush)}
.shw-hoes{font-family:"Fredoka",system-ui,sans-serif;font-weight:700;font-size:17px;padding:10px 14px;border-radius:10px;border:2px solid var(--white);background:var(--shw-blush);color:var(--shw-berry)}
.shw-hoes-2{background:var(--shw-sun);transform:rotate(2deg)}
.shw-hoes-3{background:var(--shw-sky);transform:rotate(-2deg)}
.shw-hoes-4{background:var(--white)}
.shw-hoes-5{background:#F7B7D2;transform:rotate(1.5deg)}
@media (min-width:760px){ .shw-muziek-rij{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:56px} .shw-muziekblok .shw-platen{order:2} .shw-plaat{width:260px} }

/* --- 13. prijs, kaart, vragen en slot in de showlook --- */
[data-thema="shower"] .achter-donker{background:var(--shw-berry)}
[data-thema="shower"] .prijs-kolom{border-radius:28px}
[data-thema="shower"] .prijs-kolom.uitgelicht{box-shadow:8px 8px 0 var(--shw-pink);border-color:var(--shw-blush)}
[data-thema="shower"] .badge{background:var(--shw-sun);color:var(--shw-berry);border-color:var(--shw-berry)}
[data-thema="shower"] .bkaart{box-shadow:8px 8px 0 var(--shw-pink);transform:rotate(-1deg)}
[data-thema="shower"] .bkaart-naam{font-weight:400;line-height:1.35}
[data-thema="shower"] .vraag{border-width:2px;border-radius:20px}
[data-thema="shower"] .vraag summary{font-weight:700}
[data-thema="shower"] .slot{position:relative;overflow:hidden;padding-top:72px}
[data-thema="shower"] .slot::before{content:"";position:absolute;left:0;right:0;top:0;height:34px;background:var(--shw-slinger) repeat-x 0 0/252px 34px}
[data-thema="shower"] .slot h2{font-size:clamp(2.2rem,8vw,4rem)}
@media (min-width:760px){ [data-thema="shower"] .slot{padding-top:100px} [data-thema="shower"] .slot::before{height:44px;background-size:336px 44px} }

/* print van de gift bingo-kaart (zelfde printvak als het kaartvoorbeeld uit basis.css) */
@media print{
  html.printmodus #printvak .shw-giftkaart{transform:none;box-shadow:none;max-width:180mm;margin:8mm auto;border-color:#000;color:#000}
  html.printmodus #printvak .shw-gk-vak{font-size:12pt}
  html.printmodus #printvak .shw-giftkaart-kop{font-size:30pt}
}
