/* ============================================================
   Prisma Dental — tema exclusivo del Plan Premium
   Se carga DESPUÉS de dental-demo.css y lo sobrescribe donde
   corresponde para que el Premium se sienta claramente superior:
   header oscuro, hero con luces de profundidad, bento-grid,
   insignias y numerales grandes. Nada de esto existe en Básico/Medio.
   ============================================================ */

:root{
  --prm-bg:#08120D;
  --prm-bg-soft:#0F231A;
  --prm-line:rgba(255,255,255,.10);
  --prm-text-dim:rgba(255,255,255,.68);
  --prm-gold:#C9A876;
  --prm-gold-dim:#8B6D3F;
}

/* Acabado "clínica boutique" tipo spa: serif editorial en titulares + tokens
   de fondo/borde en verde salvia/esmeralda (en vez del teal/violeta previos) */
body.premium{
  --font-head:'Fraunces','Poppins',serif;
  --clinic-bg-soft:#F3F8F5;
  --clinic-border:#DCEAE1;
}
body.premium .sec-head h2{position:relative;padding-bottom:18px}
body.premium .sec-head h2::after{
  content:"";position:absolute;left:50%;bottom:0;transform:translateX(-50%);
  width:56px;height:2px;background:linear-gradient(90deg,transparent,var(--prm-gold),transparent);
}

/* Barra de progreso de scroll (dorada, fija sobre el header) */
.prm-scroll-progress{
  position:fixed;top:0;left:0;height:3px;width:0%;z-index:150;
  background:linear-gradient(90deg,var(--prm-gold),var(--prm-gold-dim));
  transition:width .08s linear;pointer-events:none;
}

/* Tarjetas "vivas": inclinación holográfica al pasar el mouse
   (misma técnica que depth.js en el sitio principal, S7) */
body.premium .grid-3,body.premium .prm-bento{perspective:1100px}
body.premium .team-card,body.premium .testi-card,body.premium .prm-bento-side{
  transform-style:preserve-3d;position:relative;
  transition:transform .12s ease,box-shadow .3s ease,border-color .3s ease;
}
body.premium .team-card::after,body.premium .testi-card::after,body.premium .prm-bento-side::after{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:3;
  background:radial-gradient(260px circle at var(--mx,50%) var(--my,50%),rgba(159,227,196,.30),rgba(201,168,118,.14) 45%,transparent 65%);
  opacity:0;transition:opacity .35s ease;
}
body.premium .team-card:hover::after,body.premium .testi-card:hover::after,body.premium .prm-bento-side:hover::after{opacity:1}

/* Ticket de confirmación de cita (citas.html) — reemplaza el check simple */
body.premium .ticket-divider{
  position:relative;height:0;border-top:2px dashed var(--clinic-border);margin:20px -30px;
}
body.premium .ticket-divider::before,body.premium .ticket-divider::after{
  content:"";position:absolute;top:-11px;width:22px;height:22px;border-radius:50%;background:var(--clinic-bg-soft);
}
body.premium .ticket-divider::before{left:-11px}
body.premium .ticket-divider::after{right:-11px}
body.premium .ticket-code{display:flex;flex-direction:column;gap:4px;margin-bottom:16px}
body.premium .ticket-code span{font-size:.76rem;color:var(--clinic-muted);text-transform:uppercase;letter-spacing:.06em}
body.premium .ticket-code strong{font-family:'Fraunces',serif;font-size:1.5rem;color:var(--clinic-ink);letter-spacing:.02em}
body.premium .ticket-bars{display:flex;align-items:flex-end;gap:3px;height:34px}
body.premium .ticket-bars span{display:block;width:3px;background:var(--clinic-ink);opacity:.35;border-radius:1px}

/* Comilla decorativa dorada en testimonios */
body.premium .testi-card{overflow:hidden}
body.premium .testi-card::before{
  content:"\201C";position:absolute;top:6px;right:18px;font-family:'Fraunces',serif;
  font-size:4.4rem;line-height:1;color:var(--prm-gold);opacity:.32;pointer-events:none;z-index:0;
}
body.premium .testi-card p{position:relative;z-index:1}

