/* ============================================
   TEMPLATES PREMIUM - ESTILOS ESPECÍFICOS
   ============================================ */

/* ============================================
   BODAS - 5 Templates Premium
   ============================================ */

/* 1. Wedding Classic - Elegante Editorial */
body.template-wedding-classic {
  --primary: #314035;
  --accent: #b79286;
  --gold: #c9ac75;
  --bg: #fbf7f2;
}

.template-wedding-classic .cover {
  background: linear-gradient(135deg, rgba(49, 64, 53, 0.9), rgba(49, 64, 53, 0.7)), var(--cover);
  font-family: 'Cormorant Garamond', serif;
}

.template-wedding-classic .envelope {
  background: rgba(255, 255, 255, 0.95);
  border: 2px solid var(--gold);
  box-shadow: 0 20px 60px rgba(49, 64, 53, 0.2);
}

.template-wedding-classic .envelope h1 {
  color: var(--primary);
  font-size: clamp(48px, 8vw, 96px);
  letter-spacing: -2px;
  line-height: 1;
}

.template-wedding-classic .open-btn {
  background: var(--primary);
  color: white;
  border: none;
  padding: 16px 32px;
  font-size: 12px;
  letter-spacing: 3px;
  text-transform: uppercase;
}

.template-wedding-classic .hero {
  background: linear-gradient(180deg, rgba(49, 64, 53, 0.3), rgba(49, 64, 53, 0.7)), var(--hero);
}

.template-wedding-classic .section h2 {
  font-family: 'Cormorant Garamond', serif;
  color: var(--primary);
  font-size: clamp(40px, 6vw, 72px);
  font-weight: 600;
}

.template-wedding-classic .orn {
  color: var(--gold);
  font-size: 36px;
}

