:root {
  --ink: #111528;
  --muted: #65708a;
  --line: rgba(27, 34, 60, .10);

  --purple: #7c3cff;
  --purple-2: #a855f7;
  --cyan: #5fe2ff;
  --blue: #2d6bff;

  --paper: #f7fbff;
  --paper-2: #eef7ff;
  --white: #ffffff;
  --night: #0d1020;

  --scroll-percent: 0%;
}


* {
  box-sizing: border-box;
}


html {
  scroll-behavior: smooth;
}


body {
  margin: 0;
  font-family: Arial, sans-serif;
  color: var(--ink);
  background: #fff;
  overflow-x: hidden;
}


img {
  display: block;
  width: 100%;
}


a {
  color: inherit;
  text-decoration: none;
}


button {
  font: inherit;
}


.container {
  width: min(1180px, calc(100% - 40px));
  margin: 0 auto;
}


/* =========================
   HEADER
   ========================= */

.site-header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 50;
  padding: 16px 0;
  transition: .3s ease;
}


.site-header.scrolled {
  background: rgba(255,255,255,.82);
  backdrop-filter: blur(18px);
  box-shadow: 0 12px 40px rgba(25,35,70,.08);
}


.navbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
}


.brand {
  display: flex;
  align-items: center;
  gap: 12px;
}


.brand img {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  object-fit: cover;
  box-shadow: 0 0 0 5px rgba(124,60,255,.08);
}


.brand-copy {
  display: flex;
  flex-direction: column;
}


.brand-copy strong {
  font-family: 'Trebuchet MS', Arial, sans-serif;
  font-size: 16px;
  letter-spacing: .12em;
}


.brand-copy span {
  font-size: 11px;
  color: var(--muted);
  margin-top: 2px;
}


.nav-links {
  display: flex;
  gap: 28px;
  align-items: center;
  font-size: 14px;
  font-weight: 700;
}


.nav-links a {
  position: relative;
  transition: all .3s ease;
}


.nav-links a:not(.nav-cta)::after {
  content: '';
  position: absolute;
  left: 0;
  bottom: -8px;
  width: 0;
  height: 2px;
  background: linear-gradient(
    90deg,
    var(--purple),
    var(--cyan)
  );
  transition: .25s;
}


.nav-links a:hover::after,
.nav-links a.active::after {
  width: 100%;
}


.nav-links a:hover {
  color: var(--purple);
  transform: translateX(4px);
}


.nav-cta {
  padding: 12px 18px;
  border-radius: 999px;
  color: white;
  background: linear-gradient(
    135deg,
    var(--purple),
    var(--blue)
  );
  box-shadow: 0 10px 25px rgba(85,70,255,.25);
}


.menu-toggle {
  display: none;
  background: none;
  border: 0;
  padding: 8px;
}


.menu-toggle span {
  display: block;
  width: 24px;
  height: 2px;
  background: var(--ink);
  margin: 5px 0;
}


/* =========================
   GENERAL
   ========================= */

.section-light {
  background: #fff;
}


/* =========================
   HERO
   ========================= */

.hero {
  min-height: 100vh;
  position: relative;
  overflow: hidden;
  padding: 140px 0 92px;

  background:
    radial-gradient(
      circle at 85% 12%,
      rgba(96,226,255,.24),
      transparent 29%
    ),
    radial-gradient(
      circle at 15% 70%,
      rgba(124,60,255,.16),
      transparent 31%
    ),
    linear-gradient(
      135deg,
      #fbfdff 0%,
      #f3f7ff 55%,
      #f8f3ff 100%
    );
}


.hero-grid {
  display: grid;
  grid-template-columns: .95fr 1.05fr;
  gap: 72px;
  align-items: center;
}


.eyebrow,
.kicker {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  text-transform: uppercase;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .14em;
  color: var(--purple);
}


.kicker.light {
  color: #a9eaff;
}


.pulse {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--cyan);
  box-shadow: 0 0 0 7px rgba(95,226,255,.15);
}


.hero h1,
h2,
h3 {
  font-family: 'Trebuchet MS', Arial, sans-serif;
}


.hero h1 {
  margin: 20px 0 20px;
  font-size: clamp(54px, 6vw, 86px);
  line-height: .96;
  letter-spacing: -.05em;
  max-width: 680px;
}


.hero h1 span {
  background: linear-gradient(
    90deg,
    var(--purple),
    var(--blue),
    #26bfd7
  );

  -webkit-background-clip: text;
  color: transparent;
}


.hero-copy > p {
  margin: 0;
  font-size: 18px;
  line-height: 1.7;
  color: var(--muted);
  max-width: 620px;
}


.hero-actions {
  display: flex;
  gap: 14px;
  margin-top: 32px;
}


.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 15px 22px;
  border-radius: 14px;
  font-weight: 800;
  transition: .25s;
}


.btn:hover {
  transform: translateY(-2px);
}


.btn-primary {
  color: white;
  background: linear-gradient(
    135deg,
    var(--purple),
    var(--blue)
  );

  box-shadow: 0 16px 30px rgba(90,61,255,.22);
}


.btn-ghost {
  background: rgba(255,255,255,.72);
  border: 1px solid var(--line);
  backdrop-filter: blur(12px);
}


.chips {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  margin-top: 28px;
}


.chips span {
  padding: 8px 11px;
  border: 1px solid rgba(35,46,80,.09);
  background: rgba(255,255,255,.7);
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
  color: #4e5872;
}


.hero-visual {
  position: relative;
}


.hero-card {
  position: relative;
  border-radius: 34px;
  overflow: hidden;
  box-shadow: 0 35px 80px rgba(46,30,90,.22);
  transform: rotate(1.2deg);
  border: 6px solid rgba(255,255,255,.75);
}


.hero-card img {
  height: 590px;
  object-fit: cover;
  filter: saturate(1.1) contrast(1.02);
}


.hero-card-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    180deg,
    transparent 40%,
    rgba(10,10,30,.68)
  );
}


.hero-badge {
  position: absolute;
  left: 24px;
  right: 24px;
  bottom: 24px;

  display: flex;
  gap: 14px;
  align-items: center;

  background: rgba(13,16,32,.68);
  color: white;
  padding: 16px 18px;
  border-radius: 18px;

  backdrop-filter: blur(14px);
  border: 1px solid rgba(255,255,255,.14);
}


.badge-icon {
  width: 42px;
  height: 42px;
  border-radius: 12px;
  display: grid;
  place-items: center;

  background: linear-gradient(
    135deg,
    var(--purple),
    var(--cyan)
  );

  font-size: 22px;
}


