/* ============================================
   PVA E-Store — base tokens, reset, typography
   ============================================ */

:root{
  /* ============================================
     "AURORA" palette — electric purple → vivid pink,
     cyan accents, premium slate darks.
     ============================================ */

  /* Primary — violet/purple */
  --brand:#7c3aed;         /* violet-600  — primary */
  --brand-2:#8b5cf6;       /* violet-500  — hover */
  --brand-3:#a78bfa;       /* violet-400  — light */
  --brand-dark:#6d28d9;    /* violet-700  — dark */
  --brand-rgb:124,58,237;  /* for rgba() shadows */

  /* Signature gradient — purple → pink */
  --brand-grad:linear-gradient(135deg,#7c3aed 0%,#ec4899 100%);
  --brand-grad-soft:linear-gradient(135deg, rgba(124,58,237,.10) 0%, rgba(236,72,153,.10) 100%);

  /* Accent — hot pink for CTAs and highlights */
  --accent:#ec4899;
  --accent-2:#f472b6;
  --accent-rgb:236,72,153;

  /* Secondary accent — electric cyan */
  --cyan:#06b6d4;
  --cyan-2:#22d3ee;

  /* Success/positive — emerald */
  --success:#10b981;
  --success-2:#34d399;

  /* Dark family — deep slate */
  --ink:#0f172a;           /* slate-900 */
  --ink-2:#1e293b;         /* slate-800 */
  --ink-3:#334155;         /* slate-700 */

  /* Text */
  --text:#1f2937;
  --muted:#64748b;
  --muted-2:#94a3b8;

  /* Backgrounds */
  --bg:#ffffff;
  --bg-soft:#f8fafc;       /* cool off-white */
  --bg-cool:#f0f9ff;       /* faint sky */
  --bg-warm:#faf5ff;       /* faint lilac (was orange) */
  --bg-dark:#0f172a;
  --card:#ffffff;
  --border:#e5e7eb;
  --border-2:#cbd5e1;

  /* Shape */
  --radius:16px;
  --radius-sm:10px;
  --radius-lg:24px;
  --radius-pill:50px;

  /* Elevation */
  --shadow:0 4px 20px rgba(15,23,42,.06);
  --shadow-md:0 10px 30px rgba(15,23,42,.08);
  --shadow-lg:0 25px 60px rgba(15,23,42,.14);
  --shadow-brand:0 12px 30px rgba(124,58,237,.28);
  --shadow-accent:0 12px 30px rgba(236,72,153,.28);

  --font:'Lato', Arial, sans-serif;
  --wrap:1200px;
  --wrap-sm:1100px;
}

*,
*::before,
*::after{ box-sizing:border-box; }

html{
  -webkit-text-size-adjust:100%;
  scroll-behavior:smooth;
}

body{
  margin:0;
  font-family:var(--font);
  color:var(--text);
  background:var(--bg);
  font-size:16px;
  line-height:1.6;
}

img{
  max-width:100%;
  height:auto;
  display:block;
}

a{
  color:var(--brand);
  text-decoration:none;
  transition:color .2s ease;
}

a:hover{ color:var(--brand-2); }

h1,h2,h3,h4,h5,h6{
  margin:0 0 .5em;
  color:var(--ink);
  line-height:1.25;
  font-weight:800;
}

h1{ font-size:36px; }
h2{ font-size:28px; }
h3{ font-size:22px; }
h4{ font-size:18px; }

p{ margin:0 0 1em; }

.pva-container{
  max-width:var(--wrap);
  margin:0 auto;
  padding:0 20px;
  width:100%;
}

.pva-container-sm{
  max-width:var(--wrap-sm);
  margin:0 auto;
  padding:0 20px;
}

.pva-btn{
  display:inline-block;
  background:var(--brand-grad);
  color:#fff !important;
  padding:14px 32px;
  border-radius:var(--radius-pill);
  text-decoration:none;
  font-weight:700;
  border:none;
  cursor:pointer;
  font-family:inherit;
  font-size:16px;
  transition:transform .2s ease, box-shadow .2s ease, filter .2s ease;
  box-shadow:0 6px 18px rgba(124,58,237,.28);
}

.pva-btn:hover{
  transform:translateY(-2px);
  box-shadow:0 12px 28px rgba(236,72,153,.35);
  filter:saturate(1.1);
}

.pva-btn.pva-btn-block{
  display:block;
  width:100%;
  text-align:center;
}

.screen-reader-text{
  border:0;
  clip:rect(1px,1px,1px,1px);
  clip-path:inset(50%);
  height:1px;
  margin:-1px;
  overflow:hidden;
  padding:0;
  position:absolute !important;
  width:1px;
  word-wrap:normal !important;
}
