body {
  margin: 0;
  font-family: "Montserrat", system-ui, -apple-system, "Segoe UI", sans-serif;
  /** custom **/
  background-image: url("/hc/theming_assets/01KRBPFHVYR19GMM30PTTCH81N");
  background-repeat: repeat;
  background-size: auto;
  /** end custom **/
}

/* ---- Concierge split (matches NASupport mock: dark hero | white CTAs) ---- */

.concierge-home {
  background: #ffffff;
}

/* Home concierge: evita doble cabecera con el header estándar del Help Center */
body:has(.concierge-home) header.header {
  display: none !important;
}

/* Evita margen del layout Zendesk que suma pocos px y dispara scroll */
main:has(.concierge-home) {
  margin-top: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.concierge-nav {
  flex-shrink: 0;
  width: 100%;
  box-sizing: border-box;
  background: #ffffff;
  border-bottom: 1px solid #e5e7eb;
  box-shadow: 0 1px 3px rgba(34, 71, 91, 0.06);
}

.concierge-nav-inner {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding: 0.75rem 1.5rem;
  max-width: 100%;
}

@media (min-width: 992px) {
  .concierge-nav-inner {
    padding: 0.875rem 2.75rem;
  }
}

.concierge-home > .mainRow > section {
  padding: 2.5rem 1.5rem;
}

@media (min-width: 992px) {
  .concierge-home > .mainRow > section {
    padding: 3rem 2.75rem;
  }
}

.concierge-home .concierge-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background-color: #122836;
  background-image:
    radial-gradient(ellipse 130% 90% at 25% 25%, rgba(243, 128, 32, 0.14) 0%, transparent 52%),
    radial-gradient(circle farthest-side at 0% 50%, rgba(255, 255, 255, 0.055) 23.5%, rgba(255, 255, 255, 0) 0) 21px 30px,
    radial-gradient(circle farthest-side at 100% 50%, rgba(255, 255, 255, 0.055) 23%, rgba(255, 255, 255, 0) 0) 22px 30px,
    linear-gradient(168deg, #22475b 0%, #22475b 38%, #1a3647 72%, #1a3647 100%);
  background-size: auto, 44px 60px, 44px 60px, auto;
}

.concierge-home .concierge-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at 50% 40%, rgba(0, 0, 0, 0) 35%, rgba(0, 0, 0, 0.35) 100%);
  pointer-events: none;
  z-index: 0;
}

.concierge-home .concierge-hero-stack {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
  width: 100%;
  max-width: 36rem;
  margin: 0 auto;
}

@media (min-width: 992px) {
  .concierge-home .concierge-hero-stack {
    margin: 0 auto 0 0;
    max-width: none;
    width: 100%;
  }
}

.concierge-site-brand {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex-shrink: 0;
}

.concierge-site-brand-mark svg {
  display: block;
}

.concierge-site-title {
  font-weight: 800;
  font-size: 1.35rem;
  line-height: 1.15;
  letter-spacing: -0.02em;
}

.concierge-site-title-na {
  color: #f38020;
}

.concierge-site-title-rest {
  color: #22475b;
}

.concierge-site-tagline {
  margin: 0.15rem 0 0;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #6b7280;
}

@media (max-width: 768px) {
  .concierge-nav-inner {
    justify-content: center;
  }

  .concierge-site-brand {
    justify-content: center;
  }

  .concierge-site-brand-text {
    text-align: center;
  }
}

.concierge-home .concierge-hero-copy {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding-bottom: 1rem;
}

.concierge-home .concierge-kicker {
  color: #ffffff;
  font-size: clamp(1.25rem, 3vw, 1.75rem);
  font-weight: 700;
}

.concierge-home .concierge-brand {
  color: #f38020;
  font-weight: 800;
  font-size: clamp(2.75rem, 9vw, 4.25rem);
  line-height: 1.05;
  letter-spacing: -0.03em;
}