.template-wedding-classic .gallery figure {
  border-radius: 2px;
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

/* 2. Wedding Floral - Romántico con Flores */
body.template-wedding-floral {
  --primary: #d4a5a5;
  --accent: #f5e6e6;
  --gold: #e8c4c4;
  --bg: #fff9f9;
}

.template-wedding-floral .cover {
  background: linear-gradient(135deg, rgba(212, 165, 165, 0.85), rgba(245, 230, 230, 0.85)), var(--cover);
}

.template-wedding-floral .envelope {
  background: rgba(255, 255, 255, 0.9);
  border: 3px solid var(--primary);
  border-radius: 20px;
  position: relative;
}

.template-wedding-floral .envelope::before {
  content: '🌸';
  position: absolute;
  top: -15px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 30px;
}

.template-wedding-floral .envelope h1 {
  color: var(--primary);
  font-family: 'Playfair Display', serif;
  font-size: clamp(44px, 7vw, 88px);
}

.template-wedding-floral .particle::before {
  content: '🌸';
}

.template-wedding-floral .gallery {
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}

.template-wedding-floral .gallery figure {
  border-radius: 12px;
  border: 3px solid var(--accent);
}

/* 3. Wedding Modern - Geométrico Contemporáneo */
body.template-wedding-modern {
  --primary: #2c3e50;
  --accent: #3498db;
  --gold: #f39c12;
  --bg: #f8f9fa;
}

.template-wedding-modern .cover {
  background: linear-gradient(135deg, rgba(44, 62, 80, 0.9), rgba(52, 152, 219, 0.8)), var(--cover);
}

.template-wedding-modern .envelope {
  background: rgba(255, 255, 255, 0.95);
  border: none;
  border-radius: 4px;
  box-shadow: 0 30px 60px rgba(44, 62, 80, 0.3);
}

.template-wedding-modern .envelope h1 {
  color: var(--primary);
  font-family: 'Montserrat', sans-serif;
  font-weight: 700;
  font-size: clamp(40px, 6vw, 80px);
  text-transform: uppercase;
  letter-spacing: 4px;
}

.template-wedding-modern .open-btn {
  background: var(--accent);
  color: white;
  border: none;
  padding: 18px 36px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 2px;
  border-radius: 4px;
}

.template-wedding-modern .section h2 {
  font-family: 'Montserrat', sans-serif;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 4px;
  color: var(--primary);
}

.template-wedding-modern .card {
  border-radius: 8px;
  border: 2px solid var(--accent);
}

/* 4. Wedding Rustic - Bohemio Natural */
body.template-wedding-rustic {
  --primary: #8b7355;
  --accent: #d4a574;
  --gold: #c9a066;
  --bg: #f5f0e8;
}

.template-wedding-rustic .cover {
  background: linear-gradient(135deg, rgba(139, 115, 85, 0.85), rgba(212, 165, 116, 0.85)), var(--cover);
}

.template-wedding-rustic .envelope {
  background: rgba(245, 240, 232, 0.95);
  border: 4px solid var(--primary);
  border-radius: 8px;
  box-shadow: 0 20px 50px rgba(139, 115, 85, 0.25);
}

.template-wedding-rustic .envelope h1 {
  color: var(--primary);
  font-family: 'Cormorant Garamond', serif;
  font-size: clamp(48px, 7vw, 92px);
  font-weight: 600;
}

.template-wedding-rustic .particle::before {
  content: '🍂';
}

.template-wedding-rustic .orn {
  color: var(--gold);
  font-size: 32px;
}

.template-wedding-rustic .gallery figure {
  border-radius: 4px;
  border: 3px solid var(--accent);
  filter: sepia(0.2);
}

/* 5. Wedding Luxury - Lujo Dorado */
body.template-wedding-luxury {
  --primary: #1a1a1a;
  --accent: #d4af37;
  --gold: #ffd700;
  --bg: #0a0a0a;
}

.template-wedding-luxury .cover {
  background: linear-gradient(135deg, rgba(26, 26, 26, 0.95), rgba(212, 175, 55, 0.7)), var(--cover);
}

.template-wedding-luxury .envelope {
  background: linear-gradient(135deg, rgba(26, 26, 26, 0.95), rgba(40, 40, 40, 0.95));
  border: 3px solid var(--gold);
  border-radius: 0;
  box-shadow: 0 30px 80px rgba(212, 175, 55, 0.4);
}

.template-wedding-luxury .envelope h1 {
  color: var(--gold);
  font-family: 'Bodoni Moda', serif;
  font-size: clamp(52px, 8vw, 100px);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 6px;
}

.template-wedding-luxury .open-btn {
  background: var(--gold);
  color: var(--primary);
  border: 2px solid var(--gold);
  padding: 20px 40px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 4px;
}

.template-wedding-luxury .hero {
  background: linear-gradient(180deg, rgba(26, 26, 26, 0.5), rgba(26, 26, 26, 0.8)), var(--hero);
}

.template-wedding-luxury .section h2 {
  color: var(--gold);
  font-family: 'Bodoni Moda', serif;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 4px;
}

.template-wedding-luxury .orn {
  color: var(--gold);
  font-size: 40px;
  text-shadow: 0 0 20px rgba(212, 175, 55, 0.5);
}

.template-wedding-luxury .particle::before {
  content: '✨';
  filter: drop-shadow(0 0 10px var(--gold));
}

/* ============================================
   XV AÑOS - 4 Templates Premium
   ============================================ */

/* 1. XV Classic - Princesa Elegante */
body.template-xv-classic {
  --primary: #e91e63;
  --accent: #f8bbd0;
  --gold: #ffd700;
  --bg: #fff0f5;
}

.template-xv-classic .cover {
  background: linear-gradient(135deg, rgba(233, 30, 99, 0.85), rgba(248, 187, 208, 0.85)), var(--cover);
}

.template-xv-classic .envelope {
  background: rgba(255, 255, 255, 0.95);
  border: 4px solid var(--primary);
  border-radius: 20px;
  box-shadow: 0 20px 50px rgba(233, 30, 99, 0.3);
}

.template-xv-classic .envelope h1 {
  color: var(--primary);
  font-family: 'Playfair Display', serif;
  font-size: clamp(48px, 7vw, 88px);
}

.template-xv-classic .particle::before {
  content: '👑';
}

.template-xv-classic .orn {
  color: var(--gold);
  font-size: 36px;
}

/* 2. XV Modern - Chic Contemporáneo */
body.template-xv-modern {
  --primary: #9c27b0;
  --accent: #e1bee7;
  --gold: #ba68c8;
  --bg: #f3e5f5;
}

.template-xv-modern .cover {
  background: linear-gradient(135deg, rgba(156, 39, 176, 0.9), rgba(225, 190, 231, 0.85)), var(--cover);
}

.template-xv-modern .envelope {
  background: rgba(255, 255, 255, 0.95);
  border: none;
  border-radius: 16px;
  box-shadow: 0 25px 60px rgba(156, 39, 176, 0.3);
}

.template-xv-modern .envelope h1 {
  color: var(--primary);
  font-family: 'Montserrat', sans-serif;
  font-weight: 700;
  font-size: clamp(44px, 6vw, 80px);
  text-transform: uppercase;
  letter-spacing: 3px;
}

.template-xv-modern .particle::before {
  content: '💜';
}

/* 3. XV Fairy - Hada Mágica */
body.template-xv-fairy {
  --primary: #7b1fa2;
  --accent: #e1bee7;
  --gold: #ce93d8;
  --bg: #f3e5f5;
}

.template-xv-fairy .cover {
  background: radial-gradient(circle at 50% 50%, rgba(123, 31, 162, 0.7), rgba(206, 147, 216, 0.85)), var(--cover);
}

.template-xv-fairy .envelope {
  background: rgba(255, 255, 255, 0.9);
  border: 3px solid var(--gold);
  border-radius: 30px;
  box-shadow: 0 0 60px rgba(206, 147, 216, 0.5);
}

.template-xv-fairy .envelope h1 {
  color: var(--primary);
  font-family: 'Great Vibes', cursive;
  font-size: clamp(56px, 9vw, 100px);
}

.template-xv-fairy .particle::before {
  content: '✨';
  filter: drop-shadow(0 0 15px var(--gold));
}

.template-xv-fairy .orn {
  color: var(--gold);
  font-size: 40px;
  animation: sparkle 2s ease-in-out infinite;
}

@keyframes sparkle {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.7; transform: scale(1.2); }
}

