/*!
 * cav-finder.css — Produktfinder (3-Fragen-Quiz). Marken-Tokens aus dem Child-Theme.
 */
/* /finder: GP-Artikelkarte (weiß + Schatten) ausblenden, damit nur EINE Karte sichtbar ist */
.cav-finder-page .inside-article{ background:transparent !important; box-shadow:none !important; border:none !important; padding:0 !important; }
.cav-finder{ max-width:820px; margin:0 auto; background:#fff; border:1px solid rgba(140,136,130,.18); border-radius:24px; padding:30px 30px; box-shadow:0 26px 60px -40px rgba(42,58,82,.45); transition:max-width .25s ease; }
/* Quiz-Schritte füllen die volle Kartenbreite; Ergebnis-Raster ebenso */
.cav-finder__step{ max-width:none; }
/* /finder: aus der schmaleren GP-Content-Spalte auf volle Seitenbreite ausbrechen (zentriert) */
@media (min-width:1240px){
	.cav-finder--wide{ width:min(100vw - 48px, 1320px); max-width:none; margin-left:50%; transform:translateX(-50%); }
}
.cav-finder__top{ display:flex; align-items:center; gap:12px; margin-bottom:14px; min-height:30px; }
.cav-finder__back{ background:none; border:none; cursor:pointer; font-family:inherit; font-weight:700; font-size:14px; color:#5C574F; padding:6px 4px; }
.cav-finder__back:hover{ color:var(--cav-navy,#2A3A52); }
.cav-finder__dots{ display:flex; gap:7px; margin-left:auto; }
.cav-finder__dots span{ width:9px; height:9px; border-radius:50%; background:#E7E2D6; transition:background .2s; }
.cav-finder__dots span.is-on{ background:var(--cav-honey,#D9A441); }

.cav-finder__q{ font-family:var(--cav-font-head,'Fredoka',sans-serif); font-weight:600; font-size:28px; color:var(--cav-navy,#2A3A52); margin:0 0 4px; line-height:1.12; text-align:center; }
.cav-finder__hint{ text-align:center; color:#8C8882; font-size:14px; margin:0; }
.cav-finder__opts{ margin-top:24px; }
.cav-finder__opts--age{ display:grid; grid-template-columns:repeat(auto-fit,minmax(120px,1fr)); gap:12px; }
.cav-finder__opts--grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }

.cav-finder__opt{ background:#F7F5EF; border:2px solid transparent; border-radius:16px; cursor:pointer; font-family:inherit; font-weight:700; font-size:16px; color:var(--cav-navy,#2A3A52); padding:16px 18px; transition:transform .12s ease, border-color .12s ease, background .12s ease; }
.cav-finder__opt:hover{ transform:translateY(-2px); background:#F0ECE0; }
.cav-finder__opt.is-sel{ border-color:var(--cav-navy,#2A3A52); background:#fff; }
.cav-finder__opt--tile{ display:flex; flex-direction:column; align-items:center; gap:10px; text-align:center; padding:22px 14px; line-height:1.2; }
.cav-finder__emoji{ font-size:34px; line-height:1; }

.cav-finder__loading{ text-align:center; color:#5C574F; font-weight:600; padding:46px 0; display:flex; align-items:center; justify-content:center; gap:10px; }
.cav-finder__spinner{ width:18px; height:18px; border:3px solid #E7E2D6; border-top-color:var(--cav-honey,#D9A441); border-radius:50%; animation:cav-spin .8s linear infinite; }
@keyframes cav-spin{ to{ transform:rotate(360deg); } }

.cav-finder__resulthead{ text-align:center; margin-bottom:22px; }
.cav-finder__badge{ display:inline-block; background:#F4F1E9; color:var(--cav-navy,#2A3A52); font-weight:800; font-size:13px; padding:6px 14px; border-radius:999px; margin-bottom:10px; }
.cav-finder__grid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(228px, 1fr)); gap:18px; }
.cav-finder__grid .cav-hcard__title{ display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; min-height:2.3em; overflow-wrap:break-word; }
.cav-finder__actions{ display:flex; gap:12px; justify-content:center; flex-wrap:wrap; margin-top:28px; }

@media(max-width:740px){
	.cav-finder{ padding:24px 18px; border-radius:20px; }
	.cav-finder__q{ font-size:23px; }
	.cav-finder__grid{ grid-template-columns:repeat(2,1fr); gap:12px; }
}
@media(max-width:460px){
	.cav-finder__opts--grid{ grid-template-columns:repeat(2,1fr); }
	.cav-finder__emoji{ font-size:30px; }
}

/* ---- Visueller Feinschliff: voller, größer, animiert ---- */
.cav-finder{ padding:34px 34px 40px; }
.cav-finder__q{ font-size:32px; }
.cav-finder__hint{ font-size:15px; }
.cav-finder__opts{ margin-top:28px; }
.cav-finder__opt{ padding:20px 16px; font-size:17px; box-shadow:0 6px 16px -12px rgba(42,58,82,.25); }
.cav-finder__opt:hover{ transform:translateY(-3px); background:#fff; border-color:rgba(42,58,82,.22); box-shadow:0 16px 30px -16px rgba(42,58,82,.42); }
.cav-finder__opt--tile{ padding:26px 16px; }
.cav-finder__emoji{ font-size:38px; }
@keyframes cav-fade-up{ from{ opacity:0; transform:translateY(16px); } to{ opacity:1; transform:translateY(0); } }
.cav-finder__step.cav-anim{ animation:cav-fade-up .4s cubic-bezier(.22,.7,.3,1) both; }
.cav-finder__step.cav-anim .cav-finder__opt{ animation:cav-fade-up .5s cubic-bezier(.22,.7,.3,1) both; }
.cav-finder__step.cav-anim .cav-finder__opt:nth-child(1){ animation-delay:.06s; }
.cav-finder__step.cav-anim .cav-finder__opt:nth-child(2){ animation-delay:.12s; }
.cav-finder__step.cav-anim .cav-finder__opt:nth-child(3){ animation-delay:.18s; }
.cav-finder__step.cav-anim .cav-finder__opt:nth-child(4){ animation-delay:.24s; }
.cav-finder__step.cav-anim .cav-finder__opt:nth-child(5){ animation-delay:.30s; }
.cav-finder__step.cav-anim .cav-finder__opt:nth-child(6){ animation-delay:.36s; }
.cav-finder__result.cav-anim{ animation:cav-fade-up .45s cubic-bezier(.22,.7,.3,1) both; }
@media(prefers-reduced-motion:reduce){ .cav-finder__step.cav-anim, .cav-finder__step.cav-anim .cav-finder__opt, .cav-finder__result.cav-anim{ animation:none; } }