.hero-badge div {
  display: flex;
  flex-direction: column;
  gap: 3px;
}


.hero-badge small {
  color: #cdd4f6;
}


.hero-orb {
  position: absolute;
  border-radius: 50%;
  filter: blur(12px);
  pointer-events: none;
  will-change: transform;
  transition: transform .5s cubic-bezier(.2,0,0,1);
}


.orb-one {
  width: 220px;
  height: 220px;
  background: rgba(124,60,255,.10);
  top: 120px;
  left: -80px;
}


.orb-two {
  width: 190px;
  height: 190px;
  background: rgba(95,226,255,.13);
  right: -45px;
  bottom: 70px;
}


/* =========================
   SERVICES
   ========================= */

.services,
.gallery,
.faq {
  padding: 110px 0;
}


.section-heading {
  display: grid;
  grid-template-columns: 1.2fr .8fr;
  gap: 50px;
  align-items: end;
  margin-bottom: 50px;
}


.section-heading h2,
.faq-title h2,
.trust-intro h2 {
  margin: 12px 0 0;
  font-size: clamp(38px,4vw,58px);
  line-height: 1.05;
  letter-spacing: -.04em;
}


.section-heading p,
.faq-title p {
  margin: 0;
  color: var(--muted);
  line-height: 1.75;
}


.service-grid {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 24px;
}


.service-card {
  border-radius: 26px;
  overflow: hidden;
  background: #fff;
  border: 1px solid var(--line);
  box-shadow: 0 18px 50px rgba(24,36,72,.08);
  transition: .3s ease;
}


.service-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 26px 70px rgba(73,47,150,.14);
  border-color: rgba(124,60,255,.28);
}


.service-image {
  height: 270px;
  overflow: hidden;
  background: #111;
}


.service-image img {
  height: 100%;
  object-fit: cover;
  transition: .45s ease;
}


.service-card:hover .service-image img {
  transform: scale(1.05);
}


.service-content {
  padding: 26px;
}


.service-number {
  color: var(--purple);
  font-weight: 800;
  font-size: 12px;
  letter-spacing: .12em;
}


.service-content h3 {
  font-size: 30px;
  margin: 8px 0 10px;
}


.service-content p {
  color: var(--muted);
  line-height: 1.65;
  min-height: 80px;
}


.service-content a {
  display: inline-block;
  margin-top: 8px;
  color: var(--purple);
  font-weight: 800;
}


/* =========================
   EXPERIENCE
   ========================= */

.impact {
  position: relative;
  overflow: hidden;
  padding: 112px 0;
  color: white;

  background: linear-gradient(
    135deg,
    #0e1227 0%,
    #171132 42%,
    #132348 100%
  );
}


.impact::before {
  content: '';
  position: absolute;
  inset: 0;

  background:
    linear-gradient(
      90deg,
      rgba(124,60,255,.10),
      transparent 45%,
      rgba(95,226,255,.08)
    );
}


.impact-glow {
  position: absolute;
  width: 520px;
  height: 520px;
  right: -180px;
  top: -120px;
  border-radius: 50%;
  background: rgba(86,211,255,.13);
  filter: blur(45px);
}


.impact-grid {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 86px;
  align-items: center;
}


.impact h2 {
  font-size: clamp(46px,5vw,72px);
  margin: 14px 0 20px;
  line-height: 1.02;
  letter-spacing: -.04em;
}


.impact h2 span {
  color: #9beafe;
}


.impact-copy > p {
  color: #bdc8e7;
  line-height: 1.75;
  font-size: 17px;
  max-width: 570px;
}


.mini-stats {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 10px;
  margin-top: 30px;
}


.mini-stats div {
  padding: 15px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 16px;
}


.mini-stats strong,
.mini-stats span {
  display: block;
}


.mini-stats strong {
  font-size: 14px;
}


.mini-stats span {
  font-size: 11px;
  margin-top: 5px;
  color: #aab7d9;
}


.steps {
  display: flex;
  flex-direction: column;
  gap: 14px;
}


.step {
  display: grid;
  grid-template-columns: 52px 1fr;
  gap: 18px;
  padding: 22px;
  border-radius: 20px;
  background: rgba(255,255,255,.065);
  border: 1px solid rgba(255,255,255,.09);
  backdrop-filter: blur(12px);
}


.step > span {
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  border-radius: 14px;

  background: linear-gradient(
    135deg,
    var(--purple),
    var(--blue)
  );

  font-weight: 800;
}


.step h3 {
  margin: 0 0 4px;
  font-size: 20px;
}


.step p {
  margin: 0;
  color: #b9c5e5;
  line-height: 1.55;
}


/* =========================
   GALERÍA
   ========================= */

.gallery-grid {
  display: grid;
  grid-template-columns: 1.35fr .8fr .8fr;
  gap: 18px;
  min-height: 430px;
}


.gallery-item {
  position: relative;
  margin: 0;
  border-radius: 24px;
  overflow: hidden;
  min-height: 420px;
  box-shadow: 0 20px 55px rgba(20,34,70,.10);
}


.gallery-item img {
  height: 100%;
  object-fit: cover;
  transition: .4s;
}


.gallery-item:hover img {
  transform: scale(1.045);
}


.gallery-item::after {
  content: '';
  position: absolute;
  inset: 0;

  background:
    linear-gradient(
      180deg,
      transparent 58%,
      rgba(8,11,29,.70)
    );
}


.gallery-item figcaption {
  position: absolute;
  left: 20px;
  bottom: 18px;
  z-index: 2;

  color: white;
  font-family: 'Trebuchet MS', Arial, sans-serif;
  font-size: 22px;
  font-weight: 700;
}


/* =========================
   TRUST
   ========================= */

.section-soft {
  background: linear-gradient(
    180deg,
    #f5f9ff,
    #eef4ff
  );
}


.trust {
  padding: 86px 0;
}


.trust-grid {
  display: grid;
  grid-template-columns: 1.35fr repeat(3,1fr);
  gap: 18px;
  align-items: stretch;
}


.trust-intro {
  padding-right: 24px;
}


.trust-intro h2 {
  font-size: 38px;
}


.trust-item {
  background: rgba(255,255,255,.82);
  border: 1px solid rgba(82,101,156,.1);
  border-radius: 22px;
  padding: 24px;
  box-shadow: 0 12px 30px rgba(35,51,88,.06);
}


.trust-item > span {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  color: white;

  background: linear-gradient(
    135deg,
    var(--purple),
    var(--cyan)
  );

  font-weight: 900;
  margin-bottom: 18px;
}


