/* Crownshop Experience – Magazin-Vernetzung.
   Nutzt ausschließlich die CSS-Variablen des Themes (mit Rückfallwerten),
   damit ein neuer Theme-Stil automatisch greift. Keine Endlos-Animation. */


/* ---------- Produkt-Einblendung im Artikel ---------- */
.crx-pick{
	display:grid;grid-template-columns:112px minmax(0,1fr);
	margin:1.9em 0;overflow:hidden;
	background:var(--panel,#141a15);
	border:var(--stroke,1px) solid var(--edge,var(--line,#2a332b));
	border-radius:var(--radius,16px);
	box-shadow:var(--pop,none);
	line-height:1.4;
}
.crx-pick__media{display:block;background:var(--panel-2,#1a211b);align-self:stretch}
.cs-prose .crx-pick__media img,.crx-pick__media img{
	display:block;width:100%;height:100%;aspect-ratio:5/7;object-fit:cover;
	margin:0;border-radius:0;max-width:none
}
.crx-pick__body{display:flex;flex-direction:column;gap:4px;padding:12px 14px 14px;min-width:0}
.cs-prose .crx-pick p,.crx-pick p{margin:0}
.crx-pick__kicker{
	font-family:var(--sans,system-ui,sans-serif);font-size:.72rem;font-weight:600;
	letter-spacing:.08em;text-transform:uppercase;color:var(--gold-deep,#9c7a32)
}
.crx-pick__name{font-family:var(--serif,Georgia,serif);font-size:1.18rem;line-height:1.15;color:var(--ink,#f4efe3)}
.cs-prose .crx-pick__name a,.crx-pick__name a{color:inherit;text-decoration:none}
.crx-pick__name a:hover{color:var(--gold-hi,#ecd793)}
.crx-pick__facts{display:flex;flex-wrap:wrap;gap:6px;margin:2px 0 0}
.crx-pick__chip{display:inline-block;white-space:nowrap;font-size:.76rem;line-height:1;padding:5px 9px;border-radius:999px;border:1px solid var(--line,#2a332b);color:var(--ink-dim,#aeb5a6);background:var(--panel-2,#1a211b)}
.crx-pick__why{font-size:.9rem;color:var(--ink-dim,#aeb5a6)}
.crx-pick__buy{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:auto;padding-top:8px}
.crx-pick__price{font-family:var(--serif,Georgia,serif);font-size:1.2rem;color:var(--ink,#f4efe3);white-space:nowrap}
.cs-prose a.crx-pick__btn,.crx-pick__btn{
	min-height:44px;padding:.6em 1.15em;white-space:nowrap;text-decoration:none;flex:none
}
@media (min-width:600px){
	.crx-pick{grid-template-columns:150px minmax(0,1fr)}
	.crx-pick__body{padding:16px 20px 18px;gap:6px}
	.crx-pick__name{font-size:1.35rem}
}

/* ---------- Weiterlesen (im Artikel: kompakte Zeilen) ---------- */
.crx-reads{margin:2.6em 0 1.4em}
.cs-prose .crx-reads__title,.crx-reads__title{font-size:clamp(1.4rem,2.6vw,1.8rem);color:var(--ink,#f4efe3);margin:0 0 .3em}
.cs-prose .crx-reads__sub,.crx-reads__sub{margin:0 0 1em;color:var(--ink-dim,#aeb5a6)}
.crx-reads__grid{display:grid;gap:12px;grid-template-columns:minmax(0,1fr)}
.crx-read{
	position:relative;display:flex;flex-direction:column;gap:6px;
	padding:16px 18px;
	background:var(--panel,#141a15);
	border:var(--stroke,1px) solid var(--edge,var(--line,#2a332b));
	border-radius:var(--radius-s,10px);
	transition:border-color .2s var(--ease,ease),transform .2s var(--ease,ease)
}
.crx-read:hover{border-color:var(--gold,#c9a24b)}
.crx-read:active{transform:scale(.99)}
.cs-prose .crx-read p,.crx-read p{margin:0}
.crx-read__kicker{font-size:.72rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--gold-deep,#9c7a32)}
.cs-prose .crx-read__title,.crx-read__title{font-family:var(--serif,Georgia,serif);font-size:1.12rem;line-height:1.25;margin:0;color:var(--ink,#f4efe3)}
.cs-prose .crx-read__title a,.crx-read__title a{color:inherit;text-decoration:none}
.crx-read__title a::after{content:"";position:absolute;inset:0;border-radius:inherit}
.crx-read__title a:focus-visible{outline:none}
.crx-read:focus-within{outline:2px solid var(--gold,#c9a24b);outline-offset:2px}
.crx-read__text{font-size:.9rem;line-height:1.5;color:var(--ink-dim,#aeb5a6)}
.crx-read__more{margin-top:auto;padding-top:4px;font-size:.88rem;font-weight:600;color:var(--gold-hi,#ecd793)}

/* ---------- Produkt- und Kategorieseiten: breites Raster ---------- */
.crx-reads-wrap{max-width:var(--maxw,1240px);margin:48px auto 0;padding:clamp(28px,4vw,48px) clamp(16px,4vw,40px);border-top:1px solid var(--line,#2a332b)}
.crx-reads-wrap .crx-reads{margin:0}
.crx-reads-wrap .crx-reads__title{text-align:center;font-size:clamp(1.6rem,3vw,2.4rem);margin:0}
.crx-reads-wrap .crx-reads__sub{text-align:center;margin:10px 0 28px}
@media (min-width:760px){
	.crx-reads-wrap .crx-reads__grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
	.crx-reads-wrap .crx-reads__grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
	.crx-reads-wrap .crx-read{padding:22px 24px}
	/* Gleiche Zeilen über alle Karten: Überschriften, Texte und „Weiterlesen“ auf einer Höhe */
	.crx-reads-wrap .crx-reads__grid--2 .crx-read,.crx-reads-wrap .crx-reads__grid--3 .crx-read{display:grid;grid-row:span 4;grid-template-rows:subgrid;row-gap:8px;align-content:start}
}
@media (prefers-reduced-motion:reduce){.crx-read{transition:none}.crx-read:active{transform:none}}