:root { --contenedor-max: 1440px; --focus-ring: 0 0 0 3px color-mix(in srgb, var(--marca-2, #1cd2ff) 35%, transparent); } .layout-main { display: block; min-height: 60vh; } .layout-nav { display: flex; align-items: center; gap: var(--space-s, 1rem); } .layout-aside { display: block; border-inline-start: 1px solid var(--ui-borde, #d6dcea); padding-inline-start: var(--space-m, 1.5rem); } .layout-section, .seccion { width: 100%; } .contenedor-70, .contenedor-80, .contenedor-90, .contenedor-100 { margin-inline: auto; width: min(var(--ancho-contenedor), calc(100% - clamp(2rem, 4vw, 5rem))); max-width: var(--contenedor-max); } .contenedor-70 { --ancho-contenedor: 70vw; } .contenedor-80 { --ancho-contenedor: 80vw; } .contenedor-90 { --ancho-contenedor: 90vw; } .contenedor-100 { --ancho-contenedor: 100%; } .alto-pantalla { min-height: 100svh; display: grid; align-content: center; } .padding-xs { padding: var(--space-xs, .75rem); } .padding-s { padding: var(--space-s, 1rem); } .padding-m { padding: var(--space-m, 1.5rem); } .padding-l { padding: var(--space-l, 2rem); } .padding-xl { padding: var(--space-xl, 3rem); } .padding-block-s { padding-block: var(--space-s, 1rem); } .padding-block-m { padding-block: var(--space-m, 1.5rem); } .padding-block-l { padding-block: var(--space-l, 2rem); } .padding-block-xl { padding-block: var(--space-2xl, 5rem); } .gap-s { gap: var(--space-s, 1rem); } .gap-m { gap: var(--space-m, 1.5rem); } .gap-l { gap: var(--space-l, 2rem); } .redondeado-s { border-radius: var(--radius-s); } .redondeado-m { border-radius: var(--radius-m); } .redondeado-l { border-radius: var(--radius-l); } .redondeado-xl { border-radius: var(--radius-xl); } .redondeado-full { border-radius: var(--radius-full); } .btn-primero, .btn-segundo, .btn-tercero, .btn-cuarto, button.btn-primero { display: inline-flex; align-items: center; justify-content: center; gap: .6em; min-height: 2.75rem; padding: .78rem 1.15rem; border-radius: var(--radius-m); border: 1px solid transparent; font-weight: 700; text-decoration: none; line-height: 1.1; transition: transform .18s ease, border-color .18s ease, background .18s ease; } .btn-primero { background: var(--marca-1, #6822ff); color: #fff; } .btn-segundo { background: var(--fondo-caja, #f1f3f8); color: var(--texto-titulo, #212529); border-color: var(--ui-borde, #d6dcea); } .btn-tercero { background: transparent; color: var(--texto-enlace, #160042); border-color: currentColor; } .btn-cuarto { background: var(--ui-oscuro, #111); color: var(--ui-claro, #fff); } .btn-primero:hover, .btn-segundo:hover, .btn-tercero:hover, .btn-cuarto:hover { transform: translateY(-1px); } .titulo-h1 { font-size: var(--titulo-h1); line-height: 1.05; font-weight: 800; color: var(--texto-titulo, #212529); } .titulo-h2 { font-size: var(--titulo-h2); line-height: 1.1; font-weight: 750; color: var(--texto-titulo, #212529); } .titulo-h3 { font-size: var(--titulo-h3, clamp(1.5rem, 1.2rem + 1vw, 2.2rem)); line-height: 1.15; font-weight: 700; color: var(--texto-titulo, #212529); } .titulo-h4 { font-size: var(--titulo-h4, clamp(1.25rem, 1.1rem + .6vw, 1.7rem)); line-height: 1.2; font-weight: 700; color: var(--texto-titulo, #212529); } .sub-titulo { font-size: var(--texto-l, 1.15rem); line-height: 1.45; color: var(--texto-sub, #4e5056); font-weight: 500; } .media-contenedor { overflow: hidden; border-radius: var(--radius-l); background: var(--fondo-caja, #f1f3f8); } .imagen-cubrir, .fondo-imagen img { width: 100%; height: 100%; object-fit: cover; display: block; } .fondo-imagen { background-size: cover; background-position: center; background-repeat: no-repeat; } .icono-s { width: 1rem; height: 1rem; } .icono-m { width: 1.5rem; height: 1.5rem; } .icono-l { width: 2.25rem; height: 2.25rem; } .blueprint-header, .blueprint-footer { display: flex; align-items: center; justify-content: space-between; gap: var(--space-m, 1.5rem); } .seccion-header { position: sticky; top: 0; z-index: 20; padding-block: .85rem; background: color-mix(in srgb, var(--fondo-base, #f7f8fb) 92%, transparent); backdrop-filter: blur(12px); border-bottom: 1px solid var(--ui-borde, #d6dcea); } .blueprint-header__marca { color: var(--texto-titulo, #212529); font-weight: 800; text-decoration: none; } .blueprint-header__nav, .blueprint-footer nav { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-s, 1rem); } .blueprint-header__nav a, .blueprint-footer a { color: var(--texto-enlace, #160042); text-decoration: none; font-weight: 650; } .seccion-footer { padding-block: var(--space-l, 2rem); border-top: 1px solid var(--ui-borde, #d6dcea); background: var(--fondo-caja, #f1f3f8); } .sousens-hero { gap: var(--space-m, 1.5rem); } .sousens-grid-3, .sousens-post-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-m, 1.5rem); } .sousens-grid-3 > *, .sousens-post-card, .sousens-listado-vacio, .sousens-auth { background: var(--fondo-caja, #f1f3f8); border: 1px solid var(--ui-borde, #d6dcea); } .sousens-auth { max-width: 44rem; margin-inline: auto; } .sousens-auth__form label { display: grid; gap: .45rem; font-weight: 650; } .sousens-auth input { width: 100%; border: 1px solid var(--ui-borde, #d6dcea); border-radius: var(--radius-s); padding: .8rem .9rem; background: var(--ui-claro, #fff); color: var(--texto-normal, #252628); } .sousens-auth input:focus { outline: none; box-shadow: var(--focus-ring); } .sousens-auth__links { display: flex; flex-wrap: wrap; gap: var(--space-s, 1rem); } .sousens-auth__notice { padding: .9rem 1rem; border-radius: var(--radius-s); background: color-mix(in srgb, var(--marca-2, #1cd2ff) 14%, #fff); border: 1px solid var(--ui-borde, #d6dcea); } .sousens-auth__notice--error { background: #fff1f1; border-color: #ffc7c7; } .aviso-privacidad :where(h2) { margin-top: var(--space-l, 2rem); } @media (max-width: 1024px) { .contenedor-70, .contenedor-80 { --ancho-contenedor: 90vw; } .sousens-grid-3, .sousens-post-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } } @media (max-width: 767px) { .alto-pantalla { min-height: auto; align-content: start; } .padding-block-xl { padding-block: var(--space-xl, 3rem); } .blueprint-header, .blueprint-footer { align-items: flex-start; flex-direction: column; } .sousens-grid-3, .sousens-post-grid { grid-template-columns: 1fr; } }