.trust-item strong {
  font-family: 'Trebuchet MS', Arial, sans-serif;
  font-size: 18px;
}


.trust-item p {
  color: var(--muted);
  line-height: 1.6;
  margin-bottom: 0;
}


/* =========================
   OPINIONES
   ========================= */

.reviews {
  padding: 110px 0;

  background:
    radial-gradient(
      circle at 85% 20%,
      rgba(95,226,255,.10),
      transparent 28%
    ),
    linear-gradient(
      180deg,
      #ffffff 0%,
      #f7fbff 100%
    );
}


.reviews-heading {
  align-items: center;
}


.reviews-rating {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 4px;
}


.reviews-rating .stars {
  color: #f5b800;
  font-size: 22px;
  letter-spacing: 3px;
}


.reviews-rating strong {
  font-family: 'Trebuchet MS', Arial, sans-serif;
  font-size: 30px;
  color: var(--ink);
}


.reviews-rating span {
  color: var(--muted);
  font-size: 13px;
}


.reviews-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
}


.review-card {
  position: relative;
  padding: 28px;
  border-radius: 24px;

  background: rgba(255,255,255,.90);
  border: 1px solid var(--line);

  box-shadow: 0 18px 50px rgba(24,36,72,.08);

  transition: .3s ease;
  overflow: hidden;
}


.review-card::before {
  content: '“';

  position: absolute;
  right: 22px;
  top: 5px;

  font-family: Georgia, serif;
  font-size: 90px;
  line-height: 1;

  color: rgba(124,60,255,.07);

  pointer-events: none;
}


.review-card:hover {
  transform: translateY(-8px);

  border-color: rgba(124,60,255,.25);

  box-shadow:
    0 26px 70px rgba(73,47,150,.14);
}


.review-top {
  display: grid;
  grid-template-columns: 48px 1fr auto;
  gap: 13px;
  align-items: center;
  margin-bottom: 22px;
}


.review-avatar {
  width: 48px;
  height: 48px;

  display: grid;
  place-items: center;

  border-radius: 15px;

  color: white;

  font-family: 'Trebuchet MS', Arial, sans-serif;
  font-weight: 800;
  font-size: 18px;

  background: linear-gradient(
    135deg,
    var(--purple),
    var(--blue)
  );

  box-shadow:
    0 10px 24px rgba(85,70,255,.20);
}


.review-top > div:nth-child(2) {
  display: flex;
  flex-direction: column;
  gap: 3px;
}


.review-top strong {
  font-family: 'Trebuchet MS', Arial, sans-serif;
  font-size: 17px;
}


.review-top span {
  color: var(--muted);
  font-size: 12px;
}


.review-stars {
  color: #f5b800;
  font-size: 13px;
  letter-spacing: 1px;
  white-space: nowrap;
}


.review-card > p {
  position: relative;
  z-index: 1;

  margin: 0;

  min-height: 105px;

  color: #4e5872;
  line-height: 1.75;
  font-size: 15px;
}


.review-event {
  display: flex;
  align-items: center;
  gap: 9px;

  margin-top: 22px;
  padding-top: 17px;

  border-top: 1px solid var(--line);
}


.review-event span {
  width: 22px;
  height: 22px;

  display: grid;
  place-items: center;

  border-radius: 50%;

  color: white;

  background: linear-gradient(
    135deg,
    var(--purple),
    var(--cyan)
  );

  font-size: 11px;
  font-weight: 900;
}


.review-event small {
  color: var(--muted);
}


.reviews-cta {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 20px;

  margin-top: 45px;
  padding-top: 35px;

  border-top: 1px solid var(--line);
}


.reviews-cta p {
  margin: 0;
  color: var(--muted);
  font-weight: 700;
}


.reviews-cta .btn {
  margin: 0;
}


/* =========================
   FAQ
   ========================= */

.faq-grid {
  display: grid;
  grid-template-columns: .85fr 1.15fr;
  gap: 80px;
}


.faq-title {
  position: sticky;
  top: 130px;
  align-self: start;
}


.accordion {
  display: flex;
  flex-direction: column;
  gap: 12px;
}


.faq-item {
  border: 1px solid var(--line);
  border-radius: 17px;
  overflow: hidden;
  background: #fff;
}


.faq-item button {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  text-align: left;

  background: none;
  border: 0;

  padding: 20px 22px;

  font-weight: 800;
  cursor: pointer;
  color: var(--ink);
}


.faq-item b {
  color: var(--purple);
  font-size: 24px;
  transition: .25s;
}


.faq-answer {
  max-height: 0;
  overflow: hidden;
  transition: max-height .35s ease;
}


.faq-answer p {
  margin: 0;
  padding: 0 22px 22px;
  color: var(--muted);
  line-height: 1.7;
}


.faq-item.active .faq-answer {
  max-height: 360px;
}


.faq-item.active b {
  transform: rotate(45deg);
}


/* =========================
   CONTACTO
   ========================= */

.contact {
  position: relative;
  overflow: hidden;
  color: white;

  background:
    linear-gradient(
      135deg,
      #191536,
      #2f1a60 45%,
      #114964
    );

  padding: 100px 0;
}


.contact-wrap {
  position: relative;

  display: grid;
  grid-template-columns: .75fr 1.25fr;
  gap: 60px;

  align-items: center;
}


.contact-copy h2 {
  font-size: clamp(44px,5vw,68px);
  margin: 14px 0 16px;
  line-height: 1.02;
  letter-spacing: -.04em;
}


.contact-copy p {
  color: #d2d8ee;
  line-height: 1.7;
  max-width: 450px;
}


.contact-options {
  display: grid;
  gap: 12px;
}


.contact-card {
  display: grid;
  grid-template-columns: 56px 1fr;
  gap: 16px;
  align-items: center;

  padding: 17px 19px;

  border-radius: 18px;

  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.12);

  backdrop-filter: blur(14px);

  transition: .25s;
}


.contact-card:hover {
  transform: translateX(6px);
  background: rgba(255,255,255,.12);
}


.primary-contact {
  background:
    linear-gradient(
      90deg,
      rgba(124,60,255,.55),
      rgba(45,107,255,.42)
    );
}


.contact-icon {
  display: grid;
  place-items: center;

  width: 48px;
  height: 48px;

  border-radius: 14px;

  background: rgba(255,255,255,.11);

  font-size: 22px;
}


.contact-card div {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;

  gap: 3px 12px;
}


.contact-card small {
  grid-column: 1/-1;
  color: #bfc9ea;
}