.concierge-home .concierge-lead {
  color: rgba(255, 255, 255, 0.92);
  font-size: clamp(1rem, 2.4vw, 1.2rem);
  font-weight: 500;
  line-height: 1.45;
  margin-left: auto;
  margin-right: auto;
}

@media (min-width: 992px) {
  .concierge-home .concierge-lead {
    margin-left: 0;
    margin-right: 0;
    max-width: none;
  }
}

/* Una sola línea solo con anchura cómoda; evita recorte entre ~992px y ~1200px */
@media (min-width: 1200px) {
  .concierge-home .concierge-lead {
    white-space: nowrap;
  }
}

.concierge-home .concierge-actions {
  background: #ffffff;
  box-shadow: -12px 0 40px rgba(15, 34, 48, 0.06);
}

.concierge-home .concierge-cta-title {
  color: #22475b;
  font-size: clamp(1.35rem, 3.2vw, 1.65rem);
  margin-bottom: 1.75rem;
}

.concierge-cards {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  width: 100%;
}

.concierge-card {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1.15rem 1.25rem;
  border-radius: 14px;
  text-decoration: none !important;
  background: #ffffff;
  box-shadow: 0 2px 12px rgba(34, 71, 91, 0.08);
  transition:
    box-shadow 0.22s ease,
    transform 0.22s ease,
    border-color 0.22s ease,
    background-color 0.22s ease;
}

.concierge-card:hover {
  box-shadow: 0 8px 28px rgba(34, 71, 91, 0.14);
  transform: translateY(-2px);
}

.concierge-card:focus {
  outline: none;
}

.concierge-card:focus-visible {
  outline: 3px solid #22475b;
  outline-offset: 3px;
  box-shadow: 0 2px 12px rgba(34, 71, 91, 0.12), 0 0 0 3px rgba(243, 128, 32, 0.35);
}

.concierge-card:focus-visible:hover {
  transform: translateY(-2px);
}

.concierge-card--ticket:hover .concierge-card-chevron--muted {
  border-color: #6d8491;
}

.concierge-card--login:hover .concierge-card-chevron--orange {
  border-color: #e67109;
}

@media (prefers-reduced-motion: reduce) {
  .concierge-card {
    transition: border-color 0.15s ease, background-color 0.15s ease, box-shadow 0.15s ease;
  }

  .concierge-card:hover,
  .concierge-card:focus-visible:hover {
    transform: none;
  }

  .concierge-card:hover .concierge-card-chevron {
    transform: rotate(-45deg);
  }
}

.concierge-card--login {
  border: 1px solid rgba(243, 128, 32, 0.45);
}

.concierge-card--login:hover {
  background: rgba(243, 128, 32, 0.12);
  border-color: #e67109;
}

.concierge-card--ticket {
  border: 1px solid #e5e7eb;
}

.concierge-card--ticket:hover {
  background: #f3f4f6;
  border-color: #d1d5db;
}

.concierge-card:hover .concierge-card-label {
  color: #1a3647;
}

.concierge-card-icon {
  flex-shrink: 0;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background-color 0.22s ease, color 0.22s ease;
}

.concierge-card-icon--orange {
  background: rgba(243, 128, 32, 0.18);
  color: #f38020;
}

.concierge-card-icon--blue {
  background: rgba(149, 187, 197, 0.35);
  color: #22475b;
}

.concierge-card:hover .concierge-card-icon--orange {
  background: rgba(243, 128, 32, 0.35);
  color: #e67109;
}

.concierge-card:hover .concierge-card-icon--blue {
  background: rgba(149, 187, 197, 0.35);
  color: #1a3647;
}

.concierge-card-label {
  flex: 1;
  text-align: left;
  font-size: 1.05rem;
  font-weight: 700;
  color: #22475b;
  line-height: 1.3;
  transition: color 0.22s ease;
}

