/* Base del tema. Los colores y las fuentes salen de theme.json (variables
   --wp--preset--*); aca va lo que theme.json no sabe expresar: el layout de las
   secciones, los componentes y los estados. Si un valor se repite, es que falta
   un token.

   Las medidas de desktop son las de Figma a 1440 px, tal cual. Debajo de 1200 px
   el diseno no tiene referencia todavia (no hay mobile): ahi las decisiones son
   nuestras y estan marcadas como tales. */

:root {
  --cw-navy: var(--wp--preset--color--navy);
  --cw-cement: var(--wp--preset--color--cement);
  --cw-cement-gray: var(--wp--preset--color--cement-gray);
  --cw-silver: var(--wp--preset--color--silver);
  --cw-beige: var(--wp--preset--color--beige);
  --cw-mist: var(--wp--preset--color--mist);
  --cw-bordo: var(--wp--preset--color--bordo);

  --cw-margin: var(--wp--custom--grid--margin);
  --cw-container: 1200px;
  --cw-narrow: 996px;           /* la columna interna de 222 a 1218 que usa el diseno */
  --cw-topbar-h: 45px;
  --cw-nav-h: 79px;
  --cw-header-h: calc(var(--cw-topbar-h) + var(--cw-nav-h));

  /* Escala tipografica del diseno: el maximo es el valor de Figma a 1440. */
  --cw-fs-hero: clamp(2rem, 1.2rem + 1.9vw, 2.75rem);       /* 44 */
  --cw-fs-heading: clamp(1.875rem, 1.1rem + 1.8vw, 2.625rem); /* 42 */
  --cw-fs-band: clamp(1.5rem, 1.1rem + 1vw, 2rem);          /* 32 */
  --cw-fs-lead: clamp(1.0625rem, 0.95rem + 0.4vw, 1.25rem); /* 20 */

  --cw-radius-card: 18px;
  --cw-ease: var(--wp--custom--transition);
}

/* ---------------------------------------------------------------- globales */

/* WordPress separa los hijos de .wp-site-blocks y de los layouts "flow" con el
   blockGap. Las secciones del diseno van pegadas: el espacio lo pone cada una. */
.wp-site-blocks > *,
.cw-main > * { margin-block: 0; }

/* Las medidas de Figma son de caja completa (borde y padding incluidos). */
*, *::before, *::after { box-sizing: border-box; }

body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }

/* Los margenes los pone cada componente, no el navegador. */
:where(.cw-main, .cw-header, .cw-footer) :where(h1, h2, h3, h4, p, ul, ol, dl, dd, figure, blockquote) { margin: 0; }
:where(.cw-main, .cw-header, .cw-footer) :where(ul, ol) { padding: 0; list-style: none; }

img, svg, video { max-width: 100%; height: auto; }
.cw-icon { display: inline-block; flex: none; width: auto; height: 1em; }

.cw-container,
.cw-narrow {
  width: min(100% - 2 * var(--cw-margin), var(--cw-container));
  margin-inline: auto;
}
.cw-narrow { width: min(100% - 2 * var(--cw-margin), var(--cw-narrow)); }

/* Fondo de imagen via variable: el pattern pasa --cw-bg con image-set(). */
.cw-has-bg {
  background-image: var(--cw-bg);
  background-size: cover;
  background-position: center;
}

.screen-reader-text {
  position: absolute !important;
  width: 1px; height: 1px;
  overflow: hidden;
  clip: rect(1px, 1px, 1px, 1px);
  white-space: nowrap;
}

/* Foco visible y consistente. Nunca se saca: es accesibilidad, no decoracion. */
:where(a, button, input, select, textarea, [tabindex]):focus-visible {
  outline: 2px solid var(--cw-cement);
  outline-offset: 3px;
  border-radius: 2px;
}

/* Saltar al contenido: el primer tab de cualquier lector de pantalla. */
.cw-skip-link {
  position: absolute;
  left: -9999px;
  z-index: 1000;
  padding: 12px 20px;
  background: var(--cw-navy);
  color: var(--cw-beige);
  text-decoration: none;
}
.cw-skip-link:focus { left: 8px; top: 8px; }

/* ------------------------------------------------------------- componentes */

