/* ============================================
   PARODY OVERRIDE — El Abogado de las Girls
   Rosa · Corazones · Vibes · Glamour
   ============================================ */

/* ===== VARIABLES ROSADAS ===== */
:root {
  --color-primary:      #7B1F4A;    /* rosa oscuro/borravino */
  --color-secondary:    #FF69B4;    /* hot pink */
  --color-white:        #FFFFFF;
  --color-light:        #FFF0F5;    /* lavender blush */
  --color-text:         #4A0030;    /* texto oscuro rosado */
  --color-text-muted:   #C06090;
  --color-border:       #FFCCE0;
  --color-card:         #FFFFFF;
  --color-overlay:      rgba(100, 10, 60, 0.82);

  /* extras */
  --pink-deep:   #FF1493;
  --pink-hot:    #FF69B4;
  --pink-light:  #FFB6C1;
  --pink-pale:   #FFF0F5;
  --pink-mid:    #FF85C1;
  --pink-gold:   #FFD700;
}

/* ===== FLOATING HEARTS BACKGROUND ===== */
.hearts-bg {
  position: fixed;
  top: 0; left: 0;
  width: 100%; height: 100%;
  pointer-events: none;
  z-index: 0;
  overflow: hidden;
}

.hearts-bg span {
  position: absolute;
  top: -60px;
  font-size: clamp(18px, 3vw, 32px);
  opacity: 0.18;
  animation: floatHeart 12s linear infinite;
}

@keyframes floatHeart {
  0%   { transform: translateY(0) rotate(0deg);   opacity: 0.18; }
  50%  { opacity: 0.28; }
  100% { transform: translateY(110vh) rotate(720deg); opacity: 0; }
}

/* ===== BODY ===== */
body {
  background: var(--pink-pale);
  color: var(--color-text);
}