.concierge-card-chevron {
  display: inline-block;
  flex-shrink: 0;
  width: 10px;
  height: 10px;
  border-style: solid;
  border-width: 0 2px 2px 0;
  transform: rotate(-45deg);
  margin-right: 4px;
  transition: transform 0.22s ease, border-color 0.22s ease;
}

.concierge-card:hover .concierge-card-chevron {
  transform: rotate(-45deg) translate(5px, 0);
}

.concierge-card-chevron--orange {
  border-color: #f38020;
}

.concierge-card-chevron--muted {
  border-color: #9ca3af;
}

.concierge-panel-inner {
  width: 100%;
  max-width: 26rem;
  margin-left: auto;
  margin-right: auto;
}

@media (min-width: 992px) {
  .concierge-home .concierge-actions .concierge-panel-inner {
    margin-left: 0;
    margin-right: auto;
    padding-left: 0.25rem;
  }
}

/*
 * Desktop: el scroll venía de usar 100vh en el bloque central + header/footer de Zendesk.
 * Con :has() encadenamos html → body → main → .concierge-home para ocupar solo el hueco útil.
 * Fallback sin :has(): 100dvh limita barra del navegador en mobile/desktop.
 */
@media (min-width: 992px) {
  .concierge-home.mainContainer {
    min-height: 0;
    overflow: hidden;
    box-sizing: border-box;
    height: 100vh;
    max-height: 100dvh;
    display: flex;
    flex-direction: column;
  }

  .concierge-home .mainRow {
    min-height: 0 !important;
    height: 100%;
    max-height: 100%;
    flex: 1 1 auto;
  }

  .concierge-home.mainContainer > .mainRow > section {
    min-height: 0 !important;
    height: 100%;
    max-height: 100%;
    overflow: hidden;
    box-sizing: border-box;
  }

  .concierge-home .concierge-hero-stack {
    height: 100%;
    max-height: 100%;
  }

  html:has(.concierge-home) {
    height: 100%;
  }

  body:has(.concierge-home) {
    height: 100%;
    margin: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
  }

  body:has(.concierge-home) > .skip-navigation {
    flex-shrink: 0;
  }

  body:has(.concierge-home) > header.header {
    flex-shrink: 0;
  }

  body:has(.concierge-home) > main {
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    margin-top: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  /* Si main tiene un solo wrapper alrededor del home, debe estirarse igual */
  body:has(.concierge-home) > main > *:only-child {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
  }

  body:has(.concierge-home) > footer {
    flex-shrink: 0;
  }

  body:has(.concierge-home) main .concierge-home.mainContainer {
    flex: 1 1 auto;
    min-height: 0 !important;
    height: auto !important;
    max-height: none !important;
    overflow: hidden;
  }
}

/* Móvil/tablet: quitar min-height 100vh por panel que estira la página sin necesidad */
@media (max-width: 991px) {
  .concierge-home .mainRow {
    min-height: 0 !important;
  }

  .concierge-home.mainContainer section {
    min-height: 0 !important;
    height: auto !important;
    max-height: none !important;
  }
}

.container h1:first-of-type {
  color: inherit;
}

section {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: start;
  align-items: center;
}

.mainContainer section {
  width: 100%;
  min-height: 50vh;
  justify-content: center;
}

@media (min-width: 992px) {
  .mainContainer section {
    min-height: 100vh;
  }
}

.concierge-panel {
  padding: 3rem 1.5rem;
}

@media (min-width: 992px) {
  .concierge-panel {
    padding: 3rem 2.5rem;
  }
}

.sectionContent {
  width: 100%;
}

.mainRow {
  min-height: 100vh;
}

.mainContainer {
  min-height: 100vh;
  display: flex;
}

.firstColumn {
  align-self: stretch;
  flex-direction: column;
  position: relative;
  flex: 1 1 auto;
}

@media (min-width: 992px) {
  .firstColumn {
    flex: 1 1 50%;
  }
}

.firstColumn h2 {
  color: #333333;
}

.firstColumn .superH1 {
  color: #6d8491;
  font-size: 4rem !important;
}

.secondColumn {
  align-self: stretch;
  flex-direction: column;
  position: relative;
  flex: 1 1 auto;
}

@media (min-width: 992px) {
  .secondColumn {
    flex: 1 1 50%;
  }
}

.concierge-home .secondColumn {
  background-color: #ffffff;
}

.custom-btn {
  background-color: #ffffff !important;
  color: #333333 !important;
  padding-left: 1rem !important;
  padding-right: 1rem !important;
  margin: 5px;
  font-size: 1.2rem !important;
  font-weight: bold !important;
  border-radius: 1rem !important;
}

.custom-btn-padding {
  padding-top: 2rem !important;
  padding-bottom: 2rem !important;
}

.custom-btn-padding-responsive {
  padding-top: 0.7rem !important;
  padding-bottom: 0.7rem !important;
}

/***** Forms *****/

.form {
  color: white;
}

.form-field ~ .form-field {
  margin-top: 25px;
}

.form-field label {
  display: block;
  font-size: 13px;
  margin-bottom: 5px;
}

.form-field input {
  border: 1px solid #d1d5db;
  border-radius: 4px;
  padding: 10px;
  width: 100%;
}

.form-field input:focus {
  border: 1px solid #ffffff;
}

.form-field input[type="text"] {
  border: 1px solid #d1d5db;
  border-radius: 4px;
}

.form-field input[type="text"]:focus {
  border: 1px solid #ffffff;
}

.form-field input[type="checkbox"] {
  width: auto;
}

.form-field .nesty-input {
  border-radius: 4px;
  height: 40px;
  line-height: 40px;
  outline: none;
  vertical-align: middle;
}

.form-field .nesty-input:focus {
  border: 1px solid #ffffff;
  text-decoration: none;
}

.form-field .hc-multiselect-toggle:focus {
  outline: none;
  border: 1px solid #ffffff;
  text-decoration: none;
}

.form-field textarea {
  vertical-align: middle;
}

.form-field input[type="checkbox"] + label {
  margin: 0 0 0 10px;
}

.form-field .optional {
  color: white;
  margin-left: 4px;
}

.form-field p {
  color: #ffffff;
  font-size: 12px;
  margin: 5px 0;
}

.form footer {
  margin-top: 0px;
  padding-top: 30px;
  margin-bottom: 10px;
}

.form footer input {
  cursor: pointer;
  background-color: #ffffff;
  border: 0;
  border-radius: 4px;
  color: #333333 !important;
  font-size: 14px;
  line-height: 2.72;
  min-width: 190px;
  padding: 0 1.9286em;
  width: 100%;
}

.form footer a {
  color: #ffffff;
  cursor: pointer;
  margin-right: 15px;
}

.form .suggestion-list {
  font-size: 13px;
  margin-top: 30px;
}

.form .suggestion-list label {
  border-bottom: 1px solid #d1d5db;
  display: block;
  padding-bottom: 5px;
}

.form .suggestion-list li {
  padding: 10px 0;
}

.form .suggestion-list li a:visited {
  color: #ffffff;
}

#request_description_hint {
  color: #ffffff;
}

