/* Geometry comes from sauna-standard.ts and cardCornerRadiusCss(). */
body[data-design=a] .hero-card-showcase{min-width:0;--card-aspect:63 / 88;--card-radius:5.960% / 4.267%}
body[data-design=a] .hero-card-showcase .hero-front,body[data-design=a] .hero-card-showcase .hero-back{aspect-ratio:var(--card-aspect);height:auto;object-fit:cover;border-radius:var(--card-radius)}
body[data-design=a] .hero-card-showcase .hero-front{z-index:2}
body[data-design=a] .hero-card-showcase .hero-back{z-index:1}
body[data-design=a] .hero-card-info{position:relative;z-index:2;max-width:350px;margin:8px auto 0;padding:17px 18px;background:#10182be8;color:#fff}
body[data-design=a] .hero-card-info[hidden]{display:none}
body[data-design=a] .hero-card-meta{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;color:#d1d6df;font-size:10px;line-height:1.7;letter-spacing:.04em}
body[data-design=a] .hero-card-info h2{font-size:16px;line-height:1.6;letter-spacing:.02em;margin:7px 0 3px}
body[data-design=a] .hero-card-info p{font-size:12px;line-height:1.8;letter-spacing:.02em}
body[data-design=a] .hero-card-tools{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:10px;font-size:10px;white-space:nowrap}
body[data-design=a] .hero-card-tools button{background:none;color:inherit;border:0;border-bottom:1px solid #ffffff50;padding:9px 0;font-size:10px;min-height:36px}
@media(max-width:700px){body[data-design=a] .hero-card-showcase{width:100%;margin-top:22px}body[data-design=a] .hero-card-showcase .hero-cards{margin:0 auto;min-height:290px}body[data-design=a] .hero-card-info{margin-top:5px;padding:14px 13px}body[data-design=a] .hero-card-info h2{font-size:14px}body[data-design=a] .hero-card-meta{font-size:9px;gap:4px 8px}body[data-design=a] .hero-card-tools{gap:8px}body[data-design=a] .hero-card-tools button{min-height:44px}body[data-design=a] .hero-card-info p{font-size:11px}}
/* Swap the previous front/back widths, retaining the canonical card geometry. */
body[data-design=a] .hero-card-showcase .hero-front{width:245px}
body[data-design=a] .hero-card-showcase .hero-back{width:215px;margin-left:70px}
body[data-design=a] .hero-card-info [data-card-number]{display:block;font-size:11px;letter-spacing:.08em;color:#d1d6df}
body[data-design=a] .hero-card-info h2{margin:6px 0 12px}
body[data-design=a] .hero-card-link{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:44px;padding:10px 14px;background:#fff;color:#10182b;font-size:12px;font-weight:600}
body[data-design=a] .hero-card-link[aria-disabled=true]{background:#ffffff15;color:#bfc5ce;cursor:default}
body[data-design=a] [data-link-status]{font-size:10px;color:#cbd0d9;margin-top:4px}
body[data-design=a] [data-link-status][hidden]{display:none}
body[data-design=a] .hero-photo .hero-background{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
body[data-design=a] .hero-background-secondary{opacity:0}
@media(max-width:1000px){body[data-design=a] .hero-card-showcase .hero-front{width:195px}body[data-design=a] .hero-card-showcase .hero-back{width:175px;margin-left:65px}}
@media(max-width:700px){body[data-design=a] .hero-card-showcase .hero-front{width:162px}body[data-design=a] .hero-card-showcase .hero-back{width:145px;margin-left:75px}body[data-design=a] .hero-card-tools{font-size:9px;gap:5px}body[data-design=a] .hero-card-tools button{font-size:9px}body[data-design=a] .hero-card-showcase .hero-cards{width:min(255px,100%)}}
body[data-design=a] [data-link-status]{position:absolute;top:17px;right:18px;margin:0}

body[data-design=a] .hero-photo:after{z-index:2}
/* Mobile: scale the desktop pair together, reserving 16px on each hero edge. */
@media(max-width:700px){
 body[data-design=a] .hero-cta{display:inline-flex;min-height:44px;max-width:100%;margin-top:16px;padding:11px 14px;gap:16px;font-size:12px;line-height:1.5}
 body[data-design=a] .hero-card-showcase .hero-cards{width:calc(100% + 18px);max-width:370px;margin-left:50%;transform:translateX(-50%);min-height:clamp(274px,calc(82.6vw + 8.44px),365px)}
 body[data-design=a] .hero-card-showcase .hero-front{width:52.475%;left:7.046%}
 body[data-design=a] .hero-card-showcase .hero-back{position:absolute;width:46.049%;left:49.725%;right:auto;margin-left:0}
}
/* Compact detail panel without reducing link/touch target sizes. */
body[data-design=a] .hero-card-info{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;column-gap:10px;padding:12px 14px}
body[data-design=a] .hero-card-info [data-card-number]{grid-column:1;white-space:nowrap}
body[data-design=a] .hero-card-info h2{grid-column:2;font-size:15px;line-height:1.5;margin:0}
body[data-design=a] .hero-card-link{grid-column:1/-1;margin-top:9px;gap:10px}
body[data-design=a] .hero-card-tools{grid-column:1/-1;margin-top:3px}
body[data-design=a] [data-link-status]{position:static;margin:0;font-size:10px}
@media(max-width:700px){body[data-design=a] .hero-card-info{padding:12px;column-gap:9px}body[data-design=a] .hero-card-info h2{font-size:14px}body[data-design=a] .hero-card-link{margin-top:8px}}

/* Keep the existing 63:88 silhouette; hide measured bleed without stretching the PNG. */
body[data-design=a] .hero-card-showcase .hero-front{overflow:hidden}
body[data-design=a] .hero-card-showcase .hero-front-image{position:absolute;display:block;max-width:none;height:auto;border-radius:0;filter:none;box-shadow:none}

/* Same perimeter light as the entry banner: two SVG strokes, no raster/filter loop.
   The image clip stays inside the card, leaving the light free around its edge. */
body[data-design=a] .hero-card-showcase .hero-front{overflow:visible}
body[data-design=a] .hero-front-clip{position:absolute;inset:0;overflow:hidden;border-radius:inherit}
body[data-design=a] .hero-back-image{display:block;width:100%;height:100%;object-fit:cover;border-radius:inherit}
body[data-design=a] .hero-edge-light{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
body[data-design=a] .hero-edge-light path{fill:none;stroke-linecap:round}
body[data-design=a] .hero-edge-glow{stroke:rgba(237,232,42,.42);stroke-width:30;stroke-dasharray:640 2315.62;animation:hero-edge-glow 2.8s linear infinite}
body[data-design=a] .hero-edge-core{stroke:#fffbd6;stroke-width:8;stroke-dasharray:380 2575.62;animation:hero-edge-core 2.8s linear infinite}
body[data-design=a] .hero-back .hero-edge-light path{animation-duration:3.6s;animation-delay:-1.2s}
body[data-design=a] .hero-card-showcase[data-visibility=hidden] .hero-edge-light path{animation-play-state:paused}
@keyframes hero-edge-glow{from{stroke-dashoffset:0}to{stroke-dashoffset:-2955.62}}
@keyframes hero-edge-core{from{stroke-dashoffset:-200}to{stroke-dashoffset:-3155.62}}
@media(prefers-reduced-motion:reduce){
 body[data-design=a] .hero-edge-light{display:none}
 body[data-design=a] .hero-edge-light path{animation:none}
}