/* ==========================================================================
   TerzaPower 10mg — theme + unique sections (loads product_page_base.css)
   Sapphire "clinical precision". Unique: interlocking rings hero, dual-receptor
   + radial gauge signature, evidence grid, effects.
   ========================================================================== */

.pdp-page.theme-ten {
    --pdp-bg: #0a1327;
    --pdp-bg2: #0d1c38;
    --pdp-ink: #eaf1ff;
    --pdp-muted: #93a7cc;
    --pdp-accent: #38bdf8;
    --pdp-accent2: #7c6cff;
    --pdp-accent-ink: #06132a;
    --pdp-line: rgba(255,255,255,.09);
    --pdp-card: rgba(255,255,255,.04);
    --pdp-glass: rgba(13,28,56,.6);
    --pdp-alt-mid: #0f2244;
    --pdp-hero-bg:
        radial-gradient(85% 70% at 75% 15%, rgba(56,189,248,.16), transparent 55%),
        radial-gradient(70% 60% at 15% 95%, rgba(124,108,255,.12), transparent 55%),
        linear-gradient(180deg, var(--pdp-bg2), var(--pdp-bg));
    --pdp-cta-bg:
        radial-gradient(90% 120% at 0% 0%, rgba(56,189,248,.14), transparent 55%),
        linear-gradient(180deg, #0f2244, var(--pdp-bg));
}

/* hero motif — interlocking receptor rings */
.theme-ten .tzt-hglow { position: absolute; width: 60%; aspect-ratio: 1; border-radius: 50%; background: radial-gradient(circle, rgba(56,189,248,.28), transparent 65%); filter: blur(10px); animation: tzt-pulse 6s ease-in-out infinite; }
@keyframes tzt-pulse { 0%,100% { transform: scale(.96); opacity: .8; } 50% { transform: scale(1.06); opacity: 1; } }
.theme-ten .tzt-dualring { position: absolute; inset: 0; display: grid; place-items: center; }
.theme-ten .tzt-ringrot { position: absolute; width: 84%; aspect-ratio: 1; animation: tzt-spin 26s linear infinite; }
.theme-ten .tzt-ringrot svg { width: 100%; height: 100%; }
.theme-ten .tzt-vial { position: relative; z-index: 2; max-height: 76%; max-width: 58%; filter: drop-shadow(0 30px 50px rgba(0,0,0,.55)); animation: tzt-float 7s ease-in-out infinite; }
@keyframes tzt-float { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-14px); } }
@keyframes tzt-spin { to { transform: rotate(360deg); } }

/* signature — dual receptor + radial gauge */
.theme-ten .tzt-dual { display: grid; grid-template-columns: 1fr 1.1fr 1fr; gap: 22px; align-items: center; }
.theme-ten .tzt-recept { padding: 30px; border-radius: 20px; border: 1px solid var(--pdp-line); background: linear-gradient(160deg, rgba(56,189,248,.08), rgba(255,255,255,.02)); }
.theme-ten .tzt-recept .tag { font-size: .72rem; letter-spacing: .18em; text-transform: uppercase; color: var(--pdp-accent2); font-weight: 700; }
.theme-ten .tzt-recept h3 { font-size: 1.3rem; margin: 8px 0 8px; }
.theme-ten .tzt-recept p { color: var(--pdp-muted); line-height: 1.55; margin: 0; }
.theme-ten .tzt-gauge { display: grid; place-items: center; text-align: center; }
.theme-ten .tzt-gauge svg { width: min(230px, 60vw); height: min(230px, 60vw); transform: rotate(-90deg); }
.theme-ten .tzt-gauge .bg { fill: none; stroke: var(--pdp-line); stroke-width: 10; }
.theme-ten .tzt-gauge .fg { fill: none; stroke: url(#tzt-grad); stroke-width: 10; stroke-linecap: round; stroke-dasharray: var(--circ); stroke-dashoffset: var(--circ); transition: stroke-dashoffset 1.6s cubic-bezier(.2,.7,.2,1); }
.theme-ten .tzt-gauge.is-visible .fg { stroke-dashoffset: var(--off); }
.theme-ten .tzt-gauge-label { margin-top: -54%; }
.theme-ten .tzt-gauge-num { font-size: clamp(2.2rem, 5vw, 3rem); font-weight: 850; letter-spacing: -.03em; background: linear-gradient(120deg, var(--pdp-accent), var(--pdp-accent2)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.theme-ten .tzt-gauge-cap { color: var(--pdp-muted); font-size: .82rem; margin-top: 2px; }

/* evidence grid */
.theme-ten .tzt-ev { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.theme-ten .tzt-evcard { padding: 26px 22px; border-radius: 18px; background: var(--pdp-card); border: 1px solid var(--pdp-line); transition: transform .25s ease, border-color .25s ease; }
.theme-ten .tzt-evcard:hover { transform: translateY(-5px); border-color: rgba(56,189,248,.5); }
.theme-ten .tzt-evcard h3 { margin: 0 0 8px; font-size: 1.06rem; }
.theme-ten .tzt-evcard p { color: var(--pdp-muted); line-height: 1.5; margin: 0; font-size: .9rem; }

/* effects */
.theme-ten .tzt-effects { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.theme-ten .tzt-effect { display: flex; gap: 12px; align-items: center; padding: 18px; border-radius: 14px; background: var(--pdp-card); border: 1px solid var(--pdp-line); }
.theme-ten .tzt-effect .spark { flex: 0 0 auto; width: 30px; height: 30px; border-radius: 9px; display: grid; place-items: center; background: rgba(56,189,248,.14); color: var(--pdp-accent); }
.theme-ten .tzt-effect span { font-weight: 600; font-size: .95rem; line-height: 1.3; }

@media (prefers-reduced-motion: reduce) {
    .theme-ten .tzt-ringrot, .theme-ten .tzt-vial, .theme-ten .tzt-hglow { animation: none !important; }
}
@media (max-width: 900px) {
    .theme-ten .tzt-dual { grid-template-columns: 1fr; }
    .theme-ten .tzt-gauge { order: -1; }
    .theme-ten .tzt-ev { grid-template-columns: 1fr 1fr; }
    .theme-ten .tzt-effects { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 520px) {
    .theme-ten .tzt-ev, .theme-ten .tzt-effects { grid-template-columns: 1fr; }
}