#upload-dropzone span {
  color: #ffffff;
}

/*
 * Submit a request: solo fondo como el hero del home + colores de texto (sin tarjeta blanca,
 * sin cambiar tamaños de inputs ni botones ni scroll).
 */
main:has(.nasupport-request) {
  position: relative;
  isolation: isolate;
  /* visible: evita recortar `#hc-wysiwyg [role=menu]` (position:absolute) */
  overflow-x: visible;
  background-color: #122836;
  background-image:
    radial-gradient(ellipse 130% 90% at 25% 25%, rgba(243, 128, 32, 0.14) 0%, transparent 52%),
    radial-gradient(circle farthest-side at 0% 50%, rgba(255, 255, 255, 0.055) 23.5%, rgba(255, 255, 255, 0) 0) 21px 30px,
    radial-gradient(circle farthest-side at 100% 50%, rgba(255, 255, 255, 0.055) 23%, rgba(255, 255, 255, 0) 0) 22px 30px,
    linear-gradient(168deg, #22475b 0%, #22475b 38%, #1a3647 72%, #1a3647 100%);
  background-size: auto, 44px 60px, 44px 60px, auto;
  margin-top: 0 !important;
}

main:has(.nasupport-request)::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at 50% 35%, rgba(0, 0, 0, 0) 42%, rgba(0, 0, 0, 0.32) 100%);
  pointer-events: none;
  z-index: 0;
}