/* 4. XV Glamour - Night Party */
body.template-xv-glamour {
  --primary: #212121;
  --accent: #e0e0e0;
  --gold: #ffd700;
  --bg: #121212;
}

.template-xv-glamour .cover {
  background: linear-gradient(135deg, rgba(33, 33, 33, 0.95), rgba(0, 0, 0, 0.9)), var(--cover);
}

.template-xv-glamour .envelope {
  background: linear-gradient(135deg, rgba(33, 33, 33, 0.95), rgba(64, 64, 64, 0.95));
  border: 3px solid var(--gold);
  border-radius: 8px;
  box-shadow: 0 30px 80px rgba(255, 215, 0, 0.3);
}

.template-xv-glamour .envelope h1 {
  color: var(--gold);
  font-family: 'Cinzel', serif;
  font-size: clamp(48px, 7vw, 88px);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 4px;
}

.template-xv-glamour .particle::before {
  content: '⭐';
  filter: drop-shadow(0 0 10px var(--gold));
}

.template-xv-glamour .orn {
  color: var(--gold);
  font-size: 36px;
  text-shadow: 0 0 20px rgba(255, 215, 0, 0.5);
}

/* ============================================
   CUMPLEAÑOS - 4 Templates Premium
   ============================================ */

/* 1. Birthday Kids - Divertido Infantil */
body.template-birthday-kids {
  --primary: #ff6b6b;
  --accent: #feca57;
  --gold: #48dbfb;
  --bg: #fff9e6;
}

.template-birthday-kids .cover {
  background: linear-gradient(135deg, rgba(255, 107, 107, 0.85), rgba(254, 202, 87, 0.85)), var(--cover);
}

.template-birthday-kids .envelope {
  background: rgba(255, 255, 255, 0.95);
  border: 5px solid var(--primary);
  border-radius: 20px;
  box-shadow: 0 20px 50px rgba(255, 107, 107, 0.3);
}

.template-birthday-kids .envelope h1 {
  color: var(--primary);
  font-family: 'Fredoka One', cursive;
  font-size: clamp(44px, 7vw, 80px);
}

