.start {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border-top: 1px solid rgba(244, 245, 241, .12);
  border-bottom: 1px solid rgba(244, 245, 241, .12);
  background:
    linear-gradient(100deg, rgba(7, 9, 13, .91) 8%, rgba(7, 9, 13, .67) 52%, rgba(7, 9, 13, .34)),
    url("optimized/contacto-recepcion-2000.webp") center / cover no-repeat !important;
}

.start::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(7, 9, 13, .08), rgba(7, 9, 13, .34));
}

.start > .wrap { position: relative; z-index: 1; }
.start > .wrap > .eyebrow,
.start > .wrap > h2 { text-shadow: 0 2px 18px rgba(0, 0, 0, .76); }

.start .start-grid {
  gap: 14px !important;
  background: transparent !important;
}

.start .start-card {
  height: 100%;
  border: 1px solid rgba(244, 245, 241, .2);
  background: rgba(244, 245, 241, .10) !important;
  box-shadow: none;
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
}

.start .start-card h3,
.start .start-card p,
.start .start-card > .eyebrow,
.start .start-card .notice { text-shadow: 0 2px 15px rgba(0, 0, 0, .78); }
.start .start-card p { color: #eef1f5; }

.start .start-card .button:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 4px;
}

@media (max-width: 720px) {
  .start {
    padding: 56px 0 !important;
    background-position: 58% center !important;
  }
  .start .start-grid { gap: 10px !important; }
  .start .start-card {
    min-height: 0;
    padding: 28px 24px;
    background: rgba(244, 245, 241, .115) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .start .button { transition: none !important; }
}
