/* ==========================================================
   IWEBS - LANDING HERO
   ========================================================== */

.iw-landing__hero {
  position: relative;
  overflow: hidden;

  display: flex;
  align-items: center;

  width: 100%;
  min-height: 430px;

  background-color: #214F72;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}


/* OVERLAY
---------------------------------------------------------- */

.iw-landing__hero-overlay {
  position: absolute;
  inset: 0;
  z-index: 1;

  background:
    linear-gradient(
      90deg,
      rgba(19, 36, 59, .88) 0%,
      rgba(19, 36, 59, .72) 48%,
      rgba(19, 36, 59, .38) 100%
    );
}


/* CONTENT
---------------------------------------------------------- */

.iw-landing__hero-content {
  position: relative;
  z-index: 2;

  width: 100%;
  max-width: 1380px;

  margin: 0 auto;
  padding: 72px 32px;
}


/* H1
---------------------------------------------------------- */

.iw-landing__hero h1 {
  max-width: 900px;

  margin: 0 0 24px;

  color: #ffffff;

  font-size: clamp(38px, 5vw, 62px);
  font-weight: 750;
  line-height: 1.06;

  letter-spacing: -.025em;
}


/* INTRO / META_KEYWORD
---------------------------------------------------------- */

.iw-landing__hero-intro {
  max-width: 820px;

  color: rgba(255, 255, 255, .92);

  font-size: 19px;
  line-height: 1.7;
}


/* Si meta_keyword contiene HTML */

.iw-landing__hero-intro p {
  margin: 0 0 14px;
}

.iw-landing__hero-intro p:last-child {
  margin-bottom: 0;
}

.iw-landing__hero-intro strong {
  color: #ffffff;
  font-weight: 700;
}

.iw-landing__hero-intro a {
  color: #ffffff;
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.iw-landing__hero-intro a:hover,
.iw-landing__hero-intro a:focus-visible {
  color: #ffffff;
  opacity: .85;
}


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

@media (max-width: 991px) {

  .iw-landing__hero {
    min-height: 380px;
  }

  .iw-landing__hero-content {
    padding: 60px 24px;
  }

  .iw-landing__hero h1 {
    max-width: 760px;
    font-size: clamp(36px, 6vw, 52px);
  }

  .iw-landing__hero-intro {
    max-width: 720px;
    font-size: 18px;
  }

}


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

@media (max-width: 767px) {

  .iw-landing__hero {
    min-height: 340px;

    background-position: center center;
  }

  .iw-landing__hero-overlay {
    background:
      linear-gradient(
        180deg,
        rgba(19, 36, 59, .72) 0%,
        rgba(19, 36, 59, .90) 100%
      );
  }

  .iw-landing__hero-content {
    padding: 50px 18px;
  }

  .iw-landing__hero h1 {
    margin-bottom: 20px;

    font-size: 36px;
    line-height: 1.1;
  }

  .iw-landing__hero-intro {
    font-size: 17px;
    line-height: 1.65;
  }

}














/* =========================================================
   iWEBS — LANDINGS
   Layouts + Company Cards + Advertising

   HERO NO INCLUIDO
   ========================================================= */


/* =========================================================
   01. BASE
   ========================================================= */

.iw-landing {
	--iw-land-max: 1380px;
	--iw-land-pad: 24px;

	--iw-primary: #2F6F9F;
	--iw-primary-hover: #285E87;
	--iw-primary-dark: #214F72;

	--iw-navy: #13243B;

	--iw-text: #40566D;
	--iw-muted: #698096;

	--iw-line: #DFE8F0;
	--iw-line-strong: #CDD9E4;

	--iw-soft: #F5F9FC;
	--iw-soft-blue: #EAF2F8;

	--iw-card-radius: 22px;

	width: 100%;
	background: #fff;
	color: var(--iw-text);
}


/* =========================================================
   02. OPCIONES DISPONIBLES
   ========================================================= */

.iw-companies-heading {
	width: calc(100% - (var(--iw-land-pad) * 2));
	max-width: var(--iw-land-max);

	margin: 0 auto;

	padding-top: 48px;
	padding-bottom: 30px;

	text-align: center;
	box-sizing: border-box;
}


/* línea decorativa superior */

.iw-companies-heading__line {
	display: block;

	width: 58px;
	height: 4px;

	margin: 0 auto 18px;

	border-radius: 999px;

	background: var(--iw-primary);
}


/* H2 */

.iw-companies-heading h2 {
	margin: 0 0 10px;

	color: var(--iw-navy);

	font-size: clamp(28px, 2.7vw, 40px);
	font-weight: 750;
	line-height: 1.15;
	letter-spacing: -0.025em;
}

.iw-companies-heading h2 span {
	color: var(--iw-primary);
}


/* subtítulo */

.iw-companies-heading p {
	max-width: 700px;

	margin: 0 auto;

	color: var(--iw-muted);

	font-size: 15px;
	line-height: 1.65;
}


/* =========================================================
   03. CONTENEDOR DE LOS LAYOUTS
   ========================================================= */

.iw-landing-body {
	display: grid;

	width: calc(100% - (var(--iw-land-pad) * 2));
	max-width: var(--iw-land-max);

	margin: 0 auto;

	box-sizing: border-box;
}


/* bloques */

.iw-companies {
	grid-area: companies;

	min-width: 0;
}

.iw-ad-slot {
	grid-area: ad;
}

.iw-editorial {
	grid-area: editorial;

	min-width: 0;
}


/* =========================================================
   04. LAYOUT 1

   CARDS                160x600
   DESCRIPTION          160x600

   Corrige el hueco blanco de la primera versión.
   ========================================================= */

.iw-layout-1 .iw-landing-body {
	grid-template-columns:
		minmax(0, 1fr)
		160px;

	grid-template-areas:
		"companies ad"
		"editorial ad";

	column-gap: 36px;
	row-gap: 0;

	align-items: start;
}


/* Description comienza inmediatamente bajo cards */

.iw-layout-1 .iw-editorial {
	padding-top: 48px;
}


/* =========================================================
   05. LAYOUT 2

   CARDS CARDS
   DESCRIPTION 160x600
   ========================================================= */

.iw-layout-2 .iw-landing-body {
	grid-template-columns:
		minmax(0, 1fr)
		160px;

	grid-template-areas:
		"companies companies"
		"editorial ad";

	column-gap: 40px;
	row-gap: 46px;

	align-items: start;
}


/* En este layout el espacio ya lo proporciona row-gap */

.iw-layout-2 .iw-editorial {
	padding-top: 0;
}


/* =========================================================
   06. LAYOUT 3

   CARDS
   728x90
   DESCRIPTION
   ========================================================= */

.iw-layout-3 .iw-landing-body {
	grid-template-columns: minmax(0, 1fr);

	grid-template-areas:
		"companies"
		"ad"
		"editorial";

	row-gap: 0;
}

.iw-layout-3 .iw-ad-slot {
	margin-top: 40px;
}

.iw-layout-3 .iw-editorial {
	padding-top: 48px;
}


/* =========================================================
   07. LAYOUT 4

   728x90
   CARDS
   DESCRIPTION
   ========================================================= */

.iw-layout-4 .iw-landing-body {
	grid-template-columns: minmax(0, 1fr);

	grid-template-areas:
		"ad"
		"companies"
		"editorial";

	row-gap: 0;
}

.iw-layout-4 .iw-ad-slot {
	margin-bottom: 40px;
}

.iw-layout-4 .iw-editorial {
	padding-top: 48px;
}


/* =========================================================
   08. GRID DE EMPRESAS
   ========================================================= */

.iw-companies__grid {
	display: grid;

	grid-template-columns:
		repeat(3, minmax(0, 1fr));

	gap: 24px;

	width: 100%;
}


/* =========================================================
   09. COMPANY CARD
   ========================================================= */

.iw-company-card {
	display: flex;
	flex-direction: column;

	position: relative;

	min-width: 0;
	height: 100%;

	overflow: hidden;

	border: 1px solid rgba(47, 111, 159, 0.12);
	border-radius: var(--iw-card-radius);

	background: #fff;

	box-shadow:
		0 10px 30px rgba(19, 36, 59, 0.07);

	transition:
		transform 180ms ease,
		box-shadow 180ms ease,
		border-color 180ms ease;
}


/* Muy ligero: no queremos cards agresivas */

.iw-company-card:hover {
	transform: translateY(-2px);

	border-color: rgba(47, 111, 159, 0.22);

	box-shadow:
		0 16px 36px rgba(19, 36, 59, 0.10);
}


/* =========================================================
   10. ZONA SUPERIOR DECORATIVA
   ========================================================= */

.iw-company-card__visual {
	position: relative;

	height: 128px;

	flex: 0 0 128px;

	overflow: visible;

	background:
		linear-gradient(
			135deg,
			#E7F3FC 0%,
			#D8EBF8 100%
		);
}


/*
   Segunda onda.
   No necesita imagen adicional.
*/

.iw-company-card__wave {
	position: absolute;

	left: -8%;
	right: -8%;
	bottom: -25px;

	height: 70px;

	border-radius: 50% 50% 0 0 / 55% 55% 0 0;

	background: rgba(255, 255, 255, 0.72);

	transform: rotate(-2deg);
}


/*
   Círculo del logo.
   Queda superpuesto entre cabecera y cuerpo.
*/

.iw-company-card__logo {
	position: absolute;

	left: 50%;
	bottom: -48px;

	display: flex;
	align-items: center;
	justify-content: center;

	width: 112px;
	height: 112px;

	padding: 15px;

	border-radius: 50%;

	background: #fff;

	box-shadow:
		0 9px 24px rgba(19, 36, 59, 0.11);

	transform: translateX(-50%);

	box-sizing: border-box;

	z-index: 2;
}

.iw-company-card__logo img {
	display: block;

	width: auto;
	height: auto;

	max-width: 82px;
	max-height: 82px;

	object-fit: contain;
}


/* =========================================================
   11. CUERPO DE LA CARD
   ========================================================= */

.iw-company-card__body {
	display: flex;
	flex: 1;
	flex-direction: column;

	padding:
		68px
		28px
		26px;

	box-sizing: border-box;
}


/* contenido principal */

.iw-company-card__main {
	text-align: center;
}


/* nombre comercial */

.iw-company-card__name {
	margin: 0 0 6px;

	color: var(--iw-navy);

	font-size: 21px;
	font-weight: 750;
	line-height: 1.3;
	letter-spacing: -0.015em;
}


/* ubicación */

.iw-company-card__location {
	color: var(--iw-muted);

	font-size: 15px;
	font-weight: 500;
	line-height: 1.45;
}


/* divisor entre ubicación y descripción */

.iw-company-card__separator {
	width: 110px;
	height: 1px;

	margin: 22px auto;

	background: var(--iw-line);
}


/* descripción */

.iw-company-card__description {
	margin: 0;

	color: var(--iw-text);

	font-size: 14px;
	line-height: 1.65;

	text-align: left;
}


/* =========================================================
   12. CONTACTO
   ========================================================= */

.iw-company-card__contact {
	display: flex;
	flex-direction: column;

	gap: 10px;

	margin-top: auto;
	padding-top: 22px;
}


/* línea superior del bloque contacto */

.iw-company-card__contact::before {
	content: "";

	display: block;

	width: 100%;
	height: 1px;

	margin-bottom: 6px;

	background: var(--iw-line);
}


/* fila teléfono / web */

.iw-company-card__contact-row {
	display: flex;
	align-items: center;

	gap: 12px;

	min-width: 0;

	color: var(--iw-navy);

	font-size: 14px;
	font-weight: 600;

	text-decoration: none;
}

.iw-company-card__contact-row:hover,
.iw-company-card__contact-row:focus {
	color: var(--iw-primary);
	text-decoration: none;
}


/* círculo icono */

.iw-company-card__contact-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;

	flex: 0 0 32px;

	width: 32px;
	height: 32px;

	border-radius: 50%;

	background: var(--iw-soft-blue);

	color: var(--iw-primary);

	font-size: 14px;
}


/* contenido teléfono / dominio */

.iw-company-card__contact-value {
	min-width: 0;

	overflow: hidden;

	text-overflow: ellipsis;
	white-space: nowrap;
}


/* web en azul */

.iw-company-card__contact-row--website {
	color: var(--iw-primary);
}

.iw-company-card__contact-row--website:hover,
.iw-company-card__contact-row--website:focus {
	color: var(--iw-primary-hover);
}


/* =========================================================
   13. PUBLICIDAD
   ========================================================= */

.iw-ad-slot {
	display: flex;
	align-items: center;
	justify-content: center;

	box-sizing: border-box;

	overflow: hidden;
}


/* vertical */

.iw-ad-slot--vertical {
	width: 160px;
	height: 600px;

	min-width: 160px;
	min-height: 600px;
}


/* horizontal */

.iw-ad-slot--horizontal {
	width: 728px;
	height: 90px;

	min-height: 90px;

	justify-self: center;
}


/* Placeholder temporal */

.iw-ad-slot--debug {
	border: 1px dashed #BCD0E0;

	background: #F5F9FC;
}

.iw-ad-slot__placeholder {
	color: #7990A4;

	font-size: 10px;
	font-weight: 600;

	letter-spacing: 0.08em;
	text-transform: uppercase;
}


/*
   Cuando Revive esté integrado:
   eliminar iw-ad-slot--debug
   y ocultar/eliminar iw-ad-slot__placeholder.
*/


/* =========================================================
   14. DESCRIPTION — SOLO ESTRUCTURA
   ========================================================= */

.iw-editorial {
	padding-bottom: 64px;
}

.iw-editorial__inner {
	width: 100%;
	min-width: 0;

	box-sizing: border-box;
}


/*
   No diseñamos todavía el contenido editorial aquí.
   Bootstrap sigue funcionando dentro de description.
*/


/* =========================================================
   15. TABLET / PANTALLAS MEDIAS
   ========================================================= */

@media (max-width: 991px) {

	.iw-landing {
		--iw-land-pad: 20px;
	}


	/* encabezado */

	.iw-companies-heading {
		padding-top: 40px;
		padding-bottom: 26px;
	}


	/* cards: dos columnas */

	.iw-companies__grid {
		grid-template-columns:
			repeat(2, minmax(0, 1fr));

		gap: 20px;
	}


	/*
	   TODOS LOS LAYOUTS CONVERGEN:

	   CARDS
	   300x250
	   DESCRIPTION
	*/

	.iw-layout-1 .iw-landing-body,
	.iw-layout-2 .iw-landing-body,
	.iw-layout-3 .iw-landing-body,
	.iw-layout-4 .iw-landing-body {

		grid-template-columns: minmax(0, 1fr);

		grid-template-areas:
			"companies"
			"ad"
			"editorial";

		column-gap: 0;
		row-gap: 0;
	}


	/* 300x250 */

	.iw-ad-slot--vertical,
	.iw-ad-slot--horizontal {
		width: 300px;
		height: 250px;

		min-width: 300px;
		min-height: 250px;

		margin-top: 34px;
		margin-bottom: 0;

		justify-self: center;
	}


	/* description */

	.iw-layout-1 .iw-editorial,
	.iw-layout-2 .iw-editorial,
	.iw-layout-3 .iw-editorial,
	.iw-layout-4 .iw-editorial {
		padding-top: 44px;
	}

}


/* =========================================================
   16. MOBILE
   ========================================================= */

@media (max-width: 767px) {

	.iw-landing {
		--iw-land-pad: 17px;
	}


	/* Heading */

	.iw-companies-heading {
		padding-top: 34px;
		padding-bottom: 24px;
	}

	.iw-companies-heading__line {
		width: 44px;
		height: 3px;

		margin-bottom: 14px;
	}

	.iw-companies-heading h2 {
		font-size: 27px;
	}

	.iw-companies-heading p {
		font-size: 14px;
	}


	/* una card por fila */

	.iw-companies__grid {
		grid-template-columns: minmax(0, 1fr);

		gap: 20px;
	}


	/* card */

	.iw-company-card {
		border-radius: 18px;
	}


	/* cabecera card */

	.iw-company-card__visual {
		height: 112px;
		flex-basis: 112px;
	}


	/* logo */

	.iw-company-card__logo {
		width: 100px;
		height: 100px;

		bottom: -44px;

		padding: 14px;
	}

	.iw-company-card__logo img {
		max-width: 74px;
		max-height: 74px;
	}


	/* contenido */

	.iw-company-card__body {
		padding:
			61px
			22px
			23px;
	}


	.iw-company-card__name {
		font-size: 20px;
	}


	.iw-company-card__location {
		font-size: 14px;
	}


	.iw-company-card__separator {
		margin-top: 18px;
		margin-bottom: 18px;
	}


	/* banner móvil */

	.iw-ad-slot--vertical,
	.iw-ad-slot--horizontal {
		width: 300px;
		height: 250px;

		min-width: 300px;
		min-height: 250px;

		max-width: 100%;
	}


	/* description */

	.iw-layout-1 .iw-editorial,
	.iw-layout-2 .iw-editorial,
	.iw-layout-3 .iw-editorial,
	.iw-layout-4 .iw-editorial {
		padding-top: 40px;
		padding-bottom: 52px;
	}

}


/* =========================================================
   17. MÓVILES MUY ESTRECHOS
   ========================================================= */

@media (max-width: 359px) {

	.iw-landing {
		--iw-land-pad: 13px;
	}

	.iw-ad-slot--vertical,
	.iw-ad-slot--horizontal {
		width: 100%;
		min-width: 0;
		max-width: 300px;
	}

}


/* =========================================================
   18. REDUCED MOTION
   ========================================================= */

@media (prefers-reduced-motion: reduce) {

	.iw-company-card {
		transition: none;
	}

	.iw-company-card:hover {
		transform: none;
	}

}




















.iw-ad-slot:has(.adveryon-native-ads) {
    width: 100%;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
}





























/* ============================================================
   iWebs 2026 — CATEGORÍAS: NICHOS / ZONAS / LANDINGS
   AÑADIR AL FINAL DE iwebs-layouts.css
   Requiere los estilos existentes de iwebs-layouts.css
   ============================================================ */

/* Contenedor y wrappers publicitarios que antes vivían inline. */
.iw-below-hero {
  width: 100%;
  max-width: 1380px;
  margin: 0 auto;
  padding: 0 28px;
  box-sizing: border-box;
}

.iw-ad-wrap {
  grid-area: ad;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-self: center;
  width: max-content;
  max-width: 100%;
}

.iw-ad-wrap > .iw-ad-slot {
  grid-area: auto !important;
  margin: 0 !important;
}

.iw-ad-label {
  width: 100%;
  margin: 0 0 3px;
  font-size: 10px;
  line-height: 1.2;
  color: #7B8EA2;
  text-align: center;
}

.iw-ad-label a {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.iw-ad-label a:hover,
.iw-ad-label a:focus { color: #2F6F9F; }

.iw-layout-3 .iw-ad-wrap { margin-top: 40px; }
.iw-layout-4 .iw-ad-wrap { margin-bottom: 40px; }

/* Tarjetas libres: se reutiliza la estructura de tarjeta existente. */
.iw-company-card--available {
  background: #F9FCFE;
  border-style: dashed;
  border-color: #BCD0E0;
}

.iw-company-card--available .iw-company-card__logo {
  color: #2F6F9F;
  font-size: 36px;
}

.iw-company-card--available .iw-company-card__description { text-align: center; }
.iw-company-card--available .iw-company-card__contact-row { justify-content: center; }

/* Eyebrow de las tres variantes; no sustituye el H1. */
.iw-hero-eyebrow {
  display: inline-block;
  max-width: 100%;
  margin: 0 0 17px;
  padding: 8px 14px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.45;
  letter-spacing: .025em;
}

.iw-hero-eyebrow--landing {
  color: #FFFFFF;
  background: rgba(255, 255, 255, .13);
  border: 1px solid rgba(255, 255, 255, .25);
}

/* ============================================================
   HERO NICHO: FONDO CLARO + H1 OSCURO + CATÁLOGO GENÉRICO
   ============================================================ */
.iw-hub__hero {
  position: relative;
  display: flex;
  align-items: center;
  isolation: isolate;
  min-height: 345px;
  overflow: hidden;
}

.iw-hub--nicho .iw-hub__hero {
  background: radial-gradient(circle at 83% 35%, rgba(47, 111, 159, .13), transparent 45%),
              linear-gradient(115deg, #F3F9FD 0%, #E2EFF8 100%);
}

.iw-hub--zona .iw-hub__hero {
  background: radial-gradient(circle at 82% 32%, rgba(185, 230, 245, .15), transparent 45%),
              linear-gradient(115deg, #105968 0%, #21868D 100%);
}

.iw-hub__hero .iw-hub__hero-content {
  position: relative;
  z-index: 2;
  padding: 72px 32px;
}

.iw-hub__hero-text {
  position: relative;
  z-index: 3;
  max-width: min(760px, 61%);
}

.iw-hub--nicho .iw-hub__hero h1 {
  color: #13243B;
  margin-bottom: 0;
}

.iw-hub--zona .iw-hub__hero h1 {
  color: #FFFFFF;
  margin-bottom: 0;
}

.iw-hub--nicho .iw-hero-eyebrow {
  color: #245779;
  background: rgba(47, 111, 159, .10);
  border: 1px solid rgba(47, 111, 159, .15);
}

.iw-hub--zona .iw-hero-eyebrow {
  color: #EDF9FF;
  background: rgba(255, 255, 255, .12);
  border: 1px solid rgba(255, 255, 255, .24);
}

/* Ilustraciones SVG propias, independientes del nicho o la localidad. */
.iw-hub__illustration {
  position: absolute;
  z-index: 1;
  top: 50%;
  right: max(18px, calc((100vw - 1380px) / 2 + 12px));
  width: min(43vw, 520px);
  height: auto;
  transform: translateY(-50%);
  pointer-events: none;
}

.iw-hub__illustration--nicho { color: #2F6F9F; }
.iw-hub__illustration--zona { color: #C0E8F4; }

/* ============================================================
   HUBS — DESCRIPCIÓN, PUBLICIDAD Y LISTADOS
   ============================================================ */
.iw-hub__description {
  max-width: 920px;
  margin: 0 auto;
  padding: 42px 0 26px;
  color: #40566D;
  font-size: 17px;
  line-height: 1.75;
}

.iw-hub__description > :last-child { margin-bottom: 0; }

.iw-hub__ad {
  display: flex;
  justify-content: center;
  padding: 28px 0 36px;
}

.iw-hub__ad .iw-ad-wrap { margin: 0; }

.iw-hub__section { padding: 22px 0 40px; }

.iw-hub__section h2 {
  margin: 0 0 24px;
  color: #13243B;
  font-size: clamp(26px, 2.6vw, 36px);
}

.iw-hub__link {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  min-height: 100px;
  padding: 26px;
  color: #214F72;
  font-size: 18px;
  font-weight: 700;
  text-decoration: none;
}

.iw-hub__link:hover,
.iw-hub__link:focus-visible { color: #2F6F9F; }

.iw-hub__link .fa { flex: 0 0 auto; margin-left: 16px; }

/* ============================================================
   TABLET / MÓVIL
   ============================================================ */
@media (max-width: 991px) {
  .iw-below-hero { padding: 0 18px; }
  .iw-hub__hero { min-height: 310px; }
  .iw-hub__hero .iw-hub__hero-content { padding: 58px 24px; }
  .iw-hub__hero-text { max-width: 67%; }
  .iw-hub__illustration { right: -15px; width: 42vw; }
  .iw-hub__description { padding-top: 34px; font-size: 16px; }
}

@media (max-width: 767px) {
  .iw-hub__hero { min-height: 270px; }
  .iw-hub__hero .iw-hub__hero-content { padding: 48px 18px; }
  .iw-hub__hero-text { max-width: 100%; }
  .iw-hub__hero h1 { position: relative; z-index: 2; }
  .iw-hub__illustration {
    right: -96px;
    width: 340px;
    max-width: none;
    opacity: .18;
  }
  .iw-hub__description { padding-top: 26px; font-size: 15px; }
  .iw-hub__ad { padding: 22px 0 32px; }
  .iw-hub__link { min-height: 80px; padding: 22px; font-size: 16px; }
  .iw-hero-eyebrow { padding: 7px 12px; font-size: 12px; margin-bottom: 16px; }
}

@media (max-width: 359px) {
  .iw-hub__illustration { right: -140px; }
  .iw-hub__hero h1 { font-size: 31px; }
}