/* ============================================================
   PREMIUM DESIGN LAYER — Carolina Escalante (2026-09)
   Editorial Luxury: crema cálido + violeta profundo + dorado.
   Se carga DESPUÉS de style.css y sobrescribe la superficie pública.
   ============================================================ */

:root{
  --p-bg:#FAF7F2;            /* crema cálido base */
  --p-bg-soft:#F2ECFF;       /* violeta-lavanda suave */
  --p-ink:#1C1427;           /* texto principal (púrpura-espresso) */
  --p-muted:#6E6476;         /* texto secundario */
  --p-primary:#5B2A9D;       /* violeta profundo */
  --p-primary-2:#7C3AED;     /* violeta vivo */
  --p-primary-3:#B79CED;     /* violeta claro */
  --p-gold:#C9A227;          /* dorado sereno (acento) */
  --p-gold-soft:#EFE3BC;     /* dorado suave */
  --p-surface:#FFFFFF;
  --p-line:#E9E1F6;          /* hairline violeta claro */
  --p-grain:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="120" height="120"><filter id="n"><feTurbulence type="fractalNoise" baseFrequency="0.8" numOctaves="2"/></filter><rect width="100%25" height="100%25" filter="url(%23n)" opacity="0.035"/></svg>');
  --p-shadow:0 30px 70px -30px rgba(91,42,157,.25);
  --p-shadow-soft:0 16px 40px -24px rgba(91,42,157,.18);
  --p-ease:cubic-bezier(.32,.72,0,1);
}