main:has(.nasupport-request) > .container-divider {
  position: relative;
  z-index: 1;
  border: none;
  height: 0;
  margin: 0;
  padding: 0;
  background: transparent;
}

main:has(.nasupport-request) > .container.nasupport-request {
  position: relative;
  z-index: 1;
}

main:has(.nasupport-request) .container > h1 {
  color: #ffffff !important;
}

main:has(.nasupport-request) .follow-up-hint {
  color: rgba(255, 255, 255, 0.88) !important;
}

main:has(.nasupport-request) .form footer a {
  color: #f38020 !important;
}

main:has(.nasupport-request) .form-field ~ .form-field {
  margin-top: 14px;
}

main:has(.nasupport-request) .form-field input:not([type="checkbox"]):not([type="radio"]),
main:has(.nasupport-request) .form-field textarea {
  border-color: rgba(243, 128, 32, 0.75) !important;
  caret-color: #f38020;
}

main:has(.nasupport-request) .form-field input:not([type="checkbox"]):not([type="radio"]):hover,
main:has(.nasupport-request) .form-field textarea:hover {
  border-color: #f38020 !important;
}

main:has(.nasupport-request) .form-field input:not([type="checkbox"]):not([type="radio"]):focus,
main:has(.nasupport-request) .form-field textarea:focus {
  border-color: #f38020 !important;
  outline: none !important;
  box-shadow: none !important;
}

main:has(.nasupport-request) .form-field .nesty-input {
  border: 1px solid rgba(243, 128, 32, 0.75) !important;
}

main:has(.nasupport-request) .form-field .nesty-input:hover {
  border-color: #f38020 !important;
}

main:has(.nasupport-request) .form-field .nesty-input:focus {
  border-color: #f38020 !important;
  outline: none !important;
  box-shadow: none !important;
}

main:has(.nasupport-request) .form-field .hc-multiselect-toggle {
  border: 1px solid rgba(243, 128, 32, 0.75) !important;
}

main:has(.nasupport-request) .form-field .hc-multiselect-toggle:hover {
  border-color: #f38020 !important;
}

main:has(.nasupport-request) .form-field .hc-multiselect-toggle:focus {
  border-color: #f38020 !important;
  outline: none !important;
  box-shadow: none !important;
}

main:has(.nasupport-request) .form footer input[type="submit"]:hover:not(:disabled),
main:has(.nasupport-request) .form footer input[type="button"]:hover:not(:disabled) {
  background-color: #f38020 !important;
  color: #ffffff !important;
}

/*
 * WYSIWYG Zendesk `#hc-wysiwyg` + CKEditor: `.form { color: white }` deja texto blanco sobre menús #fff.
 */
body:has(.nasupport-request) #hc-wysiwyg [role="menu"],
main:has(.nasupport-request) #hc-wysiwyg [role="menu"] {
  color: #1f2937 !important;
  z-index: 100000;
}

body:has(.nasupport-request) #hc-wysiwyg [role="menu"] *,
main:has(.nasupport-request) #hc-wysiwyg [role="menu"] * {
  color: #1f2937 !important;
}