.template-birthday-kids .particle::before {
  content: '🎈';
}

.template-birthday-kids .orn {
  color: var(--accent);
  font-size: 32px;
}

/* 2. Birthday Adult - Elegante */
body.template-birthday-adult {
  --primary: #2c3e50;
  --accent: #3498db;
  --gold: #f39c12;
  --bg: #f8f9fa;
}

.template-birthday-adult .cover {
  background: linear-gradient(135deg, rgba(44, 62, 80, 0.9), rgba(52, 152, 219, 0.85)), var(--cover);
}

.template-birthday-adult .envelope {
  background: rgba(255, 255, 255, 0.95);
  border: 2px solid var(--primary);
  border-radius: 12px;
}

.template-birthday-adult .envelope h1 {
  color: var(--primary);
  font-family: 'Playfair Display', serif;
  font-size: clamp(48px, 7vw, 88px);
}

.template-birthday-adult .particle::before {
  content: '🎉';
}

/* 3. Birthday Milestone - Hitos Especiales */
body.template-birthday-milestone {
  --primary: #c0392b;
  --accent: #e74c3c;
  --gold: #f1c40f;
  --bg: #fdf2f2;
}

.template-birthday-milestone .cover {
  background: linear-gradient(135deg, rgba(192, 57, 43, 0.9), rgba(231, 76, 60, 0.85)), var(--cover);
}

.template-birthday-milestone .envelope {
  background: rgba(255, 255, 255, 0.95);
  border: 4px solid var(--gold);
  border-radius: 8px;
  box-shadow: 0 25px 60px rgba(192, 57, 43, 0.3);
}

.template-birthday-milestone .envelope h1 {
  color: var(--primary);
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(56px, 9vw, 100px);
  text-transform: uppercase;
  letter-spacing: 4px;
}

.template-birthday-milestone .particle::before {
  content: '🎊';
}

/* 4. Birthday Fun - Fiesta Party */
body.template-birthday-fun {
  --primary: #ff0066;
  --accent: #00ffcc;
  --gold: #ffff00;
  --bg: #1a1a2e;
}

.template-birthday-fun .cover {
  background: linear-gradient(135deg, rgba(255, 0, 102, 0.85), rgba(0, 255, 204, 0.85)), var(--cover);
}

.template-birthday-fun .envelope {
  background: rgba(255, 255, 255, 0.95);
  border: 5px solid var(--primary);
  border-radius: 16px;
  box-shadow: 0 0 60px rgba(255, 0, 102, 0.4);
}

.template-birthday-fun .envelope h1 {
  color: var(--primary);
  font-family: 'Righteous', cursive;
  font-size: clamp(48px, 7vw, 88px);
  text-transform: uppercase;
}

.template-birthday-fun .particle::before {
  content: '🎵';
}

.template-birthday-fun .orn {
  color: var(--gold);
  font-size: 36px;
  animation: bounce 1s ease-in-out infinite;
}

@keyframes bounce {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-10px); }
}

/* ============================================
   BAUTIZOS - 2 Templates Premium
   ============================================ */

/* 1. Baptism Angel - Ángel Celestial */
body.template-baptism-angel {
  --primary: #87ceeb;
  --accent: #f0f8ff;
  --gold: #ffd700;
  --bg: #f0f8ff;
}

.template-baptism-angel .cover {
  background: linear-gradient(135deg, rgba(135, 206, 235, 0.85), rgba(240, 248, 255, 0.9)), var(--cover);
}

.template-baptism-angel .envelope {
  background: rgba(255, 255, 255, 0.95);
  border: 3px solid var(--primary);
  border-radius: 20px;
  box-shadow: 0 20px 50px rgba(135, 206, 235, 0.3);
}

.template-baptism-angel .envelope h1 {
  color: var(--primary);
  font-family: 'Great Vibes', cursive;
  font-size: clamp(52px, 8vw, 96px);
}

.template-baptism-angel .particle::before {
  content: '👼';
}

.template-baptism-angel .orn {
  color: var(--gold);
  font-size: 36px;
}