/* ---- Tipografía premium ---- */
body{
  font-family:'Plus Jakarta Sans','Inter',system-ui,sans-serif;
  background:var(--p-bg);
  color:var(--p-ink);
  letter-spacing:.01em;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4,h5,.hero-min-headline,.service-card h4,.card h4,.card h3{
  font-family:'Playfair Display',Georgia,serif;
  letter-spacing:-.02em;
}
::selection{ background:var(--p-primary-3); color:#1C1427; }

/* ---- Grano de película (solo fixed, pointer-events none) ---- */
body::after{
  content:""; position:fixed; inset:0; z-index:2147483000;
  background:var(--p-grain); pointer-events:none; opacity:.5;
}

/* ---- Eyebrow tags ---- */
.eyebrow{
  display:inline-flex; align-items:center; gap:8px;
  font-family:'Plus Jakarta Sans',sans-serif; font-size:11px; font-weight:600;
  letter-spacing:.22em; text-transform:uppercase; color:var(--p-primary-2);
  background:var(--p-surface); border:1px solid var(--p-line);
  padding:8px 16px; border-radius:100px; box-shadow:var(--p-shadow-soft);
}

/* ---- Navbar: píldora flotante de cristal ---- */
.navbar.navbar-light.fixed-top{
  background:rgba(250,247,242,.72) !important;
  backdrop-filter:blur(18px) saturate(1.4);
  -webkit-backdrop-filter:blur(18px) saturate(1.4);
  border-bottom:1px solid rgba(233,225,246,.6);
  box-shadow:0 6px 30px -18px rgba(91,42,157,.2);
}
.navbar .navbar-brand{ font-family:'Playfair Display',serif; font-weight:700; color:var(--p-primary); }
.navbar .navbar-brand .brand-title{ font-size:1.2rem; font-weight:700; color:var(--p-primary); letter-spacing:-.01em; }
.navbar .navbar-brand .brand-subtitle{ font-size:.95rem; font-weight:500; color:var(--p-muted); }
.navbar .brand-icon{
  width:48px; height:48px; font-size:1.35rem;
  background:linear-gradient(135deg,var(--p-primary),var(--p-primary-2));
  color:#fff; box-shadow:0 8px 20px -8px rgba(124,58,237,.55);
}
.navbar .nav-link, .navbar a{ color:var(--p-muted); font-weight:500; }
.navbar .nav-link:hover{ color:var(--p-primary); }

/* ---- Hero: editorial con profundidad ---- */
.hero-min{
  padding:clamp(5rem,10vw,7.5rem) 0 clamp(4rem,8vw,6rem);
  background:
    radial-gradient(1000px 560px at 88% -10%, rgba(124,58,237,.16), transparent 60%),
    radial-gradient(760px 480px at -5% 15%, rgba(201,162,39,.12), transparent 55%),
    linear-gradient(180deg,#FFF 0%, var(--p-bg-soft) 100%);
}
.hero-min-grid{ gap:clamp(2rem,6vw,5rem); }
.hero-min-headline{
  font-size:clamp(2.7rem,5.8vw,4.6rem); font-weight:700; line-height:1.03;
  color:var(--p-ink);
}
.hero-min-headline .text-purple{
  background:linear-gradient(120deg,var(--p-primary-2),var(--p-primary));
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
  position:relative;
}
.hero-min-sub{ font-size:clamp(1.02rem,1.6vw,1.2rem); color:var(--p-muted); }
.hero-stars{ color:var(--p-gold); letter-spacing:2px; }
.hero-proof-num{ color:var(--p-muted); }
.min-photo{
  border-radius:34px; border:6px solid var(--p-surface);
  box-shadow:0 40px 90px -30px rgba(91,42,157,.45);
}
.min-card{
  border-radius:20px; border:1px solid var(--p-line);
  background:rgba(255,255,255,.9); backdrop-filter:blur(10px);
  box-shadow:var(--p-shadow);
}
.hero-t-card{
  background:var(--p-surface); border:1px solid var(--p-line); border-radius:18px;
  box-shadow:var(--p-shadow-soft);
}
.hero-t-stars{ color:var(--p-gold); }

/* ---- Cards: doble bisel (doble borde anidado) ---- */
.service-card, .card, .portal-card, .guia-block, .planes-card{
  position:relative;
  background:var(--p-surface);
  border:1px solid var(--p-line);
  border-radius:24px;
  box-shadow:var(--p-shadow-soft);
  transition:transform .6s var(--p-ease), box-shadow .6s var(--p-ease);
}
.service-card:hover, .card:hover{
  transform:translateY(-6px);
  box-shadow:var(--p-shadow);
}
.service-icon, .card .ico{
  background:linear-gradient(135deg,var(--p-primary),var(--p-primary-2));
  color:#fff;
  box-shadow:0 14px 28px -10px rgba(124,58,237,.5);
}

/* ---- Card destacada (invertida, rompe monotonía del grid) ---- */
.service-card--featured{
  background:linear-gradient(160deg,var(--p-primary) 0%, #431a7a 100%);
  border-color:transparent;
  color:#fff;
  box-shadow:var(--p-shadow);
}
.service-card--featured h4{ color:#fff; }
.service-card--featured p{ color:rgba(255,255,255,.84); }
.service-card--featured .service-list li{ color:rgba(255,255,255,.92); }
.service-card--featured .service-list .bi{ color:var(--p-gold); }
.service-card--featured .service-price strong{ color:#fff; }
.service-card--featured .service-icon{
  background:rgba(255,255,255,.14); color:#fff; box-shadow:none;
}

/* ---- Botones: píldora premium con flecha anidada ---- */
.btn-primary, .btn-success, .min-btn-primary, .btn-comprar, .comprar-paquete,
.btn-agendar, a.btn-primary{
  background:linear-gradient(135deg,var(--p-primary),var(--p-primary-2));
  border:none; border-radius:100px; font-weight:600; color:#fff;
  box-shadow:0 16px 34px -12px rgba(124,58,237,.55);
  transition:transform .3s var(--p-ease), box-shadow .3s var(--p-ease);
}
.btn-primary:hover, .min-btn-primary:hover, .comprar-paquete:hover{
  transform:translateY(-2px) scale(1.01);
  box-shadow:0 22px 44px -14px rgba(124,58,237,.65);
}
.btn-primary:active, .min-btn-primary:active{ transform:scale(.97); }
.btn-outline-primary, .btn-outline-secondary, .min-btn-secondary, .btn-outline-success{
  border-radius:100px; font-weight:600; border-width:1.5px;
}
.min-btn-primary, .min-btn-secondary{ height:54px; border-radius:50px; }

/* ---- Espaciado macro (deja respirar) ---- */
section, .sec{ padding:clamp(3.5rem,8vw,6rem) 0; }
.page-header{ padding:clamp(6rem,12vw,9rem) 0 2rem; }
.footer, footer{ border-top:1px solid var(--p-line); color:var(--p-muted); }

/* ---- Section headings editorial ---- */
.section-title, .page-header h1, .sec-head h2, h2{
  color:var(--p-ink);
}
.section-title span, .eyebrow + h2, .sec-head h2{ color:var(--p-ink); }

/* ---- Scroll reveal (JS añade clase .in) ---- */
.reveal{ opacity:0; transform:translateY(40px); transition:opacity .9s var(--p-ease), transform .9s var(--p-ease); }
.reveal.in{ opacity:1; transform:none; }

/* ---- Panel CTA final (violeta profundo con glow dorado) ---- */
.cta-panel{
  position:relative; overflow:hidden;
  display:grid; grid-template-columns:1.2fr auto; gap:2.5rem; align-items:center;
  background:
    radial-gradient(620px 320px at 100% 0%, rgba(201,162,39,.28), transparent 60%),
    linear-gradient(135deg,var(--p-primary) 0%, #431a7a 100%);
  color:#fff; border-radius:32px; padding:clamp(2.5rem,6vw,4.5rem);
  box-shadow:var(--p-shadow);
}
.cta-panel h2{ color:#fff; margin:0 0 .75rem; }
.cta-panel-sub{ color:rgba(255,255,255,.86); max-width:52ch; margin:0; }
.cta-panel-actions{ display:flex; gap:1rem; flex-wrap:wrap; }
.cta-panel .btn-light{ color:var(--p-primary); font-weight:700; }
@media (max-width:860px){
  .cta-panel{ grid-template-columns:1fr; text-align:center; }
  .cta-panel-actions{ justify-content:center; }
}

/* ---- Responsive ---- */
@media (max-width:768px){
  .hero-min{ padding:clamp(3.5rem,9vw,5rem) 24px 3rem; }
  .min-photo{ border-radius:26px; }
  .service-card,.card{ border-radius:20px; }
}
@media (prefers-reduced-motion: reduce){
  .reveal{ opacity:1; transform:none; transition:none; }
  .service-card:hover,.card:hover{ transform:none; }
}

/* ============================================================
   REFINAMIENTO PREMIUM v2 — profundidad, secciones, interacción,
   tipografía y consistencia.
   ============================================================ */

/* ---- Profundidad del hero: capas de luz ---- */
.hero-min{ position:relative; overflow:hidden; }
.hero-min::before{ /* glow dorado superior */
  content:""; position:absolute; top:-10%; left:12%; width:55%; height:45%;
  background:radial-gradient(closest-side, rgba(201,162,39,.18), transparent 72%);
  pointer-events:none;
}
.hero-min::after{ /* glow violeta inferior */
  content:""; position:absolute; bottom:-8%; right:-6%; width:55%; height:50%;
  background:radial-gradient(closest-side, rgba(124,58,237,.15), transparent 72%);
  pointer-events:none;
}

/* ---- Entrada escalonada (hero: izquierda luego derecha) ---- */
.hero-min .hero-min-left.reveal{ transition-delay:.05s; }
.hero-min .hero-min-right.reveal{ transition-delay:.22s; }

/* ---- Stagger en grillas (cards aparecen en cascada) ---- */
.row > .col-lg-4.reveal:nth-child(1){ transition-delay:.04s; }
.row > .col-lg-4.reveal:nth-child(2){ transition-delay:.14s; }
.row > .col-lg-4.reveal:nth-child(3){ transition-delay:.24s; }
.row > .col-lg-4.reveal:nth-child(4){ transition-delay:.32s; }
.row > .col-lg-6.reveal:nth-child(1){ transition-delay:.05s; }
.row > .col-lg-6.reveal:nth-child(2){ transition-delay:.18s; }

/* ---- Tipografía: escala y aire editorial ---- */
.lead{ font-size:1.13rem; line-height:1.75; color:var(--p-muted); }
.hero-min-headline{ letter-spacing:-.025em; }
.hero-min-sub{ line-height:1.65; }
section h2, .section-title{ letter-spacing:-.02em; }
.page-header h1{ font-size:clamp(2rem,4vw,3rem); letter-spacing:-.02em; }
.page-header p{ color:var(--p-muted); font-size:1.05rem; }
.eyebrow{ letter-spacing:.24em; }

/* ---- Interacción: micro-movimiento con propósito ---- */
.min-card, .hero-t-card{
  transition:transform .55s var(--p-ease), box-shadow .55s var(--p-ease);
}
.min-card:hover{ transform:translateY(-5px); box-shadow:var(--p-shadow); }
.hero-t-card:hover{ transform:translateY(-3px); box-shadow:var(--p-shadow-soft); }
.navbar .nav-link{ position:relative; }
.navbar .nav-link::after{
  content:""; position:absolute; left:50%; bottom:.2rem; width:0; height:2px;
  background:linear-gradient(90deg,var(--p-primary),var(--p-primary-2));
  border-radius:2px; transform:translateX(-50%);
  transition:width .3s var(--p-ease);
}
.navbar .nav-link:hover::after{ width:65%; }

/* ---- Consistencia de página a página ---- */
.page-header{
  background:linear-gradient(180deg,#FFFFFF 0%, var(--p-bg-soft) 100%);
  border-bottom:1px solid var(--p-line);
}
.form-card, .guia-block, .portal-card, .planes-card{
  border:1px solid var(--p-line);
  box-shadow:var(--p-shadow-soft);
}
.section-title span, .sec-head h2 span{ color:var(--p-primary-2); }
a{ color:var(--p-primary-2); }
a:hover{ color:var(--p-primary); }