/* Eyebrow: linea de 46 px + 15 de aire + etiqueta 12/900 en mayusculas. */
.cw-eyebrow {
  display: flex;
  align-items: center;
  gap: 15px;
  font-size: 0.75rem;
  font-weight: 900;
  line-height: 16px;
  text-transform: uppercase;
  color: var(--cw-bordo);
}
.cw-eyebrow__line { flex: none; width: 46px; height: 1px; background: currentColor; }
.cw-eyebrow--center { justify-content: center; }
.cw-eyebrow--light { color: var(--cw-beige); }
.cw-eyebrow--cement { color: var(--cw-cement); }

/* Titulo: primera parte light, segunda black en CEMENTO. 42/46 en desktop. */
.cw-heading {
  font-size: var(--cw-fs-heading);
  line-height: 1.095;
  font-weight: 300;
  color: var(--wp--preset--color--contrast);
}
.cw-heading__light { font-weight: 300; }
.cw-heading__bold { font-weight: 900; color: var(--cw-cement); }
.cw-heading--stack > span { display: block; }
.cw-heading--light-text { color: var(--cw-beige); }
.cw-heading--mono .cw-heading__bold { color: inherit; }   /* negrita del mismo color que el resto */

.cw-lead { font-size: var(--cw-fs-lead); line-height: 1.5; color: var(--cw-cement); }
.cw-text { font-size: 1rem; line-height: 1.25; color: var(--cw-navy); }
.cw-text p + p { margin-top: 20px; }