/* 2. Baptism Classic - Clásico Sagrado */
body.template-baptism-classic {
  --primary: #d4af37;
  --accent: #fffacd;
  --gold: #ffd700;
  --bg: #fffacd;
}

.template-baptism-classic .cover {
  background: linear-gradient(135deg, rgba(212, 175, 55, 0.85), rgba(255, 250, 205, 0.9)), var(--cover);
}

.template-baptism-classic .envelope {
  background: rgba(255, 255, 255, 0.95);
  border: 4px solid var(--gold);
  border-radius: 12px;
  box-shadow: 0 25px 60px rgba(212, 175, 55, 0.3);
}

.template-baptism-classic .envelope h1 {
  color: var(--primary);
  font-family: 'Cormorant Garamond', serif;
  font-size: clamp(48px, 7vw, 88px);
  font-weight: 600;
}

.template-baptism-classic .particle::before {
  content: '✝️';
}

/* ============================================
   GRADUACIONES - 2 Templates Premium
   ============================================ */

/* 1. Graduation Academic - Formal */
body.template-graduation-academic {
  --primary: #1a1a1a;
  --accent: #3498db;
  --gold: #f39c12;
  --bg: #f8f9fa;
}

.template-graduation-academic .cover {
  background: linear-gradient(135deg, rgba(26, 26, 26, 0.9), rgba(52, 152, 219, 0.85)), var(--cover);
}

.template-graduation-academic .envelope {
  background: rgba(255, 255, 255, 0.95);
  border: 3px solid var(--primary);
  border-radius: 8px;
  box-shadow: 0 25px 60px rgba(26, 26, 26, 0.3);
}

.template-graduation-academic .envelope h1 {
  color: var(--primary);
  font-family: 'Cinzel', serif;
  font-size: clamp(48px, 7vw, 88px);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 3px;
}

.template-graduation-academic .particle::before {
  content: '🎓';
}

/* 2. Graduation Celebration - Festiva */
body.template-graduation-celebration {
  --primary: #e74c3c;
  --accent: #3498db;
  --gold: #f1c40f;
  --bg: #fff5f5;
}

.template-graduation-celebration .cover {
  background: linear-gradient(135deg, rgba(231, 76, 60, 0.85), rgba(52, 152, 219, 0.85)), var(--cover);
}

.template-graduation-celebration .envelope {
  background: rgba(255, 255, 255, 0.95);
  border: 4px solid var(--primary);
  border-radius: 16px;
  box-shadow: 0 25px 60px rgba(231, 76, 60, 0.3);
}

.template-graduation-celebration .envelope h1 {
  color: var(--primary);
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(52px, 8vw, 96px);
  text-transform: uppercase;
  letter-spacing: 4px;
}

.template-graduation-celebration .particle::before {
  content: '🎉';
}

/* ============================================
   EMPRESARIALES - 3 Templates Premium
   ============================================ */

/* 1. Corporate Professional - Corporativo */
body.template-corporate-professional {
  --primary: #2c3e50;
  --accent: #34495e;
  --gold: #3498db;
  --bg: #f8f9fa;
}

.template-corporate-professional .cover {
  background: linear-gradient(135deg, rgba(44, 62, 80, 0.95), rgba(52, 73, 94, 0.9)), var(--cover);
}

.template-corporate-professional .envelope {
  background: rgba(255, 255, 255, 0.95);
  border: 2px solid var(--primary);
  border-radius: 4px;
  box-shadow: 0 25px 60px rgba(44, 62, 80, 0.3);
}

.template-corporate-professional .envelope h1 {
  color: var(--primary);
  font-family: 'Montserrat', sans-serif;
  font-weight: 700;
  font-size: clamp(40px, 6vw, 72px);
  text-transform: uppercase;
  letter-spacing: 3px;
}

.template-corporate-professional .particle::before {
  content: '💼';
}

/* 2. Corporate Tech - Tecnológico */
body.template-corporate-tech {
  --primary: #00d4ff;
  --accent: #7b2cbf;
  --gold: #f72585;
  --bg: #0a0a0a;
}

.template-corporate-tech .cover {
  background: linear-gradient(135deg, rgba(0, 212, 255, 0.85), rgba(123, 44, 191, 0.85)), var(--cover);
}

