.jn-contact {
  background:#f7f9fc;
  color:#163254;
}
.jn-contact-container {
  width:min(1180px, calc(100% - 40px));
  margin:0 auto;
}
.jn-contact-hero {
  padding:42px 0 18px;
}
.jn-contact-hero .jn-contact-container {
  display:grid;
  grid-template-columns:1.15fr .85fr;
  gap:34px;
  align-items:center;
}
.jn-contact-eyebrow {
  margin:0 0 10px;
  color:#1972e6;
  font-size:14px;
  font-weight:700;
  letter-spacing:.16em;
}
.jn-contact-hero h1 {
  margin:0 0 14px;
  font-size:60px;
  line-height:1.02;
  font-weight:800;
  color:#0e2b5c;
}
.jn-contact-hero__lead {
  max-width:760px;
  margin:0;
  font-size:18px;
  line-height:1.55;
  color:#3a587a;
}
.jn-contact-hero__art {
  position:relative;
  min-height:245px;
}
.jn-contact-hero__blob {
  position:absolute;
  right:0;
  top:12px;
  width:100%;
  height:210px;
  border-radius:110px;
  background:linear-gradient(180deg,#eaf2ff 0%,#edf4ff 100%);
}
.jn-contact-hero__screen {
  position:absolute;
  left:50%;
  top:42px;
  transform:translateX(-50%);
  width:230px;
  height:128px;
  border-radius:18px;
  background:linear-gradient(180deg,#8fc2ff,#dcebff);
  box-shadow:0 18px 35px rgba(27, 67, 124, .12);
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  font-size:68px;
}
.jn-contact-hero__screen::after {
  content:'';
  position:absolute;
  left:30px;
  right:30px;
  bottom:-18px;
  height:12px;
  border-radius:10px;
  background:#cfdcf0;
}
.jn-contact-hero__badge {
  position:absolute;
  top:-12px;
  right:-12px;
  width:42px;
  height:42px;
  border-radius:50%;
  background:#ff4238;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  font-weight:700;
  font-size:24px;
}
.jn-contact-hero__plane {
  position:absolute;
  left:24px;
  top:64px;
  color:#85b6ff;
  font-size:52px;
  transform:rotate(-28deg);
}

.jn-contact-main {
  padding:8px 0 68px;
}
.jn-contact-grid {
  display:grid;
  grid-template-columns:minmax(0, 1.25fr) minmax(340px, .8fr);
  gap:24px;
  align-items:start;
}
.jn-contact-form-card,
.jn-contact-info-card {
  background:#fff;
  border:1px solid #dce6f3;
  border-radius:18px;
  box-shadow:0 8px 22px rgba(25, 56, 102, .06);
}
.jn-contact-form-card {
  padding:22px 22px 16px;
}
.jn-contact-info-card {
  padding:20px 22px;
}
.jn-contact-sidebar {
  display:grid;
  gap:16px;
}
.jn-contact-card-heading {
  display:flex;
  align-items:center;
  gap:14px;
  margin-bottom:14px;
}
.jn-contact-card-heading h2,
.jn-contact-card-heading h3 {
  margin:0;
  line-height:1.2;
  color:#112f58;
}
.jn-contact-card-heading h2 { font-size:20px; }
.jn-contact-card-heading h3 { font-size:18px; }
.jn-contact-icon {
  width:38px;
  height:38px;
  border-radius:12px;
  background:#7eb2f5;
  color:#fff;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:20px;
  font-weight:700;
  flex:0 0 38px;
}
.jn-contact-icon--blue {
  background:#d9e9ff;
  color:#2a77dc;
}
.jn-contact-icon--dark {
  background:#e1e8f2;
  color:#35506f;
}
.jn-contact-form-wrap {
  font-size:16px;
}
.jn-contact-form-wrap form,
.jn-contact-form-wrap .wpforms-container {
  margin:0;
}
.jn-contact-form-wrap input[type="text"],
.jn-contact-form-wrap input[type="email"],
.jn-contact-form-wrap input[type="tel"],
.jn-contact-form-wrap input[type="url"],
.jn-contact-form-wrap textarea,
.jn-contact-form-wrap select {
  width:100%;
  min-height:54px;
  border:1px solid #d9e2ef;
  border-radius:12px;
  padding:12px 16px;
  font-size:16px;
  color:#244466;
  background:#fbfdff;
}
.jn-contact-form-wrap textarea { min-height:120px; }
.jn-contact-form-wrap input:focus,
.jn-contact-form-wrap textarea:focus,
.jn-contact-form-wrap select:focus {
  outline:none;
  border-color:#7aaef2;
  box-shadow:0 0 0 3px rgba(64, 132, 237, .14);
}
.jn-contact-form-wrap button,
.jn-contact-form-wrap input[type="submit"],
.jn-contact-form-wrap .wpforms-submit {
  min-height:54px;
  padding:0 28px;
  border:none;
  border-radius:14px;
  background:linear-gradient(180deg, #ff4a3d 0%, #ff2d2d 100%);
  color:#fff;
  font-size:18px;
  font-weight:700;
  cursor:pointer;
  box-shadow:0 12px 24px rgba(255, 63, 54, .22);
}
.jn-contact-form-wrap .wpforms-field,
.jn-contact-form-wrap .wpforms-field-container > * {
  margin-bottom:16px;
}
.jn-contact-form-placeholder {
  border:2px dashed #c8d7ea;
  border-radius:14px;
  padding:24px;
  background:#fbfdff;
  color:#56708d;
}
.jn-contact-form-note {
  margin:14px 0 0;
  color:#5f7896;
  font-size:14px;
}
.jn-contact-info-card p {
  margin:0;
  color:#45617f;
  line-height:1.6;
}
.jn-contact-topic-list,
.jn-contact-steps-list {
  margin:12px 0 0;
  padding:0;
}
.jn-contact-topic-list {
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:8px 18px;
  list-style:none;
}
.jn-contact-topic-list li {
  position:relative;
  padding-left:20px;
  color:#31516f;
  line-height:1.45;
}
.jn-contact-topic-list li::before {
  content:'✓';
  position:absolute;
  left:0;
  top:0;
  color:#2b84f1;
  font-weight:700;
}
.jn-contact-steps-list {
  list-style:none;
  display:grid;
  gap:12px;
  counter-reset:jnsteps;
}
.jn-contact-steps-list li {
  counter-increment:jnsteps;
  position:relative;
  padding-left:42px;
  color:#31516f;
  line-height:1.5;
}
.jn-contact-steps-list li::before {
  content:counter(jnsteps);
  position:absolute;
  left:0;
  top:0;
  width:28px;
  height:28px;
  border-radius:50%;
  background:#d9e9ff;
  color:#2a77dc;
  font-weight:800;
  display:flex;
  align-items:center;
  justify-content:center;
}
@media (max-width: 1100px) {
  .jn-contact-hero h1 { font-size:48px; }
  .jn-contact-grid { grid-template-columns:1fr; }
}
@media (max-width: 820px) {
  .jn-contact-hero .jn-contact-container { grid-template-columns:1fr; }
  .jn-contact-hero__art { min-height:210px; order:-1; }
  .jn-contact-hero h1 { font-size:40px; }
  .jn-contact-hero__lead { font-size:17px; }
}
@media (max-width: 560px) {
  .jn-contact-container { width:min(100% - 26px, 1180px); }
  .jn-contact-hero { padding-top:28px; }
  .jn-contact-hero h1 { font-size:34px; }
  .jn-contact-form-card,
  .jn-contact-info-card { padding:18px 16px; border-radius:16px; }
  .jn-contact-topic-list { grid-template-columns:1fr; }
  .jn-contact-hero__screen { width:190px; height:112px; font-size:56px; }
  .jn-contact-hero__plane { font-size:40px; left:6px; top:76px; }
}


/* JN Contacto 1.1.7.1: full-width override for Genesis layout wrappers.
   Scoped to this page so all other templates keep their own layout. */
body.jn-contact-page .site-inner,
body.page-template-page-contacto .site-inner {
  display:block;
  width:100%;
  max-width:none;
  margin:0;
  padding:0;
  background:#f7f9fc;
}
body.jn-contact-page .content-sidebar-wrap,
body.page-template-page-contacto .content-sidebar-wrap,
body.jn-contact-page .content,
body.page-template-page-contacto .content {
  display:block;
  float:none;
  width:100%;
  max-width:none;
  min-width:0;
  margin:0;
  padding:0;
}
body.jn-contact-page .sidebar-primary,
body.page-template-page-contacto .sidebar-primary {
  display:none;
}
body.jn-contact-page .site-inner .content .jn-contact,
body.page-template-page-contacto .site-inner .content .jn-contact {
  width:100%;
  max-width:none;
}
body.jn-contact-page .jn-contact-container,
body.page-template-page-contacto .jn-contact-container {
  width:min(1180px, calc(100% - 48px));
  max-width:1180px;
  margin-right:auto;
  margin-left:auto;
}
body.jn-contact-page .jn-contact-hero,
body.page-template-page-contacto .jn-contact-hero {
  padding:56px 0 24px;
}
body.jn-contact-page .jn-contact-main,
body.page-template-page-contacto .jn-contact-main {
  padding:8px 0 72px;
}
body.jn-contact-page .jn-contact-grid,
body.page-template-page-contacto .jn-contact-grid {
  display:grid;
  grid-template-columns:minmax(0, 1.36fr) minmax(0, .88fr);
  align-items:start;
  gap:24px;
}
body.jn-contact-page .jn-contact-form-card,
body.page-template-page-contacto .jn-contact-form-card {
  min-width:0;
  padding:28px;
}
body.jn-contact-page .jn-contact-info-card,
body.page-template-page-contacto .jn-contact-info-card {
  min-width:0;
  padding:24px;
}
body.jn-contact-page .jn-contact-form-wrap .wpforms-container,
body.page-template-page-contacto .jn-contact-form-wrap .wpforms-container,
body.jn-contact-page .jn-contact-form-wrap form,
body.page-template-page-contacto .jn-contact-form-wrap form {
  width:100%;
  max-width:none;
}
body.jn-contact-page .jn-contact-form-wrap input:not([type=checkbox]):not([type=radio]):not([type=hidden]),
body.page-template-page-contacto .jn-contact-form-wrap input:not([type=checkbox]):not([type=radio]):not([type=hidden]),
body.jn-contact-page .jn-contact-form-wrap textarea,
body.page-template-page-contacto .jn-contact-form-wrap textarea {
  max-width:100%;
}
@media (max-width:960px) {
  body.jn-contact-page .jn-contact-grid,
  body.page-template-page-contacto .jn-contact-grid {
    grid-template-columns:minmax(0, 1fr);
  }
  body.jn-contact-page .jn-contact-hero .jn-contact-container,
  body.page-template-page-contacto .jn-contact-hero .jn-contact-container {
    grid-template-columns:minmax(0, 1fr) minmax(0, .72fr);
  }
}
@media (max-width:700px) {
  body.jn-contact-page .jn-contact-container,
  body.page-template-page-contacto .jn-contact-container {
    width:calc(100% - 28px);
  }
  body.jn-contact-page .jn-contact-hero .jn-contact-container,
  body.page-template-page-contacto .jn-contact-hero .jn-contact-container {
    grid-template-columns:minmax(0, 1fr);
  }
  body.jn-contact-page .jn-contact-hero__art,
  body.page-template-page-contacto .jn-contact-hero__art {
    order:-1;
    min-height:200px;
  }
  body.jn-contact-page .jn-contact-form-card,
  body.page-template-page-contacto .jn-contact-form-card,
  body.jn-contact-page .jn-contact-info-card,
  body.page-template-page-contacto .jn-contact-info-card {
    padding:18px;
  }
}