/* Botones pill: 40 de alto, 24 de padding, 8 entre icono y texto, 16/700. */
.cw-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  height: 40px;
  padding: 0 24px;
  border: 0;
  border-radius: 24px;
  font: inherit;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
  text-decoration: none;
  cursor: pointer;
  transition: background-color var(--cw-ease), color var(--cw-ease), box-shadow var(--cw-ease);
}
.cw-btn .cw-icon { height: 12px; }
.cw-btn--bordo { background: var(--cw-bordo); color: var(--cw-beige); }
.cw-btn--bordo:hover { background: #8a1414; }
.cw-btn--beige { background: var(--cw-beige); color: var(--cw-bordo); }
.cw-btn--beige:hover { background: #fff; }
.cw-btn--cement { background: var(--cw-cement); color: var(--cw-beige); }
.cw-btn--cement:hover { background: #5f7387; }
.cw-btn--ghost { background: transparent; color: var(--cw-cement); box-shadow: inset 0 0 0 0.5px var(--cw-cement); }
.cw-btn--ghost:hover { background: rgb(113 134 154 / 0.12); }
.cw-btn--sm { height: 32px; padding: 0 16px; font-size: 0.75rem; }
.cw-btn--sm .cw-icon { height: 11px; }
.cw-btns { display: flex; flex-wrap: wrap; gap: 16px; }

/* Numero en circulo (1, 2, 3...) de las listas de Callaway Services. */
.cw-badge {
  display: inline-grid;
  place-items: center;
  flex: none;
  width: 23px; height: 23px;
  border-radius: 50%;
  background: var(--cw-bordo);
  color: var(--cw-beige);
  font-family: var(--wp--preset--font-family--display);
  font-size: 13.4px;
  font-weight: 300;
  line-height: 1;
}
.cw-badge--cement { background: var(--cw-cement); }

/* Redes: aro de 28 px (19 en la barra superior) con el glifo adentro. */
.cw-social { display: flex; gap: 9px; }
.cw-social a {
  display: grid;
  place-items: center;
  width: 28px; height: 28px;
  border-radius: 50%;
  box-shadow: inset 0 0 0 1px currentColor;
  color: inherit;
  transition: background-color var(--cw-ease);
}
.cw-social a:hover { background: rgb(113 134 154 / 0.18); }
.cw-social .cw-icon { width: 28px; height: 28px; }

/* Banda con foto y velo: los CTA de 315 px entre secciones. */
.cw-band {
  position: relative;
  isolation: isolate;
  display: flex;
  align-items: center;
  min-height: 315px;
  padding-block: 48px;
  color: var(--cw-beige);
  overflow: hidden;
}
.cw-band__media,
.cw-band__media img {
  position: absolute;
  inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  z-index: -2;
}
.cw-band::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: var(--cw-veil, rgb(24 33 42 / 0.7));
}
.cw-band__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
}
.cw-band__title { max-width: 422px; font-size: var(--cw-fs-band); line-height: 1.125; font-weight: 900; }
/* Banda baja (212) de cierre de cada pagina de Callaway Services. */
.cw-band--slim { min-height: 212px; padding-block: 40px; }
.cw-band--slim .cw-band__title { max-width: 671px; }
.cw-band--wide-sub .cw-band__sub { max-width: 577px; }
.cw-band__sub { max-width: 422px; margin-top: 12px !important; font-size: var(--cw-fs-lead); line-height: 1.5; font-weight: 300; }

/* ------------------------------------------------------------------- hero */

/* Hero a sangre con foto y velo, detras del header transparente. La foto
   arranca debajo de la barra superior (--cw-hero-top) y el velo, 4 px despues,
   como en Figma. Cada pagina ajusta el velo y el layout del contenido. */
.cw-hero {
  position: relative;
  isolation: isolate;
  min-height: 825px;
  color: var(--cw-beige);
  overflow: hidden;
  background: var(--cw-navy);
}
.cw-hero__media { position: absolute; inset: var(--cw-hero-top, 32px) 0 0; z-index: -2; }
.cw-hero__media img { width: 100%; height: 100%; object-fit: cover; }
.cw-hero::after {
  content: "";
  position: absolute;
  inset: 36px 0 0;
  z-index: -1;
  background: var(--cw-hero-veil, rgb(24 33 42 / 0.6));
}
.cw-hero__title {
  font-size: var(--cw-fs-hero);
  line-height: 1.227;           /* 54/44 */
  font-weight: 300;
  text-transform: uppercase;
}
.cw-hero__title strong,
.cw-hero__bold { font-weight: 900; }
.cw-hero__text { font-size: 1rem; line-height: 1.5; }

/* Hero corto (418 de foto): solo el eyebrow, abajo a la izquierda, como titulo.
   Restoration y cada pagina de Callaway Services. */
.cw-hero--short { min-height: 437px; --cw-hero-top: 19px; --cw-hero-veil: rgb(24 33 42 / 0.8); }
.cw-hero--short .cw-hero__content { padding: 385px 0 36px; }
/* Hero alto con el texto centrado (Callaway Services, Credentials, Locations):
   la foto arranca en y=19 y el velo es de 80% (70% con --soft). */
.cw-hero--center { --cw-hero-top: 19px; --cw-hero-veil: rgb(24 33 42 / 0.8); }
.cw-hero--center .cw-hero__content { padding: 254px 0 80px; text-align: center; }
.cw-hero--center .cw-hero__title { margin-top: 16px !important; }
.cw-hero--center .cw-hero__text { max-width: 499px; margin: 4px auto 0 !important; }
.cw-hero--center .cw-hero__text--narrow { max-width: 404px; line-height: 1.25; }
.cw-hero--center .cw-btn { margin-top: 23px; }
/* Velo al 70% en vez de 80: Insights, Contact, Credentials y Locations. */
.cw-hero--soft { --cw-hero-veil: rgb(24 33 42 / 0.7); }

@media (max-width: 1199px) {
  .cw-hero { min-height: 0; }
  .cw-hero--center .cw-hero__content { padding: calc(var(--cw-header-h) + 96px) 0 96px; }
  .cw-hero--short .cw-hero__content { padding-top: calc(var(--cw-header-h) + 160px); }
}
@media (max-width: 781px) {
  .cw-hero--short .cw-hero__content { padding-top: calc(var(--cw-header-h) + 120px); padding-bottom: 32px; }
}

/* ------------------------------------------------------------------ header */

.cw-header {
  position: fixed;
  inset: 0 0 auto;
  z-index: 100;
  color: var(--cw-navy);
}

.cw-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: var(--cw-topbar-h);
  padding: 0 70px 0 82px;
  background: var(--cw-navy);
  color: var(--cw-beige);
}
.cw-topbar__left { display: flex; align-items: center; gap: 13px; }
.cw-topbar .cw-social { gap: 9px; color: var(--cw-cement); }
.cw-topbar .cw-social a { width: 19px; height: 19px; box-shadow: inset 0 0 0 0.75px currentColor; }
.cw-topbar .cw-social .cw-icon { width: 19px; height: 19px; }
.cw-topbar__mail { font-size: 11px; line-height: 13px; color: var(--cw-silver); }
.cw-topbar__emergency {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 28px;
  padding: 0 14px;
  border-radius: 17px;
  box-shadow: inset 0 0 0 0.5px rgb(229 228 226 / 0.15);
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
  color: var(--cw-beige);
  text-decoration: none;
}
.cw-topbar__emergency .cw-icon { height: 8px; }
.cw-topbar__sep { margin-inline: 1px; }