/* ===== NAV ===== */
.nav {
  background: linear-gradient(135deg, var(--color-primary) 0%, #A82060 100%);
  border-bottom: 3px solid var(--pink-hot);
}

.nav.scrolled {
  background: linear-gradient(135deg, var(--color-primary) 0%, #6B1040 100%);
  box-shadow: 0 4px 24px rgba(255, 105, 180, 0.4);
}

.nav__logo-img {
  border: 2px solid var(--pink-hot);
}

.nav__logo-heart {
  border: 3px solid var(--pink-hot);
  box-shadow: 0 0 12px rgba(255, 105, 180, 0.6);
}

.nav__name { color: #FFDDE8; }
.nav__sub  { color: var(--pink-light); }

.nav__link {
  color: #FFDDE8 !important;
}

.nav__link:hover {
  color: var(--pink-hot) !important;
}

.nav__cta {
  background: var(--pink-hot) !important;
  color: #fff !important;
  border-radius: 50px !important;
  border: none !important;
}

.nav__cta:hover {
  background: var(--pink-deep) !important;
  box-shadow: 0 4px 18px rgba(255, 20, 147, 0.5) !important;
}

/* Hamburger */
.nav__toggle span { background: #FFDDE8; }

/* ===== HERO ===== */
.hero__overlay {
  background: linear-gradient(
    135deg,
    rgba(100, 10, 60, 0.90) 0%,
    rgba(140, 30, 80, 0.72) 60%,
    rgba(80, 5, 45, 0.88) 100%
  );
}

.hero__eyebrow { color: var(--pink-light); }

.hero__title { color: #fff; }

.hero__title-accent {
  color: var(--pink-hot);
  text-shadow: 0 0 30px rgba(255, 105, 180, 0.5);
}

.hero__subtitle { color: #FFCCE0; }

.hero__btn--primary {
  background: var(--pink-hot);
  color: #fff;
  border-color: var(--pink-hot);
}

.hero__btn--primary:hover {
  background: var(--pink-deep);
  border-color: var(--pink-deep);
  box-shadow: 0 8px 28px rgba(255, 20, 147, 0.55);
}

.hero__btn--secondary {
  color: #FFDDE8;
  border-color: rgba(255, 182, 193, 0.6);
}

.hero__btn--secondary:hover {
  background: rgba(255, 105, 180, 0.15);
  border-color: var(--pink-hot);
  color: var(--pink-hot);
}

/* Trust badges */
.hero__trust-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 24px;
}

.hero__trust-badge {
  background: rgba(255, 105, 180, 0.15);
  border: 1px solid rgba(255, 105, 180, 0.4);
  color: #FFCCE0;
  font-size: 12px;
  font-weight: 600;
  padding: 6px 14px;
  border-radius: 50px;
  letter-spacing: 0.5px;
}

/* Quote card */
.hero__quote-card {
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 105, 180, 0.4);
  backdrop-filter: blur(12px);
  border-radius: 20px;
}

.hero__quote-icon { color: var(--pink-hot); }
.hero__quote-text { color: #FFDDE8; }
.hero__author-name { color: var(--pink-light); }
.hero__author-role { color: var(--pink-mid); }

.hero__author-img--heart {
  border: 3px solid var(--pink-hot);
  box-shadow: 0 0 16px rgba(255, 105, 180, 0.5);
  width: 56px !important;
  height: 56px !important;
}

/* Guapo badge */
.hero__guapo-badge {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 16px;
  background: rgba(255, 105, 180, 0.18);
  border: 1px solid rgba(255, 105, 180, 0.5);
  border-radius: 12px;
  padding: 12px 18px;
  color: #FFCCE0;
  font-size: 13px;
  font-weight: 500;
}

.hero__guapo-badge-emoji {
  font-size: 28px;
}

/* Scroll arrow */
.hero__scroll { color: var(--pink-hot); border-color: rgba(255, 105, 180, 0.5); }
.hero__scroll:hover { background: var(--pink-hot); color: #fff; }

/* ===== SERVICIOS ===== */
.servicios {
  background: var(--pink-pale);
}

.servicios__eyebrow { color: var(--pink-deep); }
.servicios__title { color: var(--color-primary); }
.servicios__subtitle { color: var(--color-text-muted); }

.servicios__card {
  border: 2px solid #FFCCE0;
  border-radius: 20px;
  transition: transform 0.3s, box-shadow 0.3s, border-color 0.3s;
}

.servicios__card:hover {
  border-color: var(--pink-hot);
  box-shadow: 0 12px 40px rgba(255, 105, 180, 0.25);
  transform: translateY(-6px);
}

.servicios__icon {
  background: linear-gradient(135deg, #FF69B4, #FF1493);
  color: #fff;
  border-radius: 50%;
  width: 58px;
  height: 58px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  margin-bottom: 16px;
  box-shadow: 0 6px 18px rgba(255, 20, 147, 0.35);
}

.servicios__card-title { color: var(--color-primary); }
.servicios__card-desc  { color: var(--color-text-muted); }

.servicios__cta {
  background: linear-gradient(135deg, var(--pink-hot), var(--pink-deep));
  color: #fff;
  border: none;
  border-radius: 50px;
  padding: 16px 40px;
  font-weight: 600;
  text-decoration: none;
  transition: box-shadow 0.3s, transform 0.2s;
  display: inline-block;
}

.servicios__cta:hover {
  box-shadow: 0 10px 30px rgba(255, 20, 147, 0.5);
  transform: translateY(-2px);
}

/* ===== PROCESO ===== */
.proceso {
  background: linear-gradient(160deg, var(--color-primary) 0%, #8B1050 100%);
}

.proceso__eyebrow { color: var(--pink-light); }
.proceso__title   { color: #fff; }
.proceso__subtitle { color: var(--pink-light); opacity: 0.85; }

.proceso__track {
  background: linear-gradient(90deg, var(--pink-hot), var(--pink-deep));
}

.proceso__step-num {
  background: linear-gradient(135deg, var(--pink-hot), var(--pink-deep));
  color: #fff;
  box-shadow: 0 6px 18px rgba(255, 20, 147, 0.4);
}

.proceso__step-icon {
  background: rgba(255, 105, 180, 0.18);
  border: 2px solid rgba(255, 105, 180, 0.4);
  color: var(--pink-hot);
}

.proceso__step-title { color: #fff; }
.proceso__step-desc  { color: #FFCCE0; opacity: 0.85; }

.proceso__cta {
  background: var(--pink-hot);
  color: #fff;
  border: none;
  border-radius: 50px;
  padding: 16px 40px;
  font-weight: 600;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  transition: background 0.3s, box-shadow 0.3s, transform 0.2s;
}

.proceso__cta:hover {
  background: var(--pink-deep);
  box-shadow: 0 10px 30px rgba(255, 20, 147, 0.5);
  transform: translateY(-2px);
}

/* mobile proceso */
.proceso-mobile {
  background: linear-gradient(160deg, #9B2560 0%, var(--color-primary) 100%);
}

.proceso-mobile__eyebrow { color: var(--pink-light); }
.proceso-mobile__title   { color: #fff; }
.proceso-mobile__subtitle { color: var(--pink-light); opacity: 0.85; }

.proceso-mobile__item-num {
  background: linear-gradient(135deg, var(--pink-hot), var(--pink-deep));
  color: #fff;
}

.proceso-mobile__item-line {
  background: linear-gradient(180deg, var(--pink-hot), var(--pink-deep));
}

.proceso-mobile__item-icon {
  background: rgba(255, 105, 180, 0.18);
  border: 2px solid rgba(255, 105, 180, 0.4);
  color: var(--pink-hot);
}

.proceso-mobile__item-title { color: #fff; }
.proceso-mobile__item-desc  { color: #FFCCE0; opacity: 0.85; }

.proceso-mobile__cta {
  background: var(--pink-hot);
  color: #fff;
  border-radius: 50px;
  padding: 16px 40px;
  font-weight: 600;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  transition: background 0.3s, box-shadow 0.3s;
}

.proceso-mobile__cta:hover {
  background: var(--pink-deep);
  box-shadow: 0 10px 30px rgba(255, 20, 147, 0.5);
}

/* ===== TESTIMONIOS ===== */
.testimonios {
  background: #fff;
}

.testimonios__eyebrow { color: var(--pink-deep); }
.testimonios__title   { color: var(--color-primary); }
.testimonios__subtitle { color: var(--color-text-muted); }

.testimonios__card--parody {
  border: 2px solid #FFCCE0 !important;
  border-radius: 20px;
  transition: border-color 0.3s, box-shadow 0.3s, transform 0.3s;
  background: var(--pink-pale);
}

.testimonios__card--parody:hover {
  border-color: var(--pink-hot) !important;
  box-shadow: 0 12px 40px rgba(255, 105, 180, 0.2);
  transform: translateY(-4px);
}

.testimonios__stars {
  color: var(--pink-hot);
  font-size: 18px;
  margin-bottom: 12px;
}

.testimonios__quote {
  color: var(--color-text);
  font-style: italic;
  line-height: 1.7;
}

/* Photo avatar override */
.testimonios__avatar--photo {
  width: 52px !important;
  height: 52px !important;
  border-radius: 50% !important;
  object-fit: cover !important;
  border: 3px solid var(--pink-hot) !important;
  box-shadow: 0 4px 14px rgba(255, 105, 180, 0.4) !important;
  background: none !important;
  font-size: 0 !important;
  color: transparent !important;
  display: block !important;
}

.testimonios__author-name { color: var(--color-primary); font-weight: 700; }
.testimonios__author-role { color: var(--color-text-muted); }

/* ===== SOBRE MÍ ===== */
.sobre-mi {
  background: var(--pink-pale);
}

.sobre-mi__photo-frame--parody {
  position: relative;
}

.sobre-mi__photo--featured {
  border-radius: 20px !important;
  border: 4px solid var(--pink-hot) !important;
  box-shadow: 0 20px 60px rgba(255, 20, 147, 0.30), 0 4px 18px rgba(255, 105, 180, 0.4) !important;
  transform: scale(1.03);
  transition: transform 0.4s, box-shadow 0.4s;
}

.sobre-mi__photo--featured:hover {
  transform: scale(1.06);
  box-shadow: 0 28px 70px rgba(255, 20, 147, 0.40), 0 6px 24px rgba(255, 105, 180, 0.5) !important;
}

/* Badge flotante sobre la foto */
.sobre-mi__photo-badge {
  position: absolute;
  bottom: -18px;
  left: 50%;
  transform: translateX(-50%);
  background: linear-gradient(135deg, var(--pink-hot), var(--pink-deep));
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  padding: 8px 20px;
  border-radius: 50px;
  white-space: nowrap;
  box-shadow: 0 4px 18px rgba(255, 20, 147, 0.4);
}

.sobre-mi__photo-accent {
  background: linear-gradient(135deg, var(--pink-light), var(--pink-mid));
}

.sobre-mi__credential--parody {
  background: linear-gradient(135deg, var(--color-primary), #A82060) !important;
  color: var(--pink-light) !important;
  border-color: var(--pink-hot) !important;
}

.sobre-mi__credential--parody i {
  color: var(--pink-hot) !important;
}

.sobre-mi__eyebrow   { color: var(--pink-deep); }
.sobre-mi__title     { color: var(--color-primary); }
.sobre-mi__subtitle  { color: var(--pink-hot); font-weight: 600; }
.sobre-mi__bio p     { color: var(--color-text); }

.sobre-mi__badge--parody {
  background: linear-gradient(135deg, #FFF0F5, #FFCCE0) !important;
  border: 1px solid #FFCCE0 !important;
  border-radius: 12px;
}

.sobre-mi__badge--parody i  { color: var(--pink-deep) !important; }
.sobre-mi__badge--parody span { color: var(--color-text) !important; }

.sobre-mi__cta {
  background: linear-gradient(135deg, var(--pink-hot), var(--pink-deep)) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 50px !important;
  padding: 14px 36px !important;
  transition: box-shadow 0.3s, transform 0.2s !important;
}

.sobre-mi__cta:hover {
  box-shadow: 0 10px 30px rgba(255, 20, 147, 0.5) !important;
  transform: translateY(-2px) !important;
}

/* mobile sobre mi */
.sobre-mi-mobile {
  background: var(--pink-pale);
}

.sobre-mi-mobile__photo-wrap--parody {
  position: relative;
  display: flex;
  justify-content: center;
}

.sobre-mi-mobile__photo--featured {
  border: 4px solid var(--pink-hot) !important;
  box-shadow: 0 14px 40px rgba(255, 20, 147, 0.28) !important;
  border-radius: 18px !important;
}

.sobre-mi-mobile__photo-badge {
  position: absolute;
  bottom: -14px;
  left: 50%;
  transform: translateX(-50%);
  background: linear-gradient(135deg, var(--pink-hot), var(--pink-deep));
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  padding: 6px 18px;
  border-radius: 50px;
  white-space: nowrap;
  box-shadow: 0 4px 14px rgba(255, 20, 147, 0.35);
}

.sobre-mi-mobile__eyebrow { color: var(--pink-deep); }
.sobre-mi-mobile__title   { color: var(--color-primary); }
.sobre-mi-mobile__subtitle { color: var(--pink-hot); font-weight: 600; }

.sobre-mi-mobile__badge {
  background: linear-gradient(135deg, #FFF0F5, #FFCCE0) !important;
  border: 1px solid #FFCCE0 !important;
  border-radius: 12px !important;
}

.sobre-mi-mobile__badge i    { color: var(--pink-deep) !important; }
.sobre-mi-mobile__badge span { color: var(--color-text) !important; }

.sobre-mi-mobile__cta {
  background: linear-gradient(135deg, var(--pink-hot), var(--pink-deep)) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 50px !important;
}

/* ===== CONTACTO ===== */
.contacto {
  background: linear-gradient(160deg, var(--color-primary) 0%, #A82060 100%);
}

.contacto__eyebrow  { color: var(--pink-light); }
.contacto__title    { color: #fff; }
.contacto__subtitle { color: var(--pink-light); opacity: 0.85; }

.contacto__card {
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 105, 180, 0.3);
  border-radius: 20px;
  backdrop-filter: blur(8px);
  transition: border-color 0.3s, box-shadow 0.3s;
}

.contacto__card:hover {
  border-color: var(--pink-hot);
  box-shadow: 0 8px 28px rgba(255, 105, 180, 0.25);
}

.contacto__card-icon {
  background: linear-gradient(135deg, var(--pink-hot), var(--pink-deep));
  color: #fff;
  border-radius: 50%;
  width: 50px;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  margin: 0 auto 14px;
  box-shadow: 0 6px 18px rgba(255, 20, 147, 0.4);
}

.contacto__card-label { color: var(--pink-light); opacity: 0.8; }
.contacto__card-value { color: #fff; }
.contacto__card-value:hover { color: var(--pink-light); }

.contacto__social-label { color: var(--pink-light); }

.contacto__social-link {
  background: rgba(255, 105, 180, 0.18);
  border: 1px solid rgba(255, 105, 180, 0.4);
  color: var(--pink-light);
  width: 44px;
  height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  font-size: 18px;
  transition: background 0.3s, color 0.3s, box-shadow 0.3s;
  text-decoration: none;
}

.contacto__social-link:hover {
  background: var(--pink-hot);
  color: #fff;
  box-shadow: 0 6px 18px rgba(255, 20, 147, 0.4);
}

/* ===== WHATSAPP BTN ===== */
.whatsapp-btn {
  background: linear-gradient(135deg, var(--pink-hot), var(--pink-deep)) !important;
  box-shadow: 0 6px 24px rgba(255, 20, 147, 0.5) !important;
}

.whatsapp-btn:hover {
  box-shadow: 0 10px 32px rgba(255, 20, 147, 0.65) !important;
}

/* ===== FOOTER ===== */
.footer {
  background: var(--color-primary);
  border-top: 3px solid var(--pink-hot);
}

.footer__name { color: #FFDDE8; }
.footer__role { color: var(--pink-light); }

.footer__link {
  color: #FFDDE8 !important;
  transition: color 0.2s;
}

.footer__link:hover { color: var(--pink-hot) !important; }

.footer__bottom {
  border-top: 1px solid rgba(255, 105, 180, 0.3);
  color: var(--pink-light);
  opacity: 0.8;
}

/* ===== SCROLLBAR ROSA (por si acaso) ===== */
::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: var(--pink-pale); }
::-webkit-scrollbar-thumb { background: var(--pink-hot); border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: var(--pink-deep); }

/* ===== SELECTION ===== */
::selection {
  background: var(--pink-hot);
  color: #fff;
}