.contact-card strong {
  font-family: 'Trebuchet MS', Arial, sans-serif;
  font-size: 22px;
}


.contact-card em {
  font-style: normal;
  color: #dbe1ff;
  font-size: 13px;
  font-weight: 700;
}


.contact-orb {
  position: absolute;
  border-radius: 50%;
  filter: blur(45px);
}


.contact-orb-1 {
  width: 320px;
  height: 320px;
  background: rgba(124,60,255,.30);
  left: -120px;
  top: -80px;
}


.contact-orb-2 {
  width: 260px;
  height: 260px;
  background: rgba(95,226,255,.18);
  right: -90px;
  bottom: -60px;
}


/* =========================
   FOOTER
   ========================= */

footer {
  background: #0b0e1b;
  color: #bcc4dc;
  padding: 26px 0;
}


.footer-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  font-size: 13px;
}


.footer-brand {
  display: flex;
  align-items: center;
  gap: 10px;
}


.footer-brand img {
  width: 42px;
  height: 42px;
  border-radius: 50%;
}


.footer-brand div {
  display: flex;
  flex-direction: column;
}


.footer-brand strong {
  color: white;
  font-family: 'Trebuchet MS', Arial, sans-serif;
  letter-spacing: .08em;
}


.footer-brand span {
  font-size: 10px;
  margin-top: 2px;
}


.footer-inner a {
  color: white;
  font-weight: 700;
}


/* =========================
   WHATSAPP
   ========================= */

.floating-whatsapp {
  position: fixed;
  right: 22px;
  bottom: 22px;
  z-index: 40;

  width: 58px;
  height: 58px;

  border-radius: 50%;

  display: grid;
  place-items: center;

  background: #25d366;
  color: white;

  font-size: 27px;

  box-shadow:
    0 14px 30px rgba(17,91,47,.28);

  border: 4px solid white;

  transition: all .3s ease;
}


.floating-whatsapp img {
  width: 30px;
  height: 30px;
  object-fit: contain;
}


.floating-whatsapp:hover {
  transform: scale(1.1);

  box-shadow:
    0 20px 40px rgba(17,91,47,.35);
}


/* =========================
   BACK TO TOP
   ========================= */

.back-to-top {
  position: fixed;
  left: 22px;
  bottom: 22px;
  z-index: 40;

  width: 48px;
  height: 48px;

  border-radius: 50%;

  display: grid;
  place-items: center;

  background: var(--purple);
  color: white;

  font-size: 20px;

  box-shadow:
    0 10px 25px rgba(85,70,255,.25);

  border: 4px solid white;

  opacity: 0;
  visibility: hidden;

  transform: translateY(20px);

  transition: all .4s ease;
}


.back-to-top.visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}


.back-to-top:hover {
  transform: scale(1.15) translateY(-4px);

  box-shadow:
    0 16px 35px rgba(85,70,255,.35);
}


/* =========================
   ANIMACIONES
   ========================= */

.service-card,
.trust-item,
.contact-card {
  opacity: 0;
  transform: translateY(30px) scale(.95);

  transition:
    all .6s cubic-bezier(.16,1,.3,1);
}


.service-card.animate-in,
.trust-item.animate-in,
.contact-card.animate-in {
  opacity: 1;
  transform: translateY(0) scale(1);
}


.service-card:hover,
.trust-item:hover,
.contact-card:hover {
  transform: translateY(-8px) scale(1.02);
}


.reveal {
  opacity: 0;
  transform: translateY(24px);

  transition:
    opacity .7s ease,
    transform .7s ease;
}


.reveal.visible {
  opacity: 1;
  transform: translateY(0);
}


.delay-1 {
  transition-delay: .1s;
}


.delay-2 {
  transition-delay: .2s;
}


.reveal-delay-1 {
  opacity: 0;
  transform: translateY(30px) translateZ(0);
  transition: all .7s ease .1s;
}


.reveal-delay-1-active {
  opacity: 1;
  transform: translateY(0) translateZ(0);
}


.reveal-delay-2 {
  opacity: 0;
  transform: translateY(30px) translateZ(0);
  transition: all .7s ease .2s;
}


.reveal-delay-2-active {
  opacity: 1;
  transform: translateY(0) translateZ(0);
}


/* =========================
   TABLET
   ========================= */

@media (max-width: 980px) {

  .hero-grid,
  .impact-grid,
  .contact-wrap,
  .faq-grid {
    grid-template-columns: 1fr;
  }


  .hero {
    padding-top: 128px;
  }


  .hero-grid {
    gap: 42px;
  }


  .hero-card img {
    height: 480px;
  }


  .service-grid {
    grid-template-columns: 1fr;
  }


  .service-image {
    height: 360px;
  }


  .gallery-grid {
    grid-template-columns: 1fr 1fr;
  }


  .gallery-large {
    grid-column: 1/-1;
    min-height: 460px;
  }


  .trust-grid {
    grid-template-columns: 1fr 1fr;
  }


  .trust-intro {
    grid-column: 1/-1;
  }


  .faq-title {
    position: static;
  }


  .reviews-grid {
    grid-template-columns: 1fr;
  }


  .review-card > p {
    min-height: auto;
  }


  .nav-links {
    position: absolute;

    top: 82px;
    left: 20px;
    right: 20px;

    display: none;
    flex-direction: column;
    align-items: stretch;

    gap: 4px;

    padding: 14px;

    border-radius: 18px;

    background: rgba(255,255,255,.96);

    box-shadow:
      0 18px 50px rgba(19,30,68,.14);
  }


  .nav-links.open {
    display: flex;
  }


  .nav-links a {
    padding: 11px 12px;
  }


  .menu-toggle {
    display: block;
  }

}


/* =========================
   MOBILE
   ========================= */