.cw-nav {
  position: relative;
  display: flex;
  align-items: center;
  height: var(--cw-nav-h);
  padding-inline: var(--cw-margin);
  background: var(--cw-beige);
  border-bottom: 1px solid rgb(113 134 154 / 0.35);
  transition: background-color var(--cw-ease);
}
.cw-nav__logo { display: block; flex: none; width: 111px; color: var(--cw-navy); line-height: 0; }
.cw-nav__logo .cw-icon { display: block; width: 111px; height: 49px; }

.cw-nav__menu {
  display: flex;
  align-items: stretch;
  align-self: stretch;
  gap: 32px;
  margin: 0 auto 0 86px;          /* Home arranca en x=318 desde la revision del 30/09 */
  padding: 0;
  list-style: none;
}
.cw-nav__item { position: relative; display: flex; }
.cw-nav__link {
  position: relative;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0;
  border: 0;
  background: none;
  font: inherit;
  font-size: 0.75rem;
  font-weight: 300;
  line-height: 15px;
  color: inherit;
  text-decoration: none;
  cursor: pointer;
}
.cw-nav__link .cw-icon { height: 5px; transition: transform var(--cw-ease); }
.cw-nav__link[aria-current="page"],
.cw-nav__item.is-current > .cw-nav__link { font-weight: 900; }
.cw-nav__link[aria-current="page"]::after,
.cw-nav__item.is-current > .cw-nav__link::after {
  content: "";
  position: absolute;
  inset: auto 0 -1px;
  height: 2px;
  background: var(--cw-cement);
}