/* Glow orbs (misma técnica que thebrothersapp.com — Edge-safe, sin backdrop-filter) */
.prm-orbs{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}
.prm-orb{position:absolute;border-radius:50%;filter:blur(70px)}
.prm-orb-1{width:520px;height:520px;left:-10%;top:-15%;background:radial-gradient(circle,rgba(47,122,92,.55),transparent 68%)}
.prm-orb-2{width:460px;height:460px;right:-8%;top:10%;background:radial-gradient(circle,rgba(63,174,130,.40),transparent 68%)}
.prm-orb-3{width:380px;height:380px;left:30%;bottom:-20%;background:radial-gradient(circle,rgba(159,227,196,.28),transparent 68%)}

/* Header oscuro y fijo — distinto a los headers blancos de Básico/Medio */
body.premium .dh-header{
  background:rgba(8,18,13,.92);
  border-bottom:1px solid var(--prm-line);
}
body.premium .dh-logo{color:#fff}
body.premium .dh-nav a{color:var(--prm-text-dim)}
body.premium .dh-nav a:hover{color:#fff}
@media (max-width:900px){
  body.premium .dh-nav{background:var(--prm-bg)}
  body.premium .dh-nav a{color:rgba(255,255,255,.85)}
}
body.premium .dh-toggle span{background:#fff}

/* Hero oscuro con profundidad */
.prm-hero{
  position:relative;overflow:hidden;background:var(--prm-bg);
  padding:96px 0 110px;
}
.prm-hero .container{position:relative;z-index:1}
.prm-hero .dh-hero-inner{display:grid;grid-template-columns:1.1fr .9fr;gap:56px;align-items:center}
@media (max-width:900px){.prm-hero .dh-hero-inner{grid-template-columns:1fr}}
.prm-hero .dh-hero-inner > *{min-width:0}
.prm-eyebrow{
  display:inline-flex;align-items:center;gap:8px;
  background:rgba(63,174,130,.14);border:1px solid rgba(63,174,130,.35);color:#CFF0DE;
  font-weight:700;font-size:.8rem;letter-spacing:.03em;padding:7px 14px;border-radius:999px;margin-bottom:20px;
}
.prm-eyebrow .dot{width:6px;height:6px;border-radius:50%;background:#4ADE80;box-shadow:0 0 0 3px rgba(74,222,128,.25)}
.prm-hero h1{
  font-family:var(--font-head);color:#fff;font-size:clamp(2.3rem,4.6vw,3.5rem);line-height:1.12;margin-bottom:18px;
}
.prm-hero h1 .grad{background:linear-gradient(90deg,#9FE3C4,#3FAE82);-webkit-background-clip:text;background-clip:text;color:transparent}
.prm-hero p.lead{color:var(--prm-text-dim);font-size:1.12rem;max-width:48ch}
.prm-hero .dh-hero-actions{margin-top:28px}
.prm-hero .btn-primary{background:linear-gradient(90deg,#2F7A5C,#1F5A42);box-shadow:0 18px 40px -14px rgba(47,122,92,.65)}
.prm-hero .btn-outline{background:transparent;border-color:rgba(255,255,255,.28);color:#fff}
.prm-hero .btn-outline:hover{border-color:#fff}
.prm-hero .dh-trust-item{color:var(--prm-text-dim)}
.prm-hero .dh-trust-item svg{color:#6FCBA0}

.prm-glass-card{
  position:relative;border-radius:24px;overflow:hidden;
  background:linear-gradient(160deg,rgba(63,174,130,.16),rgba(255,255,255,.03));
  border:1px solid rgba(255,255,255,.14);
  aspect-ratio:4/3.3;display:flex;align-items:center;justify-content:center;
}
.prm-glass-card svg{width:44%;height:44%;color:#9FE3C4}
.prm-glass-float{
  position:absolute;bottom:18px;left:18px;right:18px;
  background:rgba(15,35,26,.9);border:1px solid rgba(255,255,255,.14);border-radius:14px;padding:14px 16px;
  display:flex;align-items:center;gap:12px;
}
.prm-glass-float .ico{width:38px;height:38px;border-radius:10px;background:rgba(63,174,130,.22);color:#9FE3C4;display:flex;align-items:center;justify-content:center;flex:none}
.prm-glass-float strong{display:block;font-size:.9rem;color:#fff}
.prm-glass-float span{font-size:.78rem;color:var(--prm-text-dim)}

/* Insignias de confianza */
.prm-badges{background:var(--prm-bg);border-top:1px solid var(--prm-line);padding:26px 0}
.prm-badges .row{display:flex;justify-content:center;gap:36px;flex-wrap:wrap}
.prm-badge{display:flex;align-items:center;gap:9px;color:var(--prm-text-dim);font-size:.86rem;font-weight:600}
.prm-badge svg{color:#6FCBA0;flex:none}

/* Bento grid — sección "Por qué Premium" */
.prm-bento{display:grid;grid-template-columns:1.3fr 1fr;grid-template-rows:auto auto;gap:20px}
@media (max-width:860px){.prm-bento{grid-template-columns:1fr}}
.prm-bento-main{
  grid-row:1/3;background:linear-gradient(160deg,var(--clinic-ink),#17301F);
  border-radius:22px;padding:34px;color:#fff;position:relative;overflow:hidden;
  display:flex;flex-direction:column;justify-content:space-between;min-height:340px;
}
.prm-bento-main::after{content:'';position:absolute;inset:0;background:radial-gradient(circle at 85% 15%,rgba(63,174,130,.35),transparent 60%)}
.prm-bento-main > *{position:relative;z-index:1}
.prm-bento-main .pill{background:rgba(63,174,130,.2);color:#CFF0DE}
.prm-bento-main h3{font-size:1.4rem;margin:14px 0 10px;color:#fff}
.prm-bento-main p{color:rgba(255,255,255,.72);margin:0}
.prm-bento-chat{margin-top:20px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:14px;padding:14px}
.prm-bento-chat .ai-msg{margin-bottom:8px;font-size:.82rem}
.prm-bento-chat .ai-msg.bot{background:rgba(255,255,255,.08);color:#fff;border-color:rgba(255,255,255,.14)}
.prm-bento-chat .ai-msg.user{background:#2F7A5C}
.prm-bento-side{
  background:var(--clinic-bg-soft);border:1px solid var(--clinic-border);border-radius:22px;padding:26px;
  transition:transform .2s ease,box-shadow .2s ease;
}
.prm-bento-side:hover{transform:translateY(-3px);box-shadow:var(--clinic-shadow)}
.prm-bento-side .svc-ico{margin-bottom:14px}
.prm-bento-side h3{font-size:1.05rem}
.prm-bento-side p{color:var(--clinic-muted);font-size:.9rem;margin:0}

/* Numerales grandes — "Cómo funciona" */
.prm-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:26px;position:relative}
@media (max-width:860px){.prm-steps{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.prm-steps{grid-template-columns:1fr}}
.prm-step{position:relative;padding-top:8px}
.prm-step .num{
  font-family:var(--font-head);font-weight:800;font-size:2.6rem;
  background:linear-gradient(180deg,var(--prm-gold),transparent);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  -webkit-text-stroke:1.5px var(--prm-gold);
}
.prm-step h3{font-size:1rem;margin:6px 0 6px}
.prm-step p{color:var(--clinic-muted);font-size:.88rem;margin:0}

/* Cotizador interactivo de tratamientos */
.prm-quoter{
  background:#fff;border:1px solid var(--clinic-border);border-radius:var(--clinic-radius);
  padding:32px;box-shadow:var(--clinic-shadow);
}
.prm-quoter-chips{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:26px}
.prm-chip{
  background:var(--clinic-bg-soft);border:1px solid var(--clinic-border);border-radius:999px;
  padding:9px 18px;font-size:.88rem;font-weight:600;color:var(--clinic-ink);cursor:pointer;
  transition:background .2s ease,color .2s ease,border-color .2s ease;
}
.prm-chip:hover{border-color:var(--clinic-primary)}
.prm-chip.active{background:var(--clinic-primary);border-color:var(--clinic-primary);color:#fff}
.prm-quoter-slider{margin-bottom:24px}
.prm-quoter-slider label{display:block;font-size:.9rem;font-weight:600;margin-bottom:10px;color:var(--clinic-ink)}
.prm-quoter-slider input[type=range]{width:100%;accent-color:var(--clinic-primary)}
.prm-quoter-result{display:flex;flex-wrap:wrap;gap:26px;align-items:flex-end;padding-top:18px;border-top:1px solid var(--clinic-border)}
.prm-quoter-price span,.prm-quoter-plan span{display:block;font-size:.8rem;color:var(--clinic-muted);margin-bottom:4px}
.prm-quoter-price strong{font-family:'Fraunces',serif;font-size:2.4rem;color:var(--clinic-primary-dark);display:inline-block}
.prm-quoter-plan strong{font-family:'Fraunces',serif;font-size:1.4rem;color:var(--clinic-ink);display:inline-block}
.prm-quoter-note{font-size:.78rem;color:var(--clinic-muted);margin-top:16px}
.prm-quoter-price strong.pulse,.prm-quoter-plan strong.pulse{animation:prmPulse .3s ease}
@keyframes prmPulse{0%{transform:scale(1.1)}100%{transform:scale(1)}}
@media (prefers-reduced-motion: reduce){
  .prm-quoter-price strong.pulse,.prm-quoter-plan strong.pulse{animation:none}
}

/* Teaser del panel de reportes (index.html) */
.prm-panel-teaser{
  display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center;
  background:var(--clinic-ink);border-radius:24px;padding:40px;color:#fff;
}
@media (max-width:820px){.prm-panel-teaser{grid-template-columns:1fr}}
.prm-panel-teaser-text .sec-eyebrow{color:var(--prm-gold)}
.prm-panel-teaser-text p{color:rgba(255,255,255,.72)}
.prm-panel-teaser-preview{display:flex;flex-direction:column;gap:14px}
.mini-kpi{
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);border-radius:14px;
  padding:14px 18px;display:flex;justify-content:space-between;align-items:center;
}
.mini-kpi span{font-size:.82rem;color:rgba(255,255,255,.65)}
.mini-kpi strong{font-family:'Fraunces',serif;font-size:1.3rem;color:#fff}

/* Panel de reportes (panel.html) — badge en vivo, dona y barras animadas */
.panel-live-badge{
  display:inline-flex;align-items:center;gap:6px;font-size:.72rem;font-weight:700;
  color:#16A34A;background:#DCFCE7;border-radius:999px;padding:4px 10px;margin-left:10px;vertical-align:middle;
}
.panel-live-badge .dot{width:6px;height:6px;border-radius:50%;background:#16A34A;animation:panelLivePulse 1.6s ease-in-out infinite}
@keyframes panelLivePulse{
  0%,100%{opacity:1;box-shadow:0 0 0 0 rgba(22,163,74,.5)}
  50%{opacity:.6;box-shadow:0 0 0 5px rgba(22,163,74,0)}
}
.bar-fill{transition:width 1.1s cubic-bezier(.16,1,.3,1)}
.kpi-donut{display:flex;flex-direction:column;align-items:flex-start}
.donut-wrap{position:relative;width:84px;height:84px;margin:8px 0}
.donut-ring{width:84px;height:84px;transform:rotate(-90deg)}
.donut-track{fill:none;stroke:var(--clinic-bg-soft);stroke-width:8}
.donut-fill{
  fill:none;stroke:var(--clinic-primary);stroke-width:8;stroke-linecap:round;
  stroke-dasharray:213.6;stroke-dashoffset:213.6;transition:stroke-dashoffset 1.2s cubic-bezier(.16,1,.3,1);
}
.donut-value{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:var(--font-head);font-weight:700;font-size:1.05rem;color:var(--clinic-ink)}
@media (prefers-reduced-motion: reduce){
  .bar-fill,.donut-fill{transition:none}
  .panel-live-badge .dot{animation:none}
}

/* Dark stats band */
.prm-stats-band{background:var(--prm-bg);padding:64px 0;position:relative;overflow:hidden}
.prm-stats-band .stats-bar .stat-item strong{color:#fff;-webkit-text-fill-color:#fff}
.prm-stats-band .stats-bar strong{background:linear-gradient(90deg,#9FE3C4,#3FAE82);-webkit-background-clip:text;background-clip:text;color:transparent}
.prm-stats-band .stat-item span{color:var(--prm-text-dim)}