@media (max-width: 640px) {

  .container {
    width: min(100% - 28px, 1180px);
  }


  .brand-copy {
    display: none;
  }


  .brand img {
    width: 50px;
    height: 50px;
  }


  .hero {
    padding-top: 112px;
    min-height: auto;
  }


  .hero h1 {
    font-size: 50px;
  }


  .hero-copy > p {
    font-size: 16px;
  }


  .hero-actions {
    flex-direction: column;
  }


  .btn {
    width: 100%;
  }


  .hero-card img {
    height: 420px;
  }


  .section-heading {
    grid-template-columns: 1fr;
    gap: 18px;
  }


  .services,
  .gallery,
  .faq,
  .reviews {
    padding: 82px 0;
  }


  .service-image {
    height: 260px;
  }


  .impact {
    padding: 84px 0;
  }


  .impact-grid {
    gap: 48px;
  }


  .mini-stats {
    grid-template-columns: 1fr;
  }


  .gallery-grid {
    grid-template-columns: 1fr;
  }


  .gallery-large {
    grid-column: auto;
  }


  .gallery-item,
  .gallery-large {
    min-height: 350px;
  }


  .trust-grid {
    grid-template-columns: 1fr;
  }


  .trust-intro {
    grid-column: auto;
  }


  .reviews-rating {
    align-items: flex-start;
  }


  .review-top {
    grid-template-columns: 48px 1fr;
  }


  .review-stars {
    grid-column: 2;
  }


  .reviews-cta {
    flex-direction: column;
    align-items: stretch;
    text-align: center;
  }


  .reviews-cta .btn {
    width: 100%;
  }


  .contact {
    padding: 80px 0;
  }


  .contact-card div {
    grid-template-columns: 1fr;
  }


  .contact-card em {
    margin-top: 3px;
  }


  .footer-inner {
    flex-direction: column;
    align-items: flex-start;
  }

}
/* =========================================================
   PARTY PRO - REDISEÑO OSCURO 2026
   Fondo negro/violeta + tipografía azul/celeste
   ========================================================= */
:root {
  --ink: #f5f7ff;
  --muted: #aeb8d3;
  --line: rgba(148, 175, 255, .16);
  --paper: #090712;
  --paper-2: #100a1e;
  --white: #ffffff;
  --night: #05040a;
  --purple: #8b4dff;
  --purple-2: #b45cff;
  --cyan: #65e7ff;
  --blue: #3978ff;
}

body {
  color: var(--ink);
  background:
    radial-gradient(circle at 15% 10%, rgba(113, 43, 205, .20), transparent 30%),
    radial-gradient(circle at 88% 38%, rgba(44, 92, 255, .13), transparent 30%),
    #07060c;
}