.cw-nav__actions { display: flex; align-items: center; gap: 21px; flex: none; }
.cw-nav__search {
  gap: 8px;
  width: 115px;
  padding: 0;
  background: var(--cw-cement);
  color: var(--cw-beige);
  font-size: 0.875rem;
}
.cw-nav__search:hover { background: #5f7387; }
.cw-nav__contact { width: 143px; padding: 0; font-size: 0.875rem; }

/* Sobre un hero: barra transparente y texto claro. Al scrollear se rellena
   (nota de la disenadora). body:has() evita el parpadeo en paginas sin hero. */
body:has(.cw-hero, .cw-cstart) .cw-header:not(.is-scrolled) .cw-nav {
  background: transparent;
  color: var(--cw-beige);
}
body:has(.cw-hero, .cw-cstart) .cw-header:not(.is-scrolled) .cw-nav__logo { color: #fff; }
body:has(.cw-hero, .cw-cstart) .cw-header:not(.is-scrolled) .cw-nav__contact { background: var(--cw-beige); color: var(--cw-bordo); }
.cw-header.is-scrolled .cw-nav { box-shadow: 0 6px 24px rgb(24 33 42 / 0.08); }

/* El header es fijo: su contenedor reserva el alto para que el contenido arranque
   debajo. En paginas con hero no reserva nada, porque el hero va por detras
   (en Contact hace de hero el bloque del formulario). */
.cw-header-part { height: var(--cw-header-h); }
body:has(.cw-hero, .cw-cstart) .cw-header-part { height: 0; }

/* Buscador desplegable debajo de la barra. */
.cw-search {
  position: absolute;
  inset: 100% 0 auto;
  display: none;
  padding: 16px var(--cw-margin);
  background: var(--cw-beige);
  box-shadow: 0 12px 24px rgb(24 33 42 / 0.12);
}
.cw-search.is-open { display: block; }
.cw-search form { display: flex; gap: 12px; max-width: var(--cw-container); margin-inline: auto; }
.cw-search input {
  flex: 1;
  height: 40px;
  padding: 0 20px;
  border: 1px solid var(--cw-cement);
  border-radius: 24px;
  background: #fff;
  font: inherit;
  color: var(--cw-navy);
}

/* ---- menu desplegable (desktop). Nivel 1 oscuro, nivel 2 claro, 196 de ancho. */
.cw-drop {
  position: absolute;
  top: 100%;
  left: -21px;
  z-index: 10;
  min-width: 196px;
  padding: 0;
  margin: 0;
  list-style: none;
  background: var(--cw-navy);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-4px);
  transition: opacity var(--cw-ease), transform var(--cw-ease), visibility 0s linear 180ms;
}
.cw-nav__item.is-open > .cw-drop,
.cw-drop.is-open {
  opacity: 1;
  visibility: visible;
  transform: none;
  transition-delay: 0s;
}
@media (hover: hover) and (min-width: 1200px) {
  .cw-nav__item:hover > .cw-drop {
    opacity: 1;
    visibility: visible;
    transform: none;
    transition-delay: 0s;
  }
  .cw-nav__item:hover > .cw-nav__link .cw-icon { transform: rotate(180deg); }
}
.cw-nav__item.is-open > .cw-nav__link .cw-icon { transform: rotate(180deg); }

.cw-drop__item { position: relative; }
.cw-drop__link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 37px;
  padding: 12px 28px;
  font-size: 10px;
  font-weight: 900;
  line-height: 12px;
  text-transform: uppercase;
  color: var(--cw-beige);
  text-decoration: none;
  transition: background-color var(--cw-ease), color var(--cw-ease);
}
.cw-drop__link .cw-icon { height: 9px; transform: rotate(-90deg); }
.cw-drop__item:first-child > .cw-drop__link { padding-top: 13px; }
.cw-drop__item:last-child > .cw-drop__link { padding-bottom: 13px; }
.cw-drop__item:hover > .cw-drop__link,
.cw-drop__item:focus-within > .cw-drop__link,
.cw-drop__item.is-open > .cw-drop__link { background: var(--cw-mist); color: var(--cw-navy); }
.cw-drop__item:hover > .cw-drop__link .cw-icon,
.cw-drop__item.is-open > .cw-drop__link .cw-icon { transform: rotate(90deg); }

.cw-drop__sub {
  position: absolute;
  top: 0;
  left: 100%;
  min-width: 113px;
  padding: 13px 0;
  margin: 0;
  list-style: none;
  background: var(--cw-mist);
  opacity: 0;
  visibility: hidden;
  transition: opacity var(--cw-ease), visibility 0s linear 180ms;
}
.cw-drop__sub--wide { min-width: 173px; }
.cw-drop__item:hover > .cw-drop__sub,
.cw-drop__item:focus-within > .cw-drop__sub,
.cw-drop__item.is-open > .cw-drop__sub { opacity: 1; visibility: visible; transition-delay: 0s; }
.cw-drop__sub a {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 11px 24px;
  font-size: 10px;
  line-height: 12px;
  text-transform: uppercase;
  color: var(--cw-navy);
  text-decoration: none;
}
.cw-drop__sub a:hover { color: var(--cw-bordo); }
/* Los 24/7 alineados en columna, no pegados a cada texto (revision del 24/10). */
.cw-drop__sub a:has(.cw-drop__badge) { justify-content: space-between; gap: 16px; }
.cw-drop__badge {
  flex: none;
  display: inline-grid;
  place-items: center;
  width: 24px; height: 11px;
  border-radius: 6px;
  background: var(--cw-bordo);
  color: var(--cw-beige);
  font-size: 7px;
  font-weight: 700;
  line-height: 1;
}

.cw-nav__toggle { display: none; }

