body.sl-sadesati-product .astro-hero { padding-top:clamp(48px,6vw,78px); }
body.sl-sadesati-product .astro-hero h1 { font-size:clamp(48px,5vw,70px); }

.sade-principle-card { min-height:620px; padding-top:48px; }
.sade-planet-pair { position:absolute; z-index:0; top:26px; right:32px; display:flex; align-items:center; gap:7px; opacity:.36; pointer-events:none; }
.sade-planet-pair img { display:block; object-fit:contain; }
.sade-principle-card .sl-section-kicker,
.sade-principle-card h2 { max-width:420px; }
.sade-stage-list { display:grid; gap:8px; margin:26px 0 0; padding:0; list-style:none; }
.sade-stage-list li { display:grid; grid-template-columns:42px minmax(0,1fr); gap:14px; align-items:center; padding:14px 16px; border:1px solid var(--sl-line); border-radius:15px; background:var(--sl-bg-deep); }
.sade-stage-list li.is-central { border-color:var(--sl-line-strong); background:var(--sl-surface); }
.sade-stage-list li>span { color:var(--sl-copper); font:400 13px/1 var(--sl-yoo-font-heading, "Playfair Display",Georgia,serif); }
.sade-stage-list small,.sade-stage-list strong { display:block; }
.sade-stage-list small { margin-bottom:3px; color:var(--sl-dim); font-size:10px; letter-spacing:.08em; text-transform:uppercase; }
.sade-stage-list strong { font:400 17px/1.2 var(--sl-yoo-font-heading, "Playfair Display",Georgia,serif); }

.sade-value-grid { grid-template-columns:repeat(3,1fr); }
.sade-value-grid .astro-value-featured { grid-column:span 2; }
.sade-value-grid .astro-value-featured p { max-width:650px; padding-right:140px; }
.sade-value-grid .astro-value-icon img { width:28px; height:28px; object-fit:contain; }
.sade-cycle-sample { position:absolute; right:28px; bottom:28px; left:28px; display:grid; grid-template-columns:repeat(3,1fr); gap:7px; }
.sade-cycle-sample span { padding:9px 8px; border:1px solid var(--sl-line); border-radius:10px; color:var(--sl-dim); font-size:11px; text-align:center; }
.sade-cycle-sample span.is-current { border-color:var(--sl-line-strong); color:var(--sl-copper-bright); background:var(--sl-surface-warm); }

/* These labels carry the period structure, so use the readable secondary role. */
body.sl-sadesati-product .sade-stage-list small { color:var(--sl-muted); font-size:12px; }
body.sl-sadesati-product .sade-cycle-sample span:not(.is-current),
body.sl-sadesati-product .sade-value-grid .astro-value-number { color:var(--sl-muted); }

html[data-theme="light"] body.sl-sadesati-product .sade-planet-pair { opacity:.52; }

@media (max-width:1080px) {
    .sade-principle-card { min-height:0; }
}

@media (max-width:720px) {
    body.sl-sadesati-product .astro-hero h1 { font-size:clamp(43px,12vw,58px); }
    .sade-principle-card { padding-top:32px; }
    .sade-planet-pair { top:22px; right:20px; transform:scale(.78); transform-origin:top right; }
    .sade-principle-card .sl-section-kicker,
    .sade-principle-card h2 { max-width:calc(100% - 64px); }
    .sade-value-grid { grid-template-columns:1fr; }
    .sade-value-grid .astro-value-featured { grid-column:auto; }
    .sade-value-grid .astro-value-featured p { padding-right:0; }
    .sade-cycle-sample { position:static; margin-top:24px; }
    .astro-contrast article>a { grid-column:1/-1; min-width:0; white-space:normal; justify-self:start; }
}

@media (prefers-reduced-motion:reduce) {
    .sade-planet-pair { transition:none; }
}