.template-corporate-tech .envelope {
  background: rgba(10, 10, 10, 0.95);
  border: 2px solid var(--primary);
  border-radius: 8px;
  box-shadow: 0 0 60px rgba(0, 212, 255, 0.4);
}

.template-corporate-tech .envelope h1 {
  color: var(--primary);
  font-family: 'Orbitron', sans-serif;
  font-size: clamp(44px, 7vw, 80px);
  text-transform: uppercase;
  letter-spacing: 4px;
}

.template-corporate-tech .particle::before {
  content: '🚀';
  filter: drop-shadow(0 0 10px var(--primary));
}

.template-corporate-tech .orn {
  color: var(--gold);
  font-size: 32px;
  animation: pulse 2s ease-in-out infinite;
}

@keyframes pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.5; }
}

/* 3. Corporate Gala - Elegante */
body.template-corporate-gala {
  --primary: #1a1a1a;
  --accent: #d4af37;
  --gold: #ffd700;
  --bg: #0a0a0a;
}

.template-corporate-gala .cover {
  background: linear-gradient(135deg, rgba(26, 26, 26, 0.95), rgba(212, 175, 55, 0.8)), var(--cover);
}

.template-corporate-gala .envelope {
  background: linear-gradient(135deg, rgba(26, 26, 26, 0.95), rgba(40, 40, 40, 0.95));
  border: 3px solid var(--gold);
  border-radius: 8px;
  box-shadow: 0 30px 80px rgba(212, 175, 55, 0.4);
}

.template-corporate-gala .envelope h1 {
  color: var(--gold);
  font-family: 'Playfair Display', serif;
  font-size: clamp(48px, 7vw, 88px);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 4px;
}

.template-corporate-gala .particle::before {
  content: '🏆';
  filter: drop-shadow(0 0 10px var(--gold));
}

/* ============================================
   HOMENAJES - 2 Templates Premium
   ============================================ */

/* 1. Memorial Dignified - Digno */
body.template-memorial-dignified {
  --primary: #546e7a;
  --accent: #cfd8dc;
  --gold: #90a4ae;
  --bg: #eceff1;
}

.template-memorial-dignified .cover {
  background: linear-gradient(135deg, rgba(84, 110, 122, 0.85), rgba(207, 216, 220, 0.9)), var(--cover);
}

.template-memorial-dignified .envelope {
  background: rgba(255, 255, 255, 0.95);
  border: 3px solid var(--primary);
  border-radius: 12px;
  box-shadow: 0 20px 50px rgba(84, 110, 122, 0.25);
}

.template-memorial-dignified .envelope h1 {
  color: var(--primary);
  font-family: 'Cormorant Garamond', serif;
  font-size: clamp(48px, 7vw, 88px);
  font-weight: 600;
}

.template-memorial-dignified .particle::before {
  content: '🕊️';
}

.template-memorial-dignified .orn {
  color: var(--gold);
  font-size: 32px;
}

/* 2. Memorial Celebration - Celebración de Vida */
body.template-memorial-celebration {
  --primary: #81c784;
  --accent: #c8e6c9;
  --gold: #a5d6a7;
  --bg: #f1f8e9;
}

.template-memorial-celebration .cover {
  background: linear-gradient(135deg, rgba(129, 199, 132, 0.85), rgba(200, 230, 201, 0.9)), var(--cover);
}

.template-memorial-celebration .envelope {
  background: rgba(255, 255, 255, 0.95);
  border: 3px solid var(--primary);
  border-radius: 16px;
  box-shadow: 0 20px 50px rgba(129, 199, 132, 0.3);
}

.template-memorial-celebration .envelope h1 {
  color: var(--primary);
  font-family: 'Playfair Display', serif;
  font-size: clamp(48px, 7vw, 88px);
}

.template-memorial-celebration .particle::before {
  content: '🌸';
}

.template-memorial-celebration .orn {
  color: var(--gold);
  font-size: 36px;
}

/* ============================================
   BABY SHOWER - 3 Templates Premium
   ============================================ */