/* ---- header debajo de 1200: menu hamburguesa. Decision nuestra, sin diseno. */
@media (max-width: 1199px) {
  :root { --cw-topbar-h: 36px; --cw-nav-h: 68px; }
  .cw-topbar { padding-inline: var(--cw-margin); }
  .cw-topbar__left { display: none; }
  .cw-topbar { justify-content: flex-end; }
  .cw-nav__logo, .cw-nav__logo .cw-icon { width: 92px; height: 41px; }
  .cw-nav__toggle {
    display: grid;
    place-items: center;
    width: 40px; height: 40px;
    margin-left: auto;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: transparent;
    color: inherit;
    cursor: pointer;
  }
  .cw-nav__toggle span,
  .cw-nav__toggle span::before,
  .cw-nav__toggle span::after {
    display: block;
    width: 20px; height: 1.5px;
    background: currentColor;
    transition: transform var(--cw-ease), background-color var(--cw-ease);
  }
  .cw-nav__toggle span { position: relative; }
  .cw-nav__toggle span::before,
  .cw-nav__toggle span::after { content: ""; position: absolute; left: 0; }
  .cw-nav__toggle span::before { top: -6px; }
  .cw-nav__toggle span::after { top: 6px; }
  .cw-header.is-menu-open .cw-nav__toggle span { background: transparent; }
  .cw-header.is-menu-open .cw-nav__toggle span::before { transform: translateY(6px) rotate(45deg); }
  .cw-header.is-menu-open .cw-nav__toggle span::after { transform: translateY(-6px) rotate(-45deg); }

  .cw-nav__panel {
    position: fixed;
    inset: var(--cw-header-h) 0 0;
    display: none;
    flex-direction: column;
    gap: 32px;
    padding: 24px var(--cw-margin) 40px;
    overflow-y: auto;
    background: var(--cw-beige);
    color: var(--cw-navy);
  }
  .cw-header.is-menu-open .cw-nav__panel { display: flex; }
  .cw-header.is-menu-open .cw-nav { background: var(--cw-beige) !important; color: var(--cw-navy) !important; }
  .cw-header.is-menu-open .cw-nav__logo { color: var(--cw-navy) !important; }
  .cw-header.is-menu-open .cw-nav__contact { background: var(--cw-bordo) !important; color: var(--cw-beige) !important; }
  .cw-nav__menu { flex-direction: column; gap: 0; margin: 0; }
  .cw-nav__item { flex-direction: column; border-bottom: 1px solid rgb(113 134 154 / 0.3); }
  .cw-nav__link { justify-content: space-between; min-height: 52px; font-size: 1rem; }
  .cw-nav__link[aria-current="page"]::after,
  .cw-nav__item.is-current > .cw-nav__link::after { display: none; }
  .cw-drop,
  .cw-drop__sub {
    position: static;
    display: none;
    min-width: 0;
    opacity: 1;
    visibility: visible;
    transform: none;
  }
  .cw-nav__item.is-open > .cw-drop { display: block; margin-bottom: 16px; }
  .cw-drop__item.is-open > .cw-drop__sub { display: block; }
  .cw-drop__link { min-height: 44px; font-size: 12px; }
  .cw-drop__sub a { padding-block: 12px; font-size: 12px; }
  .cw-nav__actions { flex-wrap: wrap; }
  .cw-nav__actions .cw-btn { flex: 1; width: auto; min-width: 140px; height: 44px; }
}
@media (min-width: 1200px) {
  .cw-nav__panel { display: contents; }
}

/* ------------------------------------------------- where we are located */

/* "Wherever real estate moves, we are there." Va antes del formulario en todas
   las paginas menos Contact. En Figma mide 708; en la home arranca 25 px por
   debajo de los testimonios (queda tapado), asi que ahi el fondo se alinea
   abajo y el padding de arriba es 25 menos. */