body:has(.nasupport-request) #hc-wysiwyg [role="menuitem"],
main:has(.nasupport-request) #hc-wysiwyg [role="menuitem"],
body:has(.nasupport-request) #hc-wysiwyg [role="option"],
main:has(.nasupport-request) #hc-wysiwyg [role="option"] {
  color: #1f2937 !important;
}

main:has(.nasupport-request) #hc-wysiwyg {
  color: #111827;
}

main:has(.nasupport-request) #hc-wysiwyg [contenteditable="true"] {
  color: #111827 !important;
}

main:has(.nasupport-request) #main-content.form:has(#hc-wysiwyg),
main:has(.nasupport-request) .form-field:has(#hc-wysiwyg) {
  overflow: visible;
}

body:has(.nasupport-request) {
  --ck-color-base-text: #1f2937;
  --ck-color-input-text: #1f2937;
  --ck-color-dropdown-panel-background: #ffffff;
}

main:has(.nasupport-request) .form .ck-editor__editable_inline,
main:has(.nasupport-request) .form .ck-editor__editable {
  color: #111827 !important;
}

main:has(.nasupport-request) .form .ck.ck-toolbar .ck-button__label {
  color: #1f2937 !important;
}

body:has(.nasupport-request) .ck.ck-balloon-panel {
  color: #1f2937;
}

body:has(.nasupport-request) .ck.ck-balloon-panel .ck-button:not(.ck-disabled),
body:has(.nasupport-request) .ck.ck-dropdown__panel .ck-button:not(.ck-disabled) {
  color: #1f2937;
}

body:has(.nasupport-request) .ck.ck-balloon-panel .ck-button__label,
body:has(.nasupport-request) .ck.ck-dropdown__panel .ck-button__label,
body:has(.nasupport-request) .ck.ck-list__item .ck-button__label,
body:has(.nasupport-request) .ck.ck-heading-dropdown .ck-button__label {
  color: #1f2937 !important;
}

body:has(.nasupport-request) .ck.ck-list__item {
  color: #1f2937 !important;
}

/* CKEditor 4 (instancias antiguas) */
body:has(.nasupport-request) .cke_panel_listItem a,
body:has(.nasupport-request) .cke_combo_text,
body:has(.nasupport-request) .cke_button_label,
body:has(.nasupport-request) .cke_panel_grouptitle {
  color: #1f2937 !important;
}

/***** media *****/

@media (max-width: 991px) {
  .container .mainRow {
    flex-direction: column;
  }
  .mainContainer {
    min-height: 100%;
    display: block;
    padding: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }
  .concierge-home .secondColumn {
    box-shadow: none;
  }
  .firstColumn:not(.concierge-hero) {
    background-image: url("/hc/theming_assets/01KRBPFHVYR19GMM30PTTCH81N");
    padding-top: 80px;
    padding-bottom: 40px;
    background-repeat: no-repeat;
    background-size: cover;
  }
  .secondColumn:not(.concierge-actions) {
    background-color: #95bbc5;
    padding-top: 80px;
    padding-bottom: 100px;
  }
  .alignRow {
    display: block;
    position: relative;
    top: 0;
  }
}

main > .container {
  width: 100%;
  margin-top: 1rem;
}

@media (min-width: 768px) {
  main > .container:not(.mainContainer) {
    width: 720px;
    max-width: 720px;
  }
}

.notification-error {
  color: #d32f2f;
}

.powered-by-zendesk {
  display: flex;
  justify-content: center;
  width: 100% !important;
  top: unset !important;
  right: 0 !important;
  background-color: transparent !important;
}

.powered-by-zendesk svg {
  fill: white !important;
  margin-bottom: 8px;
}

.powered-by-zendesk * {
  color: white !important;
}

.disabled-button {
  opacity: 0.5;
  pointer-events: none;
}