/* 1. Baby Neutral - Elegante Neutral */
body.template-baby-neutral {
  --primary: #d4a574;
  --accent: #f5e6d3;
  --gold: #c9a066;
  --bg: #faf8f5;
}

.template-baby-neutral .cover {
  background: linear-gradient(135deg, rgba(212, 165, 116, 0.85), rgba(245, 230, 211, 0.9)), var(--cover);
}

.template-baby-neutral .envelope {
  background: rgba(255, 255, 255, 0.95);
  border: 3px solid var(--primary);
  border-radius: 20px;
  box-shadow: 0 20px 50px rgba(212, 165, 116, 0.25);
}

.template-baby-neutral .envelope h1 {
  color: var(--primary);
  font-family: 'Cormorant Garamond', serif;
  font-size: clamp(48px, 7vw, 88px);
  font-weight: 600;
}

.template-baby-neutral .particle::before {
  content: '🍼';
}

.template-baby-neutral .orn {
  color: var(--gold);
  font-size: 32px;
}

/* 2. Baby Boy - Azul Celeste */
body.template-baby-boy {
  --primary: #87ceeb;
  --accent: #e0f7fa;
  --gold: #4fc3f7;
  --bg: #e0f7fa;
}

.template-baby-boy .cover {
  background: linear-gradient(135deg, rgba(135, 206, 235, 0.85), rgba(224, 247, 250, 0.9)), var(--cover);
}

.template-baby-boy .envelope {
  background: rgba(255, 255, 255, 0.95);
  border: 4px solid var(--primary);
  border-radius: 20px;
  box-shadow: 0 20px 50px rgba(135, 206, 235, 0.3);
}

.template-baby-boy .envelope h1 {
  color: var(--primary);
  font-family: 'Great Vibes', cursive;
  font-size: clamp(52px, 8vw, 96px);
}

.template-baby-boy .particle::before {
  content: '👶';
}

.template-baby-boy .orn {
  color: var(--gold);
  font-size: 36px;
}

/* 3. Baby Girl - Rosa Dulce */
body.template-baby-girl {
  --primary: #f8bbd0;
  --accent: #fce4ec;
  --gold: #f48fb1;
  --bg: #fce4ec;
}

.template-baby-girl .cover {
  background: linear-gradient(135deg, rgba(248, 187, 208, 0.85), rgba(252, 228, 236, 0.9)), var(--cover);
}

.template-baby-girl .envelope {
  background: rgba(255, 255, 255, 0.95);
  border: 4px solid var(--primary);
  border-radius: 20px;
  box-shadow: 0 20px 50px rgba(248, 187, 208, 0.3);
}

.template-baby-girl .envelope h1 {
  color: var(--primary);
  font-family: 'Great Vibes', cursive;
  font-size: clamp(52px, 8vw, 96px);
}

.template-baby-girl .particle::before {
  content: '👧';
}

.template-baby-girl .orn {
  color: var(--gold);
  font-size: 36px;
}

/* ============================================
   ANIVERSARIOS - 3 Templates Premium
   ============================================ */

/* 1. Anniversary Golden - Dorado */
body.template-anniversary-golden {
  --primary: #d4af37;
  --accent: #fffacd;
  --gold: #ffd700;
  --bg: #fffacd;
}

.template-anniversary-golden .cover {
  background: linear-gradient(135deg, rgba(212, 175, 55, 0.9), rgba(255, 250, 205, 0.9)), var(--cover);
}

.template-anniversary-golden .envelope {
  background: rgba(255, 255, 255, 0.95);
  border: 4px solid var(--gold);
  border-radius: 12px;
  box-shadow: 0 30px 80px rgba(212, 175, 55, 0.4);
}

.template-anniversary-golden .envelope h1 {
  color: var(--primary);
  font-family: 'Bodoni Moda', serif;
  font-size: clamp(48px, 7vw, 88px);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 4px;
}

.template-anniversary-golden .particle::before {
  content: '💍';
  filter: drop-shadow(0 0 10px var(--gold));
}

.template-anniversary-golden .orn {
  color: var(--gold);
  font-size: 40px;
  text-shadow: 0 0 20px rgba(255, 215, 0, 0.5);
}