.cw-locations { padding: 42px 0 4px; background-color: #f6f7f7; background-position: center bottom; background-size: cover; }
.cw-testimonials + .cw-locations { padding-top: 17px; }
.cw-locations .cw-heading { max-width: 501px; margin-top: 22px !important; }
.cw-locations__text { max-width: 509px; margin-top: 12px !important; }
.cw-map {
  position: relative;
  width: 616px;
  max-width: 100%;
  aspect-ratio: 616 / 430;
}
.cw-map__dots { position: absolute; inset: 0 0 auto; width: 100%; height: auto; }
.cw-map__pins { position: absolute; inset: 0; }
.cw-map__pin {
  position: absolute;
  left: var(--x);
  top: var(--y);
  display: flex;
  flex-direction: column;
  align-items: center;
  translate: -50% -39px;       /* la punta del pin cae en la coordenada */
  color: var(--cw-bordo);
}
.cw-map__pin--partner { color: var(--cw-cement); }
.cw-map__pin .cw-icon { width: 27px; height: 39px; }
.cw-map__label {
  margin-top: 5px;
  padding: 0 12px;
  border-radius: 19px;
  background: currentColor;
  font-size: 11px;
  line-height: 17px;
  text-transform: uppercase;
  white-space: nowrap;
}
.cw-map__label { color: var(--cw-beige); background: var(--cw-bordo); }
.cw-map__pin--partner .cw-map__label { background: var(--cw-cement); }

.cw-map--cities { width: 664px; aspect-ratio: 664 / 464; margin: 16px 0 0 268px; }
.cw-map--cities .cw-map__pin { translate: -50% -42px; }
.cw-map--cities .cw-map__pin .cw-icon { width: 29px; height: 42px; }
.cw-map--cities .cw-map__label { margin-top: 6px; line-height: 18px; padding: 0 12.7px; }

/* ------------------------------------------------------------ contact form */

.cw-contact { padding: 52px 0 49px; background: var(--cw-beige); }
.cw-contact__inner { display: grid; grid-template-columns: 1fr 487px; gap: 24px; align-items: start; }
.cw-contact__intro .cw-heading { margin-top: 22px; }
.cw-contact__intro .cw-text { max-width: 363px; margin-top: 12px; }
.cw-contact__info { display: grid; gap: 32px; margin-top: 34px !important; }
.cw-contact__info dt { font-size: 0.875rem; line-height: 16px; text-transform: uppercase; }
.cw-contact__info dd { margin: 4px 0 0; font-size: 0.875rem; line-height: 17px; font-weight: 900; color: var(--cw-cement); }
.cw-contact__info dd a { color: inherit; }
.cw-contact .cw-social { margin-top: 34px; color: var(--cw-bordo); }
.cw-contact__intro > .cw-btn { margin-top: 33px; }

.cw-form {
  position: relative;
  padding: 25px 45px 50px 40px;
  border-radius: 43px;
  background: linear-gradient(180deg, rgb(113 134 154 / 0.8) 0%, rgb(201 202 205 / 0.8) 62%);
  box-shadow: inset 0 0 0 0.25px var(--cw-navy);
}
.cw-form__field { display: block; position: relative; border-bottom: 0.5px solid var(--cw-cement); }
.cw-form__field input,
.cw-form__field select,
.cw-form__field textarea {
  display: block;
  width: 100%;
  height: 54.5px;
  padding: 19px 0 10.5px;
  border: 0;
  background: transparent;
  font: inherit;
  font-size: 14.6px;
  line-height: 25px;
  color: var(--cw-navy);
  appearance: none;
}
.cw-form__field textarea { height: 107.5px; padding-top: 18px; resize: none; }
.cw-form__field ::placeholder { color: var(--cw-navy); opacity: 1; }
.cw-form__field select { cursor: pointer; }
.cw-form__field select:invalid { color: var(--cw-navy); }
.cw-form__field--select .cw-icon {
  position: absolute;
  right: 0;
  top: 27px;
  height: 7px;
  pointer-events: none;
  color: var(--cw-navy);
}
.cw-form__field input:focus,
.cw-form__field select:focus,
.cw-form__field textarea:focus { outline: none; }
.cw-form__field:focus-within { border-bottom-color: var(--cw-navy); }
.cw-form__hp { position: absolute; left: -9999px; }
.cw-form__actions { margin-top: 28px; }
.cw-form__notice { margin-top: 16px !important; font-size: 0.875rem; font-weight: 700; color: var(--cw-navy); }
.cw-form__notice--error { color: var(--cw-bordo); }

/* ------------------------------------------------------------------ footer */

.cw-footer {
  padding: 48px 0 30px;
  background-size: 100% 100%;
  color: var(--cw-beige);
  background-color: #012a40;
}
.cw-footer__grid {
  display: grid;
  grid-template-columns: 306px 217px 263px 210px 1fr;
  align-items: start;
}
.cw-footer__logo { display: block; width: 180px; color: #fff; line-height: 0; }
.cw-footer__logo .cw-icon { display: block; width: 180px; height: 80px; }
.cw-footer__title { margin: 0; font-size: 0.875rem; line-height: 20px; font-weight: 900; text-transform: uppercase; color: var(--cw-cement); }
.cw-footer__list { margin: 6px 0 0; padding: 0; list-style: none; font-size: 0.75rem; line-height: 20px; }
.cw-footer__list a { color: inherit; text-decoration: none; }
.cw-footer__list a:hover { text-decoration: underline; }
.cw-footer__col .cw-footer__title + .cw-footer__list + .cw-footer__title { margin-top: 13px; }
.cw-footer .cw-social { margin-top: 13px; color: var(--cw-cement); }
.cw-footer__col--help p { margin: 6px 0 0; font-size: 0.75rem; line-height: 20px; }
.cw-footer__col--help .cw-btn { margin-top: 21px; width: 206px; padding: 0; font-size: 0.75rem; }
.cw-footer__bottom {
  margin-top: 70px;
  padding-top: 21px;
  border-top: 0.5px solid var(--cw-cement);
  font-size: 0.875rem;
  line-height: 29px;
  text-align: center;
}

/* ------------------------------------------- tablets y mobile (sin diseno) */

@media (max-width: 1199px) {
  .cw-band__inner { flex-direction: column; align-items: flex-start; }
  .cw-contact__inner { grid-template-columns: 1fr; gap: 48px; }
  .cw-contact__intro { max-width: 520px; }
  .cw-footer__grid { grid-template-columns: repeat(3, 1fr); gap: 40px 24px; }
  .cw-footer__brand { grid-column: 1 / -1; }
  .cw-map, .cw-certs .cw-map, .cw-map--cities { margin-left: auto; margin-right: auto; }
  .cw-locations { padding-bottom: 48px; }
}
@media (max-width: 781px) {
  .cw-map__label, .cw-map--cities .cw-map__label { font-size: 9px; line-height: 15px; padding: 0 6px; }
  .cw-map__pin .cw-icon, .cw-map--cities .cw-map__pin .cw-icon { width: 18px; height: 26px; }
  .cw-map__pin, .cw-map--cities .cw-map__pin { translate: -50% -26px; }
  .cw-form { padding: 28px 24px 36px; border-radius: 28px; }
  .cw-footer__grid { grid-template-columns: 1fr 1fr; }
  .cw-footer__col--help { grid-column: 1 / -1; }
  .cw-footer__bottom { margin-top: 48px; }
}

/* Respetar a quien pidio menos movimiento en su sistema operativo. */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* Dialogo del telefono en desktop (header.js). */
.cw-call {
  width: min(100% - 2 * var(--cw-margin), 420px);
  padding: 36px 40px 32px;
  border: 0;
  border-radius: var(--cw-radius-card);
  background: var(--cw-navy);
  color: var(--cw-beige);
  text-align: center;
}
.cw-call::backdrop { background: rgb(3 27 47 / 0.6); }
.cw-call__eyebrow { font-size: 12px; line-height: 16px; font-weight: 900; letter-spacing: 0.04em; text-transform: uppercase; color: var(--cw-cement); }
.cw-call__number { display: block; margin-top: 12px; font-size: 34px; line-height: 40px; font-weight: 900; color: inherit; text-decoration: none; }
.cw-call__text { margin-top: 8px !important; font-size: 1rem; line-height: 1.25; font-weight: 300; }
.cw-call__btns { justify-content: center; margin-top: 24px; }
.cw-call .cw-btn--ghost { color: var(--cw-beige); box-shadow: inset 0 0 0 0.5px var(--cw-beige); }

/* Paginas de texto (page.html: Privacy Policy, Terms). Columna de lectura,
   titulos chicos y vinetas, que el reset de listas de .cw-main saca. */
.cw-main > .wp-block-post-title,
.cw-main > .wp-block-post-content { max-width: 760px; }
.cw-main > .wp-block-post-content :where(p, li) { font-size: 1rem; line-height: 1.6; }
.cw-main > .wp-block-post-content > * + * { margin-top: 16px; }
.cw-main > .wp-block-post-content h2 { margin-top: 40px; font-size: 22px; line-height: 28px; font-weight: 900; color: var(--cw-navy); }
.cw-main > .wp-block-post-content ul { padding-left: 1.25em; list-style: disc; }
.cw-main > .wp-block-post-content li + li { margin-top: 4px; }