.section-light,
.section-soft,
.services,
.gallery,
.trust,
.reviews,
.faq {
  background:
    radial-gradient(circle at 8% 18%, rgba(119, 48, 211, .13), transparent 27%),
    radial-gradient(circle at 90% 78%, rgba(39, 109, 255, .10), transparent 28%),
    linear-gradient(145deg, #08070e 0%, #10091b 52%, #080a13 100%);
}

.hero {
  background:
    radial-gradient(circle at 82% 16%, rgba(88, 77, 255, .22), transparent 30%),
    radial-gradient(circle at 15% 68%, rgba(139, 77, 255, .20), transparent 32%),
    linear-gradient(135deg, #05050a 0%, #0d0717 48%, #080b15 100%);
}

.site-header.scrolled {
  background: rgba(7, 6, 13, .84);
  border-bottom: 1px solid rgba(137, 100, 255, .12);
  box-shadow: 0 12px 40px rgba(0, 0, 0, .25);
}

.brand-copy span,
.hero-copy > p,
.section-heading p,
.faq-title p,
.service-content p,
.trust-item p,
.reviews-rating span,
.review-top span,
.review-event small,
.reviews-cta p,
.faq-answer p {
  color: var(--muted);
}

/* Títulos con difuminado azul/celeste inspirado en la identidad visual */
.hero h1,
.section-heading h2,
.faq-title h2,
.trust-intro h2,
.contact-copy h2 {
  color: #eef5ff;
}

.hero h1 span,
.section-heading h2,
.faq-title h2,
.trust-intro h2 {
  background: linear-gradient(90deg, #4c7dff 0%, #69e8ff 48%, #9b6cff 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  text-shadow: 0 0 34px rgba(83, 178, 255, .10);
}

.eyebrow,
.kicker,
.service-number,
.service-content a,
.faq-item b {
  color: #69dfff;
}

.btn-ghost,
.chips span {
  color: #e9efff;
  background: rgba(255,255,255,.055);
  border-color: rgba(142, 171, 255, .16);
}

.service-grid {
  grid-template-columns: repeat(4, 1fr);
}

.service-card,
.trust-item,
.review-card,
.faq-item {
  background: linear-gradient(145deg, rgba(19, 15, 31, .96), rgba(10, 10, 18, .94));
  border-color: rgba(128, 153, 255, .15);
  box-shadow: 0 18px 50px rgba(0, 0, 0, .24);
}

.service-card:hover,
.review-card:hover {
  border-color: rgba(101, 231, 255, .32);
  box-shadow: 0 26px 70px rgba(59, 50, 151, .22);
}

.service-content h3,
.review-top strong,
.trust-item strong,
.faq-item button {
  color: #f3f6ff;
}

.review-card > p {
  color: #c5cee4;
}

.review-card::before {
  color: rgba(101, 231, 255, .08);
}

.nav-links a:hover {
  color: var(--cyan);
}

.gallery-item {
  border: 1px solid rgba(130, 155, 255, .14);
  box-shadow: 0 20px 55px rgba(0,0,0,.30);
}

.hero-card {
  border-color: rgba(116, 190, 255, .18);
  box-shadow: 0 35px 80px rgba(0, 0, 0, .42), 0 0 50px rgba(112, 72, 255, .12);
}

.mini-stats {
  grid-template-columns: repeat(4, 1fr);
}

@media (max-width: 1100px) and (min-width: 981px) {
  .service-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 980px) {
  .service-grid { grid-template-columns: 1fr; }
  .nav-links { background: rgba(10, 8, 17, .97); border: 1px solid rgba(125, 150, 255, .14); }
  .menu-toggle span { background: #f3f6ff; }
  .mini-stats { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 640px) {
  .mini-stats { grid-template-columns: 1fr; }
}




/* ===== NAVEGACIÓN SPA + DETALLE DE SERVICIOS ===== */
.service-card-link { display:block; color:inherit; text-decoration:none; }
.service-card-link .service-card { height:100%; cursor:pointer; }
.service-detail-link { display:inline-block; margin-top:8px; color:var(--cyan); font-weight:800; }

.service-detail-page { min-height:100vh; padding:138px 0 90px; position:relative; overflow:hidden; background:radial-gradient(circle at 82% 14%, rgba(82,88,255,.18), transparent 30%), radial-gradient(circle at 12% 70%, rgba(139,77,255,.16), transparent 32%), linear-gradient(135deg,#05050a 0%,#0d0717 48%,#080b15 100%); }
.service-detail-grid { display:grid; grid-template-columns:1fr 1fr; gap:70px; align-items:center; }
.service-detail-image { border-radius:30px; overflow:hidden; border:1px solid rgba(116,190,255,.18); box-shadow:0 35px 80px rgba(0,0,0,.42),0 0 50px rgba(112,72,255,.12); }
.service-detail-image img { width:100%; height:560px; object-fit:cover; }
.service-detail-copy h1 { margin:16px 0 20px; font-family:'Trebuchet MS',Arial,sans-serif; font-size:clamp(48px,6vw,78px); line-height:.98; letter-spacing:-.04em; background:linear-gradient(90deg,#4c7dff 0%,#69e8ff 48%,#9b6cff 100%); -webkit-background-clip:text; background-clip:text; color:transparent; }
.service-detail-copy > p { color:var(--muted); font-size:18px; line-height:1.75; max-width:620px; }
.service-features { display:grid; gap:12px; margin:28px 0 32px; }
.service-feature { padding:16px 18px; border-radius:16px; background:rgba(255,255,255,.055); border:1px solid rgba(142,171,255,.14); color:#eaf0ff; }
.service-detail-actions { display:flex; gap:12px; flex-wrap:wrap; }
.service-detail-actions .btn-ghost { color:#eef5ff; }
.service-back { display:inline-flex; margin-bottom:10px; color:var(--cyan); font-weight:800; }
@media (max-width:980px){ .service-detail-grid{grid-template-columns:1fr;gap:36px}.service-detail-image img{height:420px}.service-detail-page{padding-top:120px} }
@media (max-width:640px){ .service-detail-image img{height:330px}.service-detail-actions{flex-direction:column}.service-detail-actions .btn{width:100%} }


/* Detalle de servicios - contenido definitivo */
.service-detail-kicker{display:inline-block;margin-top:18px;color:var(--cyan);font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase}
.service-detail-tagline{margin:0 0 12px;font-size:clamp(22px,2.2vw,30px);line-height:1.2;color:#eef5ff;letter-spacing:-.02em}
.service-features{display:grid;gap:12px;margin:28px 0 30px}
.service-feature{display:flex;flex-direction:column;gap:5px;padding:16px 18px;border:1px solid rgba(116,190,255,.14);border-radius:16px;background:rgba(255,255,255,.045);color:#dce7ff;line-height:1.55}
.service-feature strong{color:#fff;font-size:15px}
.service-feature span{color:#aebbd3;font-size:14px}
@media(max-width:640px){.service-feature{padding:14px 15px}.service-detail-tagline{font-size:22px}}


/* ===== FAQ CARRUSEL ===== */
.faq-wrap{display:flex;flex-direction:column;gap:42px}
.faq-wrap .faq-title{max-width:760px}
.faq-wrap .faq-title h2{margin-bottom:14px}
.faq-carousel{width:100%;max-width:980px;margin:0 auto}
.faq-viewport{overflow:hidden;border-radius:26px}
.faq-track{display:flex;transition:transform .48s cubic-bezier(.22,.61,.36,1);will-change:transform}
.faq-slide{min-width:100%;box-sizing:border-box;min-height:310px;padding:42px 46px;border:1px solid rgba(116,190,255,.16);border-radius:26px;background:linear-gradient(135deg,rgba(255,255,255,.065),rgba(125,82,255,.055));box-shadow:0 24px 65px rgba(0,0,0,.22);display:flex;flex-direction:column;justify-content:center}
.faq-number{display:inline-block;margin-bottom:18px;color:var(--cyan);font-size:12px;font-weight:900;letter-spacing:.16em}
.faq-slide h3{margin:0 0 18px;color:#f5f7ff;font-size:clamp(24px,3vw,34px);line-height:1.16;letter-spacing:-.025em}
.faq-slide p{margin:0;max-width:820px;color:#b9c5dc;font-size:16px;line-height:1.75}
.faq-controls{display:flex;align-items:center;justify-content:center;gap:22px;margin-top:24px}
.faq-arrow{width:48px;height:48px;border-radius:50%;border:1px solid rgba(116,190,255,.22);background:rgba(255,255,255,.055);color:#f5f7ff;font-size:22px;cursor:pointer;transition:transform .2s ease,background .2s ease,border-color .2s ease}
.faq-arrow:hover{transform:translateY(-2px);background:rgba(105,232,255,.11);border-color:rgba(105,232,255,.48)}
.faq-progress{min-width:54px;text-align:center;color:#dfe8fa;font-weight:800;font-size:14px}.faq-separator{margin:0 5px;color:#71809e}
.faq-dots{display:flex;justify-content:center;gap:8px;margin-top:16px}
.faq-dot{width:7px;height:7px;padding:0;border:0;border-radius:50%;background:rgba(190,205,235,.28);cursor:pointer;transition:width .25s ease,background .25s ease,border-radius .25s ease}
.faq-dot.active{width:24px;border-radius:999px;background:var(--cyan)}
@media(max-width:640px){.faq-wrap{gap:30px}.faq-slide{min-height:350px;padding:30px 24px}.faq-slide h3{font-size:25px}.faq-slide p{font-size:15px;line-height:1.65}.faq-controls{margin-top:18px}.faq-arrow{width:44px;height:44px}}

/* ===== FAQ CARRUSEL · AJUSTE VISUAL FINAL ===== */
.faq-wrap{gap:56px}
.faq-wrap .faq-title{position:relative;z-index:2;max-width:800px;margin-bottom:4px}
.faq-carousel{position:relative;z-index:1;max-width:1040px;margin:0 auto;padding:0 6px}
.faq-viewport{overflow:hidden;border-radius:30px;box-shadow:0 30px 80px rgba(0,0,0,.24),0 0 55px rgba(88,92,255,.07)}
.faq-slide{position:relative;overflow:hidden;min-height:330px;padding:54px 58px 50px;border:1px solid rgba(120,174,255,.22);border-radius:30px;background:radial-gradient(circle at 88% 18%,rgba(92,229,255,.10),transparent 25%),radial-gradient(circle at 10% 100%,rgba(143,77,255,.13),transparent 32%),linear-gradient(135deg,rgba(24,18,39,.96),rgba(12,14,31,.96));box-shadow:inset 0 1px 0 rgba(255,255,255,.035);justify-content:center}
.faq-slide::before{content:"";position:absolute;left:0;top:44px;bottom:44px;width:3px;border-radius:999px;background:linear-gradient(180deg,var(--cyan),#7c5cff);box-shadow:0 0 18px rgba(105,232,255,.35)}
.faq-slide::after{content:"?";position:absolute;right:34px;top:4px;font-family:'Trebuchet MS',Arial,sans-serif;font-size:180px;font-weight:900;line-height:1;color:rgba(255,255,255,.022);pointer-events:none}
.faq-number{position:relative;z-index:1;display:inline-flex;align-items:center;justify-content:center;width:44px;height:28px;margin:0 0 20px;border:1px solid rgba(105,232,255,.20);border-radius:999px;background:rgba(105,232,255,.07);color:var(--cyan);font-size:11px;font-weight:900;letter-spacing:.13em}
.faq-slide h3,.faq-slide p{position:relative;z-index:1}
.faq-slide h3{max-width:820px;margin-bottom:20px}
.faq-slide p{max-width:850px}
.faq-controls{margin-top:28px}
.faq-arrow{background:linear-gradient(145deg,rgba(255,255,255,.07),rgba(99,74,190,.08));box-shadow:0 8px 24px rgba(0,0,0,.16)}
.faq-arrow:hover{box-shadow:0 10px 28px rgba(0,0,0,.22),0 0 20px rgba(105,232,255,.08)}
.faq-progress{padding:8px 13px;border:1px solid rgba(116,190,255,.10);border-radius:999px;background:rgba(255,255,255,.025)}
@media(max-width:640px){.faq-wrap{gap:38px}.faq-carousel{padding:0}.faq-slide{min-height:360px;padding:38px 30px 36px 34px;border-radius:24px}.faq-viewport{border-radius:24px}.faq-slide::before{top:30px;bottom:30px}.faq-slide::after{right:14px;top:18px;font-size:120px}.faq-number{margin-bottom:17px}.faq-slide h3{margin-bottom:16px}.faq-controls{gap:16px;margin-top:22px}}


/* ===== FAQ · ENCABEZADO INDEPENDIENTE Y CENTRADO ===== */
/* Anula el sticky heredado del antiguo acordeón: el encabezado permanece
   quieto mientras sólo cambia el contenido del carrusel. */
#faq .faq-wrap{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:64px;
}
#faq .faq-title{
  position:static;
  top:auto;
  align-self:auto;
  width:100%;
  max-width:900px;
  margin:0 auto;
  padding:0 20px;
  text-align:center;
  z-index:auto;
}
#faq .faq-title .kicker{
  display:block;
  text-align:center;
  margin-bottom:16px;
}
#faq .faq-title h2{
  margin:0 auto;
  max-width:850px;
  text-align:center;
}
#faq .faq-title p{display:none}
#faq .faq-carousel{
  position:relative;
  width:100%;
  max-width:1040px;
  margin:0 auto;
  padding:0 6px;
  z-index:1;
}
@media(max-width:640px){
  #faq .faq-wrap{gap:42px}
  #faq .faq-title{padding:0 12px}
  #faq .faq-title .kicker{margin-bottom:12px}
  #faq .faq-title h2{font-size:clamp(36px,11vw,48px)}
}

/* ===== EVENTOS REALES · GALERÍA ===== */
.events-gallery{position:relative;overflow:hidden;padding:110px 0 120px;background:linear-gradient(135deg,#080717 0%,#10112b 48%,#101b36 100%);color:#fff}
.events-gallery .container{position:relative;z-index:2}.events-glow{position:absolute;border-radius:50%;filter:blur(90px);opacity:.18;pointer-events:none}.events-glow-one{width:420px;height:420px;background:#6b3cff;left:-180px;top:40px}.events-glow-two{width:420px;height:420px;background:#1bbcff;right:-180px;bottom:-100px}
.events-heading{text-align:center;max-width:850px;margin:0 auto 52px}.events-heading .kicker{display:block;margin-bottom:16px}.events-heading h2{margin:0;font-size:clamp(44px,5.5vw,76px);line-height:.98;letter-spacing:-.045em}.events-heading h2 span{background:linear-gradient(90deg,#80eaff,#a788ff);-webkit-background-clip:text;background-clip:text;color:transparent}.events-heading p{max-width:650px;margin:22px auto 0;color:#c4c8df;font-size:18px;line-height:1.7}
.events-mosaic{display:grid;grid-template-columns:1.45fr 1fr 1fr;grid-template-rows:repeat(3,210px);gap:14px}.event-photo{appearance:none;border:1px solid rgba(143,157,255,.22);padding:0;margin:0;border-radius:18px;overflow:hidden;background:#111329;cursor:pointer;position:relative;box-shadow:0 20px 45px rgba(0,0,0,.18)}.event-photo-featured{grid-row:span 3}.event-photo:nth-child(2),.event-photo:nth-child(3){grid-row:span 1}.event-photo:nth-child(4),.event-photo:nth-child(5),.event-photo:nth-child(6),.event-photo:nth-child(7){grid-row:span 1}.event-photo:nth-child(8){display:none}.event-photo img{width:100%;height:100%;display:block;object-fit:cover;transition:transform .45s ease,filter .45s ease}.event-photo::after{content:'↗';position:absolute;right:14px;top:14px;width:36px;height:36px;display:grid;place-items:center;border-radius:50%;background:rgba(8,8,20,.62);border:1px solid rgba(255,255,255,.22);color:#fff;opacity:0;transform:translateY(5px);transition:.25s}.event-photo:hover img{transform:scale(1.045);filter:brightness(1.08)}.event-photo:hover::after{opacity:1;transform:none}
.gallery-lightbox{position:fixed;inset:0;z-index:1000;background:rgba(3,3,12,.94);backdrop-filter:blur(12px);display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:.25s;padding:40px 92px}.gallery-lightbox.open{opacity:1;visibility:visible}.lightbox-image-wrap{height:min(82vh,900px);max-width:min(1100px,82vw);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px}.lightbox-image{max-width:100%;max-height:calc(82vh - 35px);object-fit:contain;border-radius:14px;box-shadow:0 30px 90px rgba(0,0,0,.5)}.lightbox-counter{color:#b9bed6;font-size:14px}.lightbox-close,.lightbox-arrow{position:absolute;border:1px solid rgba(255,255,255,.18);background:rgba(24,25,48,.75);color:#fff;cursor:pointer;display:grid;place-items:center;transition:.2s}.lightbox-close{right:28px;top:24px;width:48px;height:48px;border-radius:50%;font-size:31px}.lightbox-arrow{top:50%;transform:translateY(-50%);width:54px;height:54px;border-radius:50%;font-size:24px}.lightbox-prev{left:28px}.lightbox-next{right:28px}.lightbox-close:hover,.lightbox-arrow:hover{background:#555dff;border-color:#747bff}body.lightbox-open{overflow:hidden}
@media(max-width:900px){.events-gallery{padding:86px 0 94px}.events-mosaic{grid-template-columns:1fr 1fr;grid-template-rows:360px repeat(3,190px)}.event-photo-featured{grid-column:span 2;grid-row:span 1}.event-photo:nth-child(8){display:block}.gallery-lightbox{padding:70px 60px}.lightbox-arrow{width:46px;height:46px}.lightbox-prev{left:12px}.lightbox-next{right:12px}}
@media(max-width:600px){.events-gallery{padding:72px 0 78px}.events-heading{margin-bottom:34px}.events-heading h2{font-size:clamp(38px,12vw,54px)}.events-heading p{font-size:16px}.events-mosaic{grid-template-columns:1fr 1fr;grid-template-rows:300px repeat(4,145px);gap:9px}.event-photo{border-radius:13px}.event-photo-featured{grid-column:span 2}.event-photo:nth-child(8){display:block}.gallery-lightbox{padding:70px 12px 90px}.lightbox-image-wrap{max-width:96vw}.lightbox-arrow{top:auto;bottom:22px;transform:none}.lightbox-prev{left:calc(50% - 62px)}.lightbox-next{right:calc(50% - 62px)}.lightbox-close{right:14px;top:14px}}

/* ===== EVENTOS · REDISEÑO REFERENCIA ===== */
#eventos.events-gallery{padding:82px 0 74px;background:radial-gradient(circle at 50% 12%,rgba(32,90,180,.16),transparent 36%),linear-gradient(135deg,#090516 0%,#0d1029 55%,#07091a 100%);min-height:auto}
#eventos .container{max-width:1120px}
#eventos .events-heading{max-width:760px;margin:0 auto 28px}
#eventos .events-heading .kicker{font-size:12px;letter-spacing:.18em;margin-bottom:14px}
#eventos .events-heading h2{font-size:clamp(38px,4.2vw,58px);line-height:1.02;letter-spacing:-.04em}
#eventos .events-heading p{font-size:15px;line-height:1.6;max-width:600px;margin-top:16px}
.events-filters{display:flex;justify-content:center;flex-wrap:wrap;gap:12px;margin:0 auto 30px}.event-filter{border:1px solid rgba(150,160,230,.24);background:rgba(15,14,38,.68);color:#d8dbed;border-radius:999px;padding:10px 22px;font:inherit;font-size:13px;cursor:pointer;transition:.22s}.event-filter:hover{border-color:rgba(120,210,255,.55);transform:translateY(-1px)}.event-filter.active{color:#fff;border-color:transparent;background:linear-gradient(100deg,#7a45ff,#2fb9ff);box-shadow:0 8px 28px rgba(78,91,255,.28)}
#eventos .events-mosaic{display:grid;grid-template-columns:1.18fr .68fr .68fr;grid-template-rows:245px 245px;gap:14px;max-width:1040px;margin:0 auto}
#eventos .event-photo{display:block!important;grid-row:auto;grid-column:auto;border-radius:15px;border:1px solid rgba(139,150,230,.28);box-shadow:0 18px 42px rgba(0,0,0,.25)}
#eventos .event-photo-featured{grid-row:1 / 3;grid-column:1}
#eventos .event-photo:nth-child(2){grid-column:2;grid-row:1}#eventos .event-photo:nth-child(3){grid-column:3;grid-row:1}#eventos .event-photo:nth-child(4){grid-column:2;grid-row:2}#eventos .event-photo:nth-child(5){grid-column:3;grid-row:2}
#eventos .event-photo::after{display:none}#eventos .event-photo img{object-fit:cover;object-position:center}
.event-caption{position:absolute;z-index:2;left:0;right:0;bottom:0;padding:44px 16px 14px;text-align:left;background:linear-gradient(transparent,rgba(3,4,14,.88));color:#fff;pointer-events:none}.event-caption strong{display:block;font-size:14px;line-height:1.2}.event-caption small{display:block;color:#d3d6e5;margin-top:5px;font-size:12px}
.events-more{display:flex;align-items:center;gap:9px;margin:30px auto 0;border:0;border-radius:999px;padding:12px 24px;background:linear-gradient(100deg,#7847ff,#30baff);color:#fff;font:inherit;font-weight:800;font-size:13px;cursor:pointer;box-shadow:0 12px 30px rgba(64,92,255,.25);transition:.2s}.events-more:hover{transform:translateY(-2px);box-shadow:0 15px 36px rgba(64,92,255,.36)}
.events-deco{position:absolute;width:78px;height:78px;border:1px solid rgba(91,103,255,.24);border-radius:12px;pointer-events:none}.events-deco:after{content:"";position:absolute;width:78px;height:78px;border:1px solid rgba(91,103,255,.13);border-radius:12px}.events-deco-left{left:4%;top:70px}.events-deco-left:after{left:34px;top:20px}.events-deco-right{right:5%;bottom:54px}.events-deco-right:after{right:34px;bottom:20px}
.event-photo.is-filtered-out{display:none!important}
@media(max-width:900px){#eventos.events-gallery{padding:72px 0}#eventos .events-mosaic{grid-template-columns:1fr 1fr;grid-template-rows:330px 190px 190px}#eventos .event-photo-featured{grid-column:1 / 3;grid-row:1}#eventos .event-photo:nth-child(n+2){grid-column:auto;grid-row:auto}.events-deco{display:none}}
@media(max-width:600px){#eventos.events-gallery{padding:62px 0}#eventos .events-heading{margin-bottom:24px}#eventos .events-heading h2{font-size:clamp(36px,11vw,48px)}#eventos .events-heading p{font-size:14px}.events-filters{gap:8px;margin-bottom:22px}.event-filter{padding:8px 14px;font-size:12px}#eventos .events-mosaic{grid-template-columns:1fr 1fr;grid-template-rows:280px 155px 155px;gap:9px}.event-caption{padding:34px 11px 10px}.event-caption strong{font-size:12px}.event-caption small{font-size:10px}.events-more{margin-top:24px}}

/* Galería dinámica: oculta slots vacíos cuando una categoría tiene menos de 5 fotos. */
#eventos .event-photo[hidden],#eventos .event-photo.is-empty{display:none!important}


/* Galería inteligente: si hay exactamente 4 fotos, la última completa el hueco. */
#eventos .events-mosaic.has-four-items .event-photo:nth-child(4){
  grid-column:2 / 4;
  grid-row:2;
}
@media(max-width:900px){
  #eventos .events-mosaic.has-four-items .event-photo:nth-child(4){
    grid-column:1 / 3;
    grid-row:auto;
  }
}