/* 2. Anniversary Silver - Plateado */
body.template-anniversary-silver {
  --primary: #c0c0c0;
  --accent: #f5f5f5;
  --gold: #e8e8e8;
  --bg: #f5f5f5;
}

.template-anniversary-silver .cover {
  background: linear-gradient(135deg, rgba(192, 192, 192, 0.85), rgba(245, 245, 245, 0.9)), var(--cover);
}

.template-anniversary-silver .envelope {
  background: rgba(255, 255, 255, 0.95);
  border: 3px solid var(--primary);
  border-radius: 12px;
  box-shadow: 0 25px 60px rgba(192, 192, 192, 0.3);
}

.template-anniversary-silver .envelope h1 {
  color: var(--primary);
  font-family: 'Cormorant Garamond', serif;
  font-size: clamp(48px, 7vw, 88px);
  font-weight: 600;
}

.template-anniversary-silver .particle::before {
  content: '💕';
}

.template-anniversary-silver .orn {
  color: var(--gold);
  font-size: 36px;
}

/* 3. Anniversary Romantic - Romántico */
body.template-anniversary-romantic {
  --primary: #e91e63;
  --accent: #fce4ec;
  --gold: #f48fb1;
  --bg: #fce4ec;
}

.template-anniversary-romantic .cover {
  background: linear-gradient(135deg, rgba(233, 30, 99, 0.85), rgba(252, 228, 236, 0.9)), var(--cover);
}

.template-anniversary-romantic .envelope {
  background: rgba(255, 255, 255, 0.95);
  border: 4px solid var(--primary);
  border-radius: 20px;
  box-shadow: 0 20px 50px rgba(233, 30, 99, 0.3);
}

.template-anniversary-romantic .envelope h1 {
  color: var(--primary);
  font-family: 'Playfair Display', serif;
  font-size: clamp(48px, 7vw, 88px);
}

.template-anniversary-romantic .particle::before {
  content: '❤️';
}

.template-anniversary-romantic .orn {
  color: var(--gold);
  font-size: 36px;
  animation: heartbeat 1.5s ease-in-out infinite;
}

@keyframes heartbeat {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.1); }
}

/* ============================================
   UTILIDADES COMUNES
   ============================================ */

/* Animaciones comunes */
.template-wedding-classic .envelope,
.template-wedding-luxury .envelope,
.template-xv-glamour .envelope,
.template-corporate-gala .envelope,
.template-anniversary-golden .envelope {
  animation: shimmer 3s ease-in-out infinite;
}

@keyframes shimmer {
  0%, 100% { box-shadow: 0 20px 50px rgba(0, 0, 0, 0.2); }
  50% { box-shadow: 0 25px 60px rgba(0, 0, 0, 0.3); }
}

/* Responsive adjustments */
@media (max-width: 760px) {
  .template-wedding-classic .envelope h1,
  .template-wedding-floral .envelope h1,
  .template-wedding-rustic .envelope h1,
  .template-xv-classic .envelope h1,
  .template-baptism-angel .envelope h1,
  .template-baptism-classic .envelope h1,
  .template-graduation-academic .envelope h1,
  .template-memorial-dignified .envelope h1,
  .template-memorial-celebration .envelope h1,
  .template-baby-neutral .envelope h1,
  .template-anniversary-silver .envelope h1,
  .template-anniversary-romantic .envelope h1 {
    font-size: 36px;
  }
  
  .template-wedding-modern .envelope h1,
  .template-wedding-luxury .envelope h1,
  .template-xv-modern .envelope h1,
  .template-birthday-adult .envelope h1,
  .template-corporate-professional .envelope h1,
  .template-corporate-tech .envelope h1,
  .template-corporate-gala .envelope h1 {
    font-size: 32px;
  }
  
  .template-xv-fairy .envelope h1,
  .template-birthday-kids .envelope h1,
  .template-birthday-milestone .envelope h1,
  .template-birthday-fun .envelope h1,
  .template-graduation-celebration .envelope h1,
  .template-baby-boy .envelope h1,
  .template-baby-girl .envelope h1,
  .template-anniversary-golden .envelope h1 {
    font-size: 40px;
  }
}