:root {
--pensamos-ink: #1f2a44;
--pensamos-ink-soft: #5f6b84;
--pensamos-deep: #0d1c31;
--pensamos-accent: #f08a24;
--pensamos-soft: #eef6fb;
--pensamos-surface: #ffffff;
--pensamos-surface-soft: #f8fbfe;
--pensamos-line: #dde6f0;
--pensamos-line-strong: #cad7e6;
--pensamos-success: #2b8f6e;
--pensamos-shadow: 0 18px 40px rgba(13, 28, 49, 0.08);
--pensamos-shadow-strong: 0 34px 80px rgba(13, 28, 49, 0.12);
--pensamos-radius-md: 24px;
--pensamos-radius-lg: 30px;
--pensamos-radius-pill: 999px;
--pensamos-space-1: 8px;
--pensamos-space-2: 12px;
--pensamos-space-3: 16px;
--pensamos-space-4: 20px;
--pensamos-space-5: 24px;
--pensamos-space-6: 32px;
--pensamos-space-7: 40px;
--pensamos-space-8: 56px;
--pensamos-space-9: 72px;
--pensamos-content-max: 1320px;
--pensamos-section-gap: clamp(56px, 8vw, 88px);
--pensamos-radius: var(--pensamos-radius-md);
--pensamos-home-bg: radial-gradient(circle at top left, rgba(59, 130, 246, 0.2), transparent 30%), linear-gradient(180deg, #eef6fb 0%, #f9fbfd 55%, #ffffff 100%);
--pensamos-highlight: #4f7cff;
}
.pensamarket-page #masthead,
.pensamarket-page .site-header,
.pensamarket-page #ast-desktop-header,
.pensamarket-page #ast-mobile-header,
.pensamarket-page .ast-above-header-wrap,
.pensamarket-page .ast-primary-header-bar,
.pensamarket-page .ast-below-header-wrap {
display: none !important;
}
.pensamarket-page #content,
.pensamarket-page .site-content {
margin: 0;
padding: 0;
}
.pensamarket-page .ast-container,
.pensamarket-page .site-content > .ast-container {
max-width: none !important;
width: 100% !important;
padding: 0 !important;
margin: 0 !important;
display: block !important;
}
.pensamos-course-guide-page .site-content > .ast-container,
.page-template-course-hub .site-content > .ast-container,
.page-template-templates-course-hub .site-content > .ast-container {
max-width: none !important;
width: 100% !important;
padding: 0 !important;
margin: 0 !important;
display: block !important;
}
.pensamarket-page #primary.content-area {
width: 100%;
margin: 0;
padding: 0;
}
.pensamos-course-guide-page #primary.content-area,
.page-template-course-hub #primary.content-area,
.page-template-templates-course-hub #primary.content-area {
width: 100%;
margin: 0;
padding: 0;
}
.pensamarket-page.ast-plain-container.ast-no-sidebar #primary,
.pensamarket-page.ast-plain-container.ast-no-sidebar #primary.content-area {
margin-top: 0 !important;
margin-bottom: 0 !important;
padding-top: 0 !important;
padding-bottom: 0 !important;
}
.pensamos-course-guide-page.ast-plain-container.ast-no-sidebar #primary,
.pensamos-course-guide-page.ast-plain-container.ast-no-sidebar #primary.content-area,
.page-template-course-hub.ast-plain-container.ast-no-sidebar #primary,
.page-template-course-hub.ast-plain-container.ast-no-sidebar #primary.content-area,
.page-template-templates-course-hub.ast-plain-container.ast-no-sidebar #primary,
.page-template-templates-course-hub.ast-plain-container.ast-no-sidebar #primary.content-area {
margin-top: 0 !important;
margin-bottom: 0 !important;
padding-top: 0 !important;
padding-bottom: 0 !important;
}
.pensamarket-page .site-content,
.pensamarket-page .site-main,
.pensamarket-page .pensamarket,
.pensamarket-page .pensamos-course-hub {
width: 100%;
max-width: none;
margin: 0;
padding-inline: 0;
}
.pensamos-course-guide-page .site-content,
.pensamos-course-guide-page .site-main,
.pensamos-course-guide-page .pensamos-course-guide,
.page-template-course-hub .site-content,
.page-template-course-hub .site-main,
.page-template-course-hub .pensamos-course-guide,
.page-template-templates-course-hub .site-content,
.page-template-templates-course-hub .site-main,
.page-template-templates-course-hub .pensamos-course-guide {
width: 100%;
max-width: none;
margin: 0;
padding-inline: 0;
}
body {
color: var(--pensamos-ink);
background: linear-gradient(180deg, #f6fafc 0%, #fbfcfe 54%, #ffffff 100%);
font-feature-settings: "liga" 1, "kern" 1;
text-rendering: optimizeLegibility;
}
body.pensamarket-page {
background: #ffffff;
}
a,
button,
[role="button"],
input[type="submit"],
input[type="button"],
.pensamarket-chip {
-webkit-tap-highlight-color: transparent;
}
.pensamarket-page #page {
display: flex;
flex-direction: column;
min-height: 100vh;
min-height: 100dvh;
background: #ffffff;
}
.pensamos-course-guide__tracker-shell {
margin-bottom: 28px;
}
.pensamos-course-guide__tracker-shell .pensamos-route-tracker {
margin-bottom: 0;
}
.pensamos-home,
.pensamos-course-hub,
.pensamos-module,
.pensamos-lesson {
padding: var(--pensamos-space-6) 0 0;
}
.pensamarket.pensamos-course-hub,
.pensamarket-page .pensamos-course-hub {
padding-top: 0;
}
.pensamos-home {
background: var(--pensamos-home-bg);
}
.pensamos-shell {
width: min(var(--pensamos-content-max), calc(100% - 56px));
margin: 0 auto;
}
.pensamos-intent-hero,
.pensamos-hero {
display: grid;
grid-template-columns: 1.15fr 0.95fr;
gap: 24px;
align-items: stretch;
margin-bottom: 28px;
}
.pensamos-intent-hero {
position: relative;
padding: 34px;
overflow: hidden;
border: 1px solid rgba(255, 255, 255, 0.65);
border-radius: 32px;
background: rgba(255, 255, 255, 0.55);
backdrop-filter: blur(18px);
box-shadow: var(--pensamos-shadow-strong);
isolation: isolate;
}
.pensamos-intent-hero--compact {
min-height: 510px;
max-height: 510px;
padding: 22px;
grid-template-columns: 1.2fr 0.88fr;
}
.pensamos-intent-backdrop {
position: absolute;
inset: 0;
pointer-events: none;
}
.pensamos-orb,
.pensamos-grid-glow {
position: absolute;
border-radius: 999px;
filter: blur(4px);
opacity: 0.7;
}
.pensamos-orb {
animation: pensamosFloat 12s ease-in-out infinite;
}
.pensamos-orb--one {
top: -42px;
right: 12%;
width: 180px;
height: 180px;
background: radial-gradient(circle, rgba(79, 124, 255, 0.5), transparent 70%);
}
.pensamos-orb--two {
right: -30px;
bottom: 15%;
width: 220px;
height: 220px;
background: radial-gradient(circle, rgba(240, 138, 36, 0.38), transparent 68%);
animation-delay: -3s;
}
.pensamos-orb--three {
left: 40%;
bottom: -70px;
width: 200px;
height: 200px;
background: radial-gradient(circle, rgba(43, 143, 110, 0.34), transparent 70%);
animation-delay: -6s;
}
.pensamos-grid-glow {
inset: auto auto -120px -100px;
width: 360px;
height: 360px;
background:
linear-gradient(rgba(255, 255, 255, 0.18) 1px, transparent 1px),
linear-gradient(90deg, rgba(255, 255, 255, 0.18) 1px, transparent 1px);
background-size: 22px 22px;
mask-image: radial-gradient(circle, rgba(0, 0, 0, 1), transparent 72%);
opacity: 0.55;
}
.pensamos-intent-copy,
.pensamos-intent-panel {
position: relative;
z-index: 1;
}
.pensamos-intent-copy {
display: flex;
flex-direction: column;
justify-content: center;
padding: 6px 0;
}
.pensamos-intent-hero--compact .pensamos-intent-copy {
justify-content: flex-start;
padding: 6px 10px 6px 0;
}
.pensamos-kicker {
margin: 0 0 14px;
font-size: 0.95rem;
font-weight: 700;
letter-spacing: 0.03em;
color: var(--pensamos-highlight);
text-transform: uppercase;
}
.pensamos-hero-card,
.pensamos-panel,
.pensamos-card,
.pensamos-feature,
.pensamos-resource-box,
.pensamos-lesson-box,
.pensamos-note,
.pensamos-intent-panel {
background: var(--pensamos-surface);
border: 1px solid var(--pensamos-line);
border-radius: var(--pensamos-radius);
box-shadow: var(--pensamos-shadow);
}
.pensamos-hero-card {
padding: 36px;
background: linear-gradient(140deg, #f7fbff 0%, #eef6fb 55%, #fff3e6 100%);
}
.pensamos-intent-copy h1,
.pensamos-hero-card h1,
.pensamos-course-hub h1,
.pensamos-module h1,
.pensamos-lesson h1 {
margin: 0 0 16px;
font-size: clamp(2.4rem, 5vw, 4.5rem);
line-height: 0.98;
letter-spacing: -0.05em;
max-width: 10ch;
}
.pensamos-intent-hero--compact .pensamos-intent-copy h1 {
font-size: clamp(2.2rem, 4.2vw, 3.8rem);
max-width: 11ch;
margin-bottom: 12px;
}
.pensamos-intent-copy .pensamos-intro,
.pensamos-hero-card p,
.pensamos-course-hub .pensamos-intro,
.pensamos-module .pensamos-intro,
.pensamos-lesson .pensamos-intro {
font-size: 1.05rem;
line-height: 1.75;
margin: 0 0 18px;
max-width: 58ch;
}
.pensamos-intent-hero--compact .pensamos-intro {
font-size: 1rem;
line-height: 1.65;
margin-bottom: 14px;
}
.pensamos-intent-copy.is-swapping h1,
.pensamos-intent-copy.is-swapping .pensamos-intro,
.pensamos-intent-copy.is-swapping .pensamos-kicker,
.pensamos-intent-copy.is-swapping .pensamos-intention-points,
.pensamos-intent-copy.is-swapping .pensamos-actions {
opacity: 0;
transform: translateY(8px);
}
.pensamos-eyebrow {
display: inline-flex;
align-items: center;
gap: 8px;
font-size: 0.78rem;
font-weight: 700;
letter-spacing: 0.12em;
text-transform: uppercase;
color: var(--pensamos-success);
margin-bottom: 16px;
}
.pensamos-actions,
.pensamos-meta-row,
.pensamos-kpis,
.pensamos-lesson-nav {
display: flex;
flex-wrap: wrap;
gap: 12px;
align-items: center;
}
.pensamos-button,
.pensamos-button:visited {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 54px;
padding: 0 26px;
border-radius: var(--pensamos-radius-pill);
background: linear-gradient(135deg, var(--pensamos-deep) 0%, color-mix(in srgb, var(--pensamos-deep) 74%, var(--pensamos-highlight) 26%) 100%);
color: #fff;
font-weight: 700;
font-size: 0.97rem;
letter-spacing: -0.015em;
text-decoration: none;
box-shadow: 0 14px 28px rgba(13, 28, 49, 0.14);
transition: transform 180ms ease, box-shadow 180ms ease, background 180ms ease;
}
.pensamos-button:hover,
.pensamos-button:focus-visible {
transform: translateY(-2px);
box-shadow: 0 18px 32px rgba(13, 28, 49, 0.18);
}
.pensamos-button--ghost,
.pensamos-button--ghost:visited {
background: rgba(255, 255, 255, 0.9);
color: var(--pensamos-deep);
border: 1px solid rgba(23, 50, 77, 0.12);
box-shadow: 0 8px 20px rgba(13, 28, 49, 0.05);
}
.pensamos-text-link,
.pensamos-text-link:visited {
color: var(--pensamos-deep);
font-weight: 700;
text-decoration: none;
letter-spacing: -0.015em;
}
.pensamos-intent-panel {
padding: 26px;
background: linear-gradient(180deg, rgba(255, 255, 255, 0.92) 0%, rgba(245, 250, 255, 0.9) 100%);
}
.pensamos-intent-panel--compact {
display: flex;
flex-direction: column;
overflow: hidden;
}
.pensamos-panel {
padding: 28px;
background: linear-gradient(180deg, #0f2538 0%, #17324d 100%);
color: #f8fbff;
}
.pensamos-panel h2,
.pensamos-panel h3 {
color: #fff;
margin-top: 0;
}
.pensamos-intent-panel h2,
.pensamos-intent-panel h3 {
margin-top: 0;
}
.pensamos-panel ul,
.pensamos-module-content ul,
.pensamos-lesson-content ul,
.pensamos-resource-box ul,
.pensamos-intention-points {
margin: 0;
padding-left: 18px;
}
.pensamos-intention-points {
display: grid;
gap: 10px;
margin-top: 18px;
padding-left: 0;
list-style: none;
transition: opacity 220ms ease, transform 220ms ease;
}
.pensamos-intent-hero--compact .pensamos-intention-points {
gap: 8px;
margin-top: 14px;
}
.pensamos-intent-hero--compact .pensamos-intention-points li {
font-size: 0.95rem;
line-height: 1.45;
}
.pensamos-intention-points li {
position: relative;
padding-left: 20px;
font-weight: 600;
}
.pensamos-intention-points li::before {
content: "";
position: absolute;
left: 0;
top: 0.7em;
width: 8px;
height: 8px;
border-radius: 999px;
background: var(--pensamos-highlight);
transform: translateY(-50%);
}
.pensamos-intent-panel-head p {
margin: 0 0 18px;
line-height: 1.7;
}
.pensamos-intent-panel--compact .pensamos-intent-panel-head p {
margin-bottom: 14px;
font-size: 0.96rem;
line-height: 1.55;
}
.pensamos-intent-options {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 12px;
}
.pensamos-intent-panel--compact .pensamos-intent-options {
grid-template-columns: 1fr;
gap: 10px;
overflow: auto;
padding-right: 4px;
}
.pensamos-intent-option {
position: relative;
display: flex;
align-items: center;
justify-content: space-between;
gap: 10px;
padding: 14px 14px 14px 16px;
border: 1px solid rgba(23, 50, 77, 0.09);
border-radius: 18px;
background: rgba(255, 255, 255, 0.72);
color: var(--pensamos-deep);
font-weight: 700;
text-align: left;
cursor: pointer;
overflow: hidden;
transition: transform 180ms ease, border-color 180ms ease, background 180ms ease, box-shadow 180ms ease;
}
.pensamos-intent-panel--compact .pensamos-intent-option {
padding: 12px 12px 12px 14px;
border-radius: 16px;
}
.pensamos-intent-panel--compact .pensamos-intent-option__label {
font-size: 0.95rem;
}
.pensamos-intent-option:hover,
.pensamos-intent-option:focus-visible {
transform: translateY(-2px);
border-color: rgba(79, 124, 255, 0.26);
box-shadow: 0 14px 26px rgba(79, 124, 255, 0.12);
}
.pensamos-intent-option.is-active {
background: linear-gradient(135deg, rgba(79, 124, 255, 0.12) 0%, rgba(255, 255, 255, 0.96) 100%);
border-color: rgba(79, 124, 255, 0.28);
}
.pensamos-intent-option__label {
position: relative;
z-index: 1;
}
.pensamos-intent-option__pulse {
position: absolute;
right: -18px;
top: 50%;
width: 72px;
height: 72px;
border-radius: 999px;
background: radial-gradient(circle, rgba(79, 124, 255, 0.18), transparent 70%);
transform: translateY(-50%);
transition: transform 220ms ease, opacity 220ms ease;
}
.pensamos-intent-option.is-active .pensamos-intent-option__pulse {
transform: translateY(-50%) scale(1.1);
}
.pensamos-grid-2,
.pensamos-grid-3,
.pensamos-card-grid {
display: grid;
gap: 24px;
}
.pensamos-grid-2 {
grid-template-columns: repeat(auto-fit, minmax(min(320px, 100%), 1fr));
}
.pensamos-grid-3,
.pensamos-card-grid {
grid-template-columns: repeat(auto-fit, minmax(min(260px, 100%), 1fr));
}
.pensamos-feature,
.pensamos-card,
.pensamos-resource-box,
.pensamos-lesson-box,
.pensamos-note {
padding: 28px;
transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
}
.pensamos-card:hover,
.pensamos-feature:hover,
.pensamos-resource-box:hover,
.pensamos-note:hover {
transform: translateY(-4px);
border-color: rgba(31, 42, 68, 0.12);
box-shadow: 0 24px 48px rgba(11, 29, 44, 0.1);
}
.pensamos-section {
margin-top: var(--pensamos-section-gap);
}
.pensamos-section h2 {
margin: 0 0 12px;
font-size: clamp(2rem, 3vw, 2.8rem);
line-height: 1.04;
letter-spacing: -0.04em;
}
.pensamos-section p {
line-height: 1.72;
color: var(--pensamos-ink-soft);
}
.pensamos-kpis {
margin-top: 20px;
}
.pensamos-kpi {
min-width: 150px;
padding: 18px 20px;
border-radius: 20px;
background: rgba(255, 255, 255, 0.68);
border: 1px solid rgba(23, 50, 77, 0.08);
backdrop-filter: blur(6px);
}
.pensamos-kpi strong {
display: block;
font-size: 1.8rem;
line-height: 1;
}
.pensamos-card h3,
.pensamos-feature h3,
.pensamos-resource-box h3,
.pensamos-lesson-box h3 {
margin-top: 0;
}
.pensamos-module-header,
.pensamos-lesson-header {
margin-bottom: 24px;
}
.pensamos-breadcrumbs {
display: inline-flex;
flex-wrap: wrap;
gap: 8px;
margin-bottom: 14px;
font-size: 0.95rem;
}
.pensamos-breadcrumbs a {
color: var(--pensamos-success);
text-decoration: none;
}
.pensamos-module-content,
.pensamos-lesson-content {
background: var(--pensamos-surface);
border: 1px solid var(--pensamos-line);
border-radius: var(--pensamos-radius);
padding: 28px;
box-shadow: var(--pensamos-shadow);
line-height: 1.8;
}
.pensamos-lesson-meta {
display: flex;
flex-wrap: wrap;
gap: 10px;
margin-bottom: 18px;
}
.pensamos-lesson-meta span {
display: inline-flex;
align-items: center;
padding: 8px 12px;
border-radius: 999px;
background: var(--pensamos-soft);
font-weight: 600;
}
.pensamos-empty {
padding: 24px;
border-radius: var(--pensamos-radius);
background: #fff8ef;
border: 1px solid #ffd7ab;
}
.page .entry-header {
display: none;
}
[data-tone="memory"] {
--pensamos-highlight: #4f7cff;
--pensamos-home-bg: radial-gradient(circle at top left, rgba(79, 124, 255, 0.24), transparent 28%), linear-gradient(180deg, #eef4ff 0%, #f8fbff 50%, #ffffff 100%);
}
[data-tone="work"] {
--pensamos-highlight: #0f9d8c;
--pensamos-home-bg: radial-gradient(circle at top left, rgba(15, 157, 140, 0.2), transparent 28%), linear-gradient(180deg, #edfdf9 0%, #f7fcfb 52%, #ffffff 100%);
}
[data-tone="focus"] {
--pensamos-highlight: #8d5cf6;
--pensamos-home-bg: radial-gradient(circle at top left, rgba(141, 92, 246, 0.22), transparent 28%), linear-gradient(180deg, #f3efff 0%, #faf8ff 52%, #ffffff 100%);
}
[data-tone="calm"] {
--pensamos-highlight: #3a95a8;
--pensamos-home-bg: radial-gradient(circle at top left, rgba(58, 149, 168, 0.2), transparent 30%), linear-gradient(180deg, #eefafd 0%, #f9fcfd 52%, #ffffff 100%);
}
[data-tone="coach"] {
--pensamos-highlight: #e05b68;
--pensamos-home-bg: radial-gradient(circle at top left, rgba(224, 91, 104, 0.22), transparent 28%), linear-gradient(180deg, #fff1f2 0%, #fff9f9 52%, #ffffff 100%);
}
[data-tone="languages"] {
--pensamos-highlight: #2b8f6e;
--pensamos-home-bg: radial-gradient(circle at top left, rgba(43, 143, 110, 0.2), transparent 30%), linear-gradient(180deg, #eefbf5 0%, #f8fcfa 52%, #ffffff 100%);
}
[data-tone="exam"] {
--pensamos-highlight: #f08a24;
--pensamos-home-bg: radial-gradient(circle at top left, rgba(240, 138, 36, 0.22), transparent 30%), linear-gradient(180deg, #fff5ea 0%, #fffaf5 52%, #ffffff 100%);
}
[data-tone="ai"] {
--pensamos-highlight: #111827;
--pensamos-home-bg: radial-gradient(circle at top left, rgba(99, 102, 241, 0.22), transparent 26%), linear-gradient(180deg, #eff2ff 0%, #f8f9ff 52%, #ffffff 100%);
}
@keyframes pensamosFloat {
0%,
100% {
transform: translate3d(0, 0, 0) scale(1);
}
50% {
transform: translate3d(0, -16px, 0) scale(1.04);
}
}
@media (prefers-reduced-motion: reduce) {
.pensamos-orb,
.pensamos-card,
.pensamos-feature,
.pensamos-resource-box,
.pensamos-note,
.pensamos-button,
.pensamos-intent-option,
.pensamos-intent-copy h1,
.pensamos-intent-copy .pensamos-intro,
.pensamos-intent-copy .pensamos-kicker,
.pensamos-intention-points,
.pensamos-actions {
animation: none !important;
transition: none !important;
}
}
@media (max-width: 921px) {
.pensamos-intent-hero,
.pensamos-hero {
grid-template-columns: 1fr;
}
.pensamos-home,
.pensamos-course-hub,
.pensamos-module,
.pensamos-lesson {
padding-top: 16px;
}
.pensamos-intent-hero {
padding: 22px;
}
.pensamos-intent-options {
grid-template-columns: 1fr;
}
.pensamos-intent-copy h1 {
max-width: none;
}
}
.pensamos-home,
.pensamos-course-hub,
.pensamos-module,
.pensamos-lesson,
.pensamos-course-guide,
.pensamos-classes-guide,
.pensamarket {
overflow-x: clip;
}
.pensamos-shell {
width: min(var(--pensamos-content-max), calc(100% - clamp(24px, 6vw, 56px)));
}
.pensamos-card,
.pensamos-feature,
.pensamos-resource-box,
.pensamos-lesson-box,
.pensamos-note,
.pensamos-course-block {
min-width: 0;
}
.pensamos-home img,
.pensamos-home svg,
.pensamos-home video,
.pensamos-home iframe,
.pensamos-course-hub img,
.pensamos-course-hub svg,
.pensamos-course-hub video,
.pensamos-course-hub iframe,
.pensamos-course-guide img,
.pensamos-course-guide svg,
.pensamos-course-guide video,
.pensamos-course-guide iframe,
.pensamos-classes-guide img,
.pensamos-classes-guide svg,
.pensamos-classes-guide video,
.pensamos-classes-guide iframe {
max-width: 100%;
height: auto;
}
@media (max-width: 1180px) {
.pensamos-intent-hero,
.pensamos-hero {
grid-template-columns: 1fr;
}
.pensamos-intent-hero--compact {
min-height: auto;
max-height: none;
}
}
@media (max-width: 921px) {
.pensamos-intent-options {
grid-template-columns: 1fr;
}
}
@media (max-width: 768px) {
.pensamos-home,
.pensamos-course-hub,
.pensamos-module,
.pensamos-lesson {
padding-top: 20px;
}
.pensamos-intent-hero,
.pensamos-hero,
.pensamos-card,
.pensamos-feature,
.pensamos-resource-box,
.pensamos-lesson-box,
.pensamos-note,
.pensamos-course-block {
border-radius: 22px;
}
.pensamos-intent-hero,
.pensamos-hero {
padding: 20px;
}
}
@media (max-width: 480px) {
.pensamos-shell {
width: calc(100% - 24px);
}
.pensamos-intent-hero,
.pensamos-hero,
.pensamos-card,
.pensamos-feature,
.pensamos-resource-box,
.pensamos-lesson-box,
.pensamos-note {
padding: 16px;
}
}
.pensamarket {
position: relative;
--pensamarket-azure-ink: #0f2d4d;
--pensamarket-azure-blue: #0078d4;
--pensamarket-azure-cyan: #6dd4ff;
--pensamarket-azure-green: #3ee28f;
--pensamarket-azure-cloud: #d8e3e6;
--pensamarket-azure-fog: #f2f7f6;
background:
radial-gradient(ellipse at 16% 8%, rgba(224, 242, 254, 0.62), transparent 34%),
radial-gradient(ellipse at 82% 18%, rgba(187, 247, 208, 0.34), transparent 30%),
linear-gradient(112deg, rgba(255, 255, 255, 0.84) 0%, rgba(244, 249, 250, 0.74) 38%, rgba(236, 249, 246, 0.58) 68%, rgba(248, 252, 255, 0.98) 100%),
linear-gradient(180deg, #edf6f8 0%, #f7fbfa 42%, #ffffff 78%, #fbfefd 100%);
}
.pensamarket::before {
content: "";
position: absolute;
inset: 0 0 auto;
height: 700px;
background:
linear-gradient(118deg, rgba(255, 255, 255, 0.72) 0%, rgba(255, 255, 255, 0) 34%, rgba(220, 248, 240, 0.26) 58%, rgba(255, 255, 255, 0) 82%),
radial-gradient(ellipse at 12% 12%, rgba(255, 255, 255, 0.44), transparent 28%),
radial-gradient(ellipse at 76% 18%, rgba(109, 212, 255, 0.16), transparent 22%),
radial-gradient(ellipse at 88% 34%, rgba(62, 226, 143, 0.12), transparent 18%);
pointer-events: none;
}
.pensamarket .pensamos-shell {
position: relative;
z-index: 1;
width: 100%;
max-width: none;
padding: 4px clamp(6px, 0.8vw, 10px) 4px;
}
@media (max-width: 1024px) {
.pensamarket .pensamos-shell {
padding-inline: 18px;
}
}
.pensamarket-strip {
margin: 0 auto;
padding: 7px clamp(18px, 3vw, 34px);
text-align: center;
font-size: 0.88rem;
font-weight: 600;
letter-spacing: 0.005em;
line-height: 1.4;
color: #f8fbff;
background:
linear-gradient(135deg, #0d2d4d 0%, #0d4470 38%, #0a68a6 72%, #0c86cf 100%);
border-bottom: 1px solid rgba(8, 19, 42, 0.34);
box-shadow:
inset 0 -1px 0 rgba(255, 255, 255, 0.08),
inset 0 1px 0 rgba(255, 255, 255, 0.09);
position: relative;
overflow: hidden;
}
.pensamarket-strip::before {
content: "";
position: absolute;
inset: -40% -16%;
background:
linear-gradient(90deg, transparent 0%, rgba(225, 244, 245, 0) 8%, rgba(225, 244, 245, 0.5) 17%, rgba(225, 244, 245, 0) 27%, transparent 38%),
linear-gradient(90deg, transparent 22%, rgba(159, 214, 222, 0) 34%, rgba(159, 214, 222, 0.56) 48%, rgba(159, 214, 222, 0) 62%, transparent 74%),
linear-gradient(90deg, transparent 58%, rgba(93, 164, 188, 0) 68%, rgba(93, 164, 188, 0.42) 80%, rgba(93, 164, 188, 0) 90%, transparent 100%);
filter: blur(14px);
opacity: 0.94;
animation: pensamosStripImpulse 10s ease-in-out infinite alternate;
pointer-events: none;
}
.pensamarket-strip::after {
content: "";
position: absolute;
inset: 0;
background:
radial-gradient(circle at 14% 50%, rgba(236, 249, 250, 0.26), transparent 18%),
radial-gradient(circle at 50% 50%, rgba(177, 223, 229, 0.22), transparent 22%),
radial-gradient(circle at 84% 50%, rgba(64, 130, 162, 0.22), transparent 16%);
mix-blend-mode: screen;
opacity: 0.84;
animation: pensamosStripAura 12s ease-in-out infinite;
pointer-events: none;
}
.pensamarket-strip p {
margin: 0;
max-width: 74ch;
margin-inline: auto;
position: relative;
z-index: 1;
text-shadow: 0 1px 2px rgba(5, 14, 32, 0.42);
}
@keyframes pensamosStripImpulse {
0% {
transform: translateX(-16%) translateY(0);
}
100% {
transform: translateX(16%) translateY(0);
}
}
@keyframes pensamosStripAura {
0%,
100% {
transform: translateX(-4%) scaleX(1);
opacity: 0.58;
}
50% {
transform: translateX(4%) scaleX(1.08);
opacity: 0.86;
}
}
@media (max-width: 768px) {
.pensamarket-strip {
padding-inline: 18px;
font-size: 0.82rem;
line-height: 1.45;
}
}
.pensamarket-topbar {
display: grid;
grid-template-columns: auto 1fr auto auto;
justify-content: space-between;
gap: 0 18px;
align-items: center;
padding: 4px 20px;
margin-bottom: 5px;
border: 1px solid rgba(207, 219, 233, 0.9);
border-radius: var(--pensamos-radius-lg);
background: rgba(255, 255, 255, 0.9);
box-shadow: 0 22px 44px rgba(13, 28, 49, 0.06);
backdrop-filter: blur(18px);
position: relative;
z-index: 8;
}
.pensamarket-topbar--compact {
grid-template-columns: auto 1fr auto;
}
.pensamarket-search-chips {
display: flex;
flex-direction: row;
align-items: center;
gap: 14px;
min-width: 0;
}
.pensamarket-cats--topbar {
display: flex;
flex-wrap: nowrap;
flex: 1 1 auto;
gap: 6px;
overflow-x: auto;
scrollbar-width: none;
padding: 4px 0;
margin: -4px 0;
min-width: 0;
}
.pensamarket-cats--topbar::-webkit-scrollbar {
display: none;
}
.pensamarket-cats--topbar .pensamarket-chip {
flex-shrink: 0;
min-height: 36px;
padding: 0 14px;
font-size: 0.88rem;
white-space: nowrap;
}
.pensamarket-cats--topbar .pensamarket-chip:hover,
.pensamarket-cats--topbar .pensamarket-chip:focus-visible {
transform: none;
}
.pensamarket-brand {
display: flex;
align-items: center;
flex: 0 0 auto;
min-width: 0;
}
.pensamarket-brand--logo {
text-decoration: none;
}
.pensamarket-brand__logo {
display: block;
width: auto;
height: clamp(2.2rem, 3.4vw, 2.9rem);
max-width: min(100%, 250px);
object-fit: contain;
}
.pensamarket-brand--logo:is(:hover, :focus-visible) .pensamarket-brand__logo {
filter: drop-shadow(0 10px 24px rgba(20, 61, 98, 0.12));
}
.pensamarket-search {
position: relative;
flex: 0 0 clamp(200px, 28vw, 380px);
width: clamp(200px, 28vw, 380px);
z-index: 12;
}
.pensamarket-search::before {
content: "";
position: absolute;
left: 16px;
top: 50%;
width: 14px;
height: 14px;
border: 2px solid #7f8aa1;
border-radius: 999px;
transform: translateY(-50%);
opacity: 0.85;
}
.pensamarket-search::after {
content: "";
position: absolute;
left: 28px;
top: calc(50% + 6px);
width: 7px;
height: 2px;
background: #7f8aa1;
border-radius: 999px;
transform: rotate(45deg);
transform-origin: left center;
opacity: 0.85;
}
.pensamarket-search input {
width: 100%;
height: 40px;
padding: 0 20px 0 48px;
border-radius: var(--pensamos-radius-pill);
border: 1px solid var(--pensamos-line-strong);
background: linear-gradient(180deg, #ffffff 0%, #fbfdff 100%);
font-size: 1rem;
color: var(--pensamos-ink);
box-shadow: inset 0 1px 2px rgba(17, 24, 39, 0.03);
transition: border-color 180ms ease, box-shadow 180ms ease, background 180ms ease;
}
.pensamarket-search input::placeholder {
color: #7a869d;
}
.pensamarket-search input:focus {
border-color: rgba(79, 124, 255, 0.42);
box-shadow: 0 0 0 4px rgba(79, 124, 255, 0.08);
}
.pensamarket-search__results {
position: absolute;
left: 0;
right: 0;
top: calc(100% + 10px);
display: grid;
gap: 8px;
padding: 12px;
border: 1px solid rgba(199, 213, 234, 0.92);
border-radius: 24px;
background: rgba(255, 255, 255, 0.98);
box-shadow: 0 24px 48px rgba(15, 23, 42, 0.12);
z-index: 120;
backdrop-filter: blur(14px);
opacity: 0;
visibility: hidden;
pointer-events: none;
transform: translateY(-4px);
transition: opacity 0.16s ease, transform 0.16s ease, visibility 0.16s ease;
}
.pensamarket-cats {
position: relative;
z-index: 2;
}
.pensamarket-search__results.is-visible {
opacity: 1;
visibility: visible;
pointer-events: auto;
transform: translateY(0);
}
.pensamarket-search__results[hidden] {
display: none !important;
}
.pensamarket-search__result {
display: grid;
gap: 4px;
padding: 12px 14px;
border-radius: 18px;
border: 1px solid transparent;
color: #223350;
text-decoration: none;
background: #f8fbff;
transition: background 0.18s ease, border-color 0.18s ease, transform 0.18s ease;
}
.pensamarket-search__result:hover,
.pensamarket-search__result:focus-visible {
background: #ffffff;
border-color: rgba(113, 156, 255, 0.4);
transform: translateY(-1px);
}
.pensamarket-search__result strong {
font-size: 0.96rem;
line-height: 1.3;
color: #16233b;
}
.pensamarket-search__result-context,
.pensamarket-search__result-description {
font-size: 0.84rem;
line-height: 1.45;
color: #62748f;
}
.pensamarket-search__result-context {
font-weight: 700;
color: #395782;
}
.pensamarket-search__empty {
margin: 0;
padding: 14px 16px;
font-size: 0.88rem;
line-height: 1.45;
color: #62748f;
text-align: center;
}
.pensamarket-search__result-head {
display: flex;
align-items: center;
justify-content: space-between;
gap: 8px;
}
.pensamarket-search__result-type {
flex: none;
font-size: 0.68rem;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.04em;
color: #395782;
background: rgba(113, 156, 255, 0.14);
padding: 2px 9px;
border-radius: 999px;
}
.pensamarket-search__result-description {
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
}
.pensamarket-search__result.is-active {
background: #ffffff;
border-color: rgba(113, 156, 255, 0.4);
transform: translateY(-1px);
}
.pensamarket-search__result mark {
background: rgba(240, 138, 36, 0.22);
color: inherit;
border-radius: 4px;
padding: 0 1px;
}
.pensamarket-links {
display: flex;
gap: 18px;
align-items: center;
}
.pensamarket-links a {
color: var(--pensamos-ink);
text-decoration: none;
font-weight: 600;
font-size: 1.1rem;
padding: 8px 16px;
white-space: nowrap;
opacity: 0.8;
transition: opacity 180ms ease, color 180ms ease, transform 180ms ease;
}
.pensamarket-links a:hover,
.pensamarket-links a:focus-visible {
color: #111827;
opacity: 1;
transform: translateY(-1px);
}
.pensamarket-auth {
display: flex;
align-items: center;
justify-content: end;
gap: 10px;
}
.pensamarket-auth__link,
.pensamarket-auth__button {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 44px;
padding: 0 18px;
text-decoration: none;
font-weight: 700;
font-size: 0.95rem;
letter-spacing: -0.01em;
white-space: nowrap;
}
.pensamarket-auth__link {
border: 1px solid var(--pensamos-line-strong);
border-radius: var(--pensamos-radius-pill);
background: rgba(255, 255, 255, 0.92);
color: var(--pensamos-ink);
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}
.pensamarket-auth__link--soft {
background: rgba(255, 255, 255, 0.7);
}
.pensamarket-auth__button {
border-radius: var(--pensamos-radius-pill);
background: linear-gradient(135deg, #111827 0%, #243b62 100%);
color: #fff;
box-shadow: 0 12px 24px rgba(17, 24, 39, 0.14);
}
.pensamarket-cats {
display: flex;
flex-wrap: wrap;
gap: 8px;
}
.pensamarket-chip {
display: inline-flex;
align-items: center;
justify-content: center;
flex: 0 1 auto;
width: auto;
max-width: 220px;
border: 1px solid rgba(209, 219, 231, 0.78);
background: rgba(248, 251, 255, 0.8);
min-height: 48px;
padding: 12px 20px;
border-radius: var(--pensamos-radius-pill);
color: #3f4c64;
font-weight: 600;
font-size: 0.98rem;
line-height: 1.2;
text-align: center;
text-decoration: none;
cursor: pointer;
opacity: 1;
transition: background 180ms ease, border-color 180ms ease, color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}
.pensamarket-chip:hover,
.pensamarket-chip:focus-visible {
background: rgba(79, 124, 255, 0.06);
border-color: rgba(79, 124, 255, 0.18);
color: #111827;
transform: translateY(-1px);
}
.pensamarket-chip.is-active {
background: #111827;
border-color: #111827;
color: #fff;
font-weight: 700;
opacity: 1;
box-shadow: 0 10px 22px rgba(17, 24, 39, 0.16);
}
.pensamarket-chip--asesoria-especializada {
border-color: rgba(191, 220, 121, 0.98);
background:
radial-gradient(circle at top right, rgba(205, 236, 132, 0.34), transparent 58%),
linear-gradient(180deg, #fbfff2 0%, #f4ffe7 100%);
color: #1c5f38;
font-weight: 800;
box-shadow: 0 12px 26px rgba(191, 220, 121, 0.18);
}
.pensamarket-chip--asesoria-especializada:hover,
.pensamarket-chip--asesoria-especializada:focus-visible {
background:
radial-gradient(circle at top right, rgba(205, 236, 132, 0.4), transparent 58%),
linear-gradient(180deg, #f8ffe9 0%, #eef9d9 100%);
border-color: rgba(160, 201, 79, 0.98);
color: #134f2f;
box-shadow: 0 16px 30px rgba(191, 220, 121, 0.22);
}
.pensamarket-chip--asesoria-especializada.is-active {
background: linear-gradient(135deg, #1f7a59 0%, #2e9b72 100%);
border-color: #1f7a59;
color: #fff;
box-shadow: 0 16px 30px rgba(31, 122, 89, 0.22);
}
.pensamarket-cats-toggle {
display: none; 
align-items: center;
gap: 10px;
min-height: 44px;
padding: 0 16px;
border: 1px solid rgba(209, 219, 231, 0.78);
border-radius: var(--pensamos-radius-pill);
background: rgba(248, 251, 255, 0.85);
color: #3f4c64;
font-weight: 700;
font-size: 0.9rem;
cursor: pointer;
flex: 0 0 auto;
}
.pensamarket-cats-toggle__bars {
position: relative;
display: block;
width: 18px;
height: 2px;
border-radius: 2px;
background: currentColor;
}
.pensamarket-cats-toggle__bars::before,
.pensamarket-cats-toggle__bars::after {
content: "";
position: absolute;
left: 0;
width: 18px;
height: 2px;
border-radius: 2px;
background: currentColor;
transition: transform 180ms ease, top 180ms ease;
}
.pensamarket-cats-toggle__bars::before {
top: -6px;
}
.pensamarket-cats-toggle__bars::after {
top: 6px;
}
.pensamarket-cats-toggle[aria-expanded="true"] .pensamarket-cats-toggle__bars {
background: transparent;
}
.pensamarket-cats-toggle[aria-expanded="true"] .pensamarket-cats-toggle__bars::before {
top: 0;
transform: rotate(45deg);
}
.pensamarket-cats-toggle[aria-expanded="true"] .pensamarket-cats-toggle__bars::after {
top: 0;
transform: rotate(-45deg);
}
@media (max-width: 1024px) {
.pensamarket-topbar {
grid-template-columns: 1fr;
}
.pensamarket-brand {
justify-content: center;
}
.pensamarket-brand__logo {
height: clamp(2.75rem, 6vw, 3.55rem);
max-width: min(100%, 235px);
}
.pensamarket-links {
flex-wrap: wrap;
}
.pensamarket-auth {
justify-content: flex-start;
}
}
@media (max-width: 768px) {
.pensamarket-topbar,
.pensamarket-cats {
padding-inline: 18px;
}
.pensamarket-cats {
gap: 10px;
}
.pensamarket-search-chips {
flex-direction: row;
flex-wrap: wrap;
align-items: center;
gap: 10px;
}
.pensamarket-search {
flex: 1 1 auto;
width: auto;
}
.pensamarket-cats-toggle {
display: inline-flex;
}
.pensamarket-cats--topbar {
flex: 1 1 100%;
width: 100%;
display: none;
flex-direction: column;
gap: 8px;
overflow: visible;
padding: 4px 0 2px;
margin: 0;
}
.pensamarket-search-chips.is-cats-open .pensamarket-cats--topbar {
display: flex;
}
.pensamarket-cats--topbar .pensamarket-chip {
min-height: 44px;
width: 100%;
max-width: none;
justify-content: flex-start;
}
.pensamarket-brand__logo {
height: 2.35rem;
max-width: min(100%, 210px);
}
}
.pensamarket-brand__logo,
.pensamos-home .pensamarket-brand__logo,
.pensamos-course-hub .pensamarket-brand__logo,
.pensamos-course-guide .pensamarket-brand__logo,
.pensamos-classes-guide .pensamarket-brand__logo {
width: auto;
height: clamp(2.2rem, 3.4vw, 2.9rem);
max-width: min(100%, 250px);
object-fit: contain;
}
@media (max-width: 480px) {
.pensamarket-topbar,
.pensamarket-cats {
padding-inline: 12px;
}
.pensamarket-topbar {
grid-template-columns: 1fr auto;
gap: 12px;
align-items: center;
}
.pensamarket-brand {
grid-column: 1 / -1;
}
.pensamarket-search-chips {
display: contents;
}
.pensamarket-search {
grid-column: 1 / -1;
width: 100%;
}
.pensamarket-cats-toggle {
grid-column: 1;
justify-self: start;
}
.pensamarket-cats--topbar {
grid-column: 1 / -1;
}
.pensamarket-auth {
grid-column: 2;
justify-self: end;
gap: 10px;
}
.pensamarket-cats-toggle,
.pensamarket-auth__link,
.pensamarket-auth__button {
min-height: 36px;
padding-inline: 12px;
font-size: 0.82rem;
}
.pensamarket-cats-toggle {
gap: 8px;
}
.pensamarket-cats-toggle__bars,
.pensamarket-cats-toggle__bars::before,
.pensamarket-cats-toggle__bars::after {
width: 16px;
}
.pensamarket-brand__logo,
.pensamos-home .pensamarket-brand__logo,
.pensamos-course-hub .pensamarket-brand__logo,
.pensamos-course-guide .pensamarket-brand__logo,
.pensamos-classes-guide .pensamarket-brand__logo {
height: clamp(2.4rem, 12vw, 3.1rem);
max-width: min(100%, 220px);
}
}
.pensamarket-page .site-footer {
margin-top: auto;
}
.site-below-footer-wrap[data-section="section-below-footer-builder"] {
margin: 0 !important;
padding: 8px 0 !important;
height: auto !important;
min-height: 0 !important;
background: #ffffff !important;
overflow: hidden;
}
.site-below-footer-wrap[data-section="section-below-footer-builder"] .ast-builder-grid-row-container-inner,
.site-below-footer-wrap[data-section="section-below-footer-builder"] .site-below-footer-inner-wrap,
.site-below-footer-wrap[data-section="section-below-footer-builder"] .ast-builder-grid-row,
.site-below-footer-wrap[data-section="section-below-footer-builder"] .site-footer-section,
.site-below-footer-wrap[data-section="section-below-footer-builder"] .ast-builder-layout-element {
padding: 0 !important;
height: auto !important;
min-height: 0 !important;
margin-bottom: 0 !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
}
.ast-footer-copyright,
.ast-footer-copyright p {
margin: 0;
padding: 0;
line-height: 1.35;
}
.pensamos-cookies {
position: fixed;
left: 50%;
bottom: 18px;
z-index: 9998;
transform: translateX(-50%);
width: min(1020px, calc(100vw - 36px));
}
.pensamos-cookies__inner {
display: flex;
justify-content: space-between;
align-items: center;
gap: 18px;
padding: 18px 24px;
border-radius: 0;
background: rgba(17, 24, 39, 0.94);
color: #fff;
box-shadow: 0 24px 48px rgba(17, 24, 39, 0.26);
flex-wrap: wrap;
}
.pensamos-cookies__copy strong {
display: block;
margin-bottom: 4px;
}
.pensamos-cookies__copy p {
margin: 0;
color: rgba(255, 255, 255, 0.82);
line-height: 1.55;
}
.pensamos-cookies__copy a,
.pensamos-cookies__copy a:visited {
color: #d6c7ff;
font-weight: 700;
}
.pensamos-cookies__actions {
display: flex;
flex-wrap: wrap;
gap: 10px;
margin-left: auto;
}
.pensamos-cookies__primary,
.pensamos-cookies__secondary {
min-height: 44px;
padding: 0 18px;
border-radius: 2px;
font-weight: 700;
cursor: pointer;
}
.pensamos-cookies__primary {
border: 0;
background: #fff;
color: #111827;
}
.pensamos-cookies__secondary {
border: 1px solid rgba(255, 255, 255, 0.38);
background: transparent;
color: #fff;
}
.pensamos-cookies__prefs {
flex: 1 0 100%;
padding-top: 8px;
border-top: 1px solid rgba(255, 255, 255, 0.12);
}
.pensamos-cookies__prefs p {
margin: 0 0 12px;
color: rgba(255, 255, 255, 0.82);
line-height: 1.55;
}
.pensamos-cookies-modal__row {
display: flex;
justify-content: space-between;
align-items: center;
gap: 12px;
padding: 12px 0;
border-top: 1px solid rgba(255, 255, 255, 0.12);
color: #fff;
}
.pensamos-cookies-modal__actions {
display: flex;
justify-content: end;
gap: 10px;
margin-top: 18px;
}
.pensamos-cookies__prefs .pensamos-cookies__secondary {
border-color: rgba(255, 255, 255, 0.28);
}
@media (max-width: 768px) {
.pensamos-cookies {
left: 0;
right: 0;
bottom: 0;
width: 100%;
transform: none;
}
.pensamos-cookies__inner {
flex-direction: column;
align-items: stretch;
gap: 12px;
max-height: min(42dvh, 340px);
padding: 14px 16px calc(14px + env(safe-area-inset-bottom));
border-radius: 16px 16px 0 0;
overflow: auto;
}
.pensamos-cookies__actions {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 8px;
margin-left: 0;
}
.pensamos-cookies-modal__actions {
display: grid;
grid-template-columns: 1fr;
}
.pensamos-cookies__primary,
.pensamos-cookies__secondary {
min-height: 40px;
padding: 0 8px;
font-size: 0.78rem;
}
.pensamos-cookies__copy p {
font-size: 0.9rem;
line-height: 1.42;
}
}
.site-footer {
margin: 0;
padding: 0;
background: #ffffff;
}
@media (max-width: 768px) {
.pensamos-cookies__actions,
.pensamos-cookies-modal__actions {
width: 100%;
}
}
@media (max-width: 480px) {
.pensamos-cookies {
width: 100%;
}
.pensamos-cookies__inner {
padding: 12px 14px calc(12px + env(safe-area-inset-bottom));
}
}
.pensamos-register {
min-height: 100vh;
display: flex;
align-items: center;
background:
radial-gradient(circle at 12% 18%, rgba(121, 179, 255, 0.2), transparent 24%),
radial-gradient(circle at 86% 22%, rgba(166, 226, 190, 0.22), transparent 22%),
radial-gradient(circle at 74% 74%, rgba(255, 213, 122, 0.2), transparent 20%),
linear-gradient(180deg, #eef7ff 0%, #f8fbff 34%, #ffffff 100%);
}
.pensamos-register .pensamos-shell {
position: relative;
z-index: 1;
width: min(100%, 640px);
padding: 32px 20px;
}
.pensamos-register__panel {
display: flex;
justify-content: center;
}
.pensamos-register__card {
display: grid;
gap: 16px;
width: 100%;
padding: 32px 30px;
border: 1px solid rgba(198, 216, 238, 0.94);
border-radius: 34px;
background: rgba(255, 255, 255, 0.94);
box-shadow: 0 20px 42px rgba(17, 24, 39, 0.08);
backdrop-filter: blur(18px);
}
.pensamos-register__card h1 {
margin: 0;
color: #18314f;
font-size: clamp(2rem, 4vw, 2.7rem);
line-height: 1.02;
letter-spacing: -0.04em;
}
.pensamos-register__card p,
.pensamos-register__help,
.pensamos-register__alerts p {
margin: 0;
font-size: 0.98rem;
line-height: 1.6;
color: #52657f;
}
.pensamos-register__card-intro {
max-width: 44ch;
}
.pensamos-register__alerts {
display: grid;
gap: 10px;
padding: 14px 16px;
border-radius: 20px;
border: 1px solid rgba(255, 196, 196, 0.98);
background: rgba(255, 245, 245, 0.95);
}
.pensamos-register__alerts p {
color: #8f3444;
}
.pensamos-register__form {
display: grid;
gap: 14px;
}
.pensamos-register__field {
display: grid;
gap: 6px;
}
.pensamos-register__field span {
font-size: 0.92rem;
font-weight: 700;
color: #18314f;
}
.pensamos-register__field input {
width: 100%;
min-height: 48px;
padding: 0 16px;
border: 1px solid rgba(196, 214, 235, 0.98);
border-radius: 16px;
background: rgba(255, 255, 255, 0.98);
color: #18314f;
font-size: 0.98rem;
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.96);
}
.pensamos-register__field input:focus {
outline: none;
border-color: rgba(95, 146, 221, 0.82);
box-shadow: 0 0 0 4px rgba(121, 179, 255, 0.16);
}
.pensamos-register__form .pensamos-turnstile-wrap {
margin: 2px 0 0;
padding: 14px 16px 12px;
border-radius: 20px;
border: 1px solid rgba(206, 220, 238, 0.94);
background: rgba(247, 251, 255, 0.94);
}
.pensamos-register__form .pensamos-turnstile-widget,
.pensamos-register__form .cf-turnstile {
display: flex;
justify-content: flex-start;
min-height: 70px;
}
.pensamos-register__form iframe {
max-width: 100%;
}
.pensamos-register__help {
font-size: 0.92rem;
}
.pensamos-register__actions {
display: flex;
flex-wrap: wrap;
gap: 12px;
padding-top: 6px;
}
.pensamos-register__back {
margin: 0;
padding: 0;
color: #52657f;
font-size: 0.94rem;
line-height: 1.5;
}
.pensamos-register__back .pensamos-text-link,
.pensamos-register__back .pensamos-text-link:visited {
display: inline-flex;
align-items: center;
gap: 6px;
min-height: 1.5em;
color: #18314f;
font-size: 0.94rem;
font-weight: 800;
line-height: 1.5;
letter-spacing: 0;
text-decoration: none;
}
.pensamos-register__back .pensamos-text-link::before {
content: "\2190";
font-size: 0.94rem;
line-height: 1;
}
.pensamos-register__back .pensamos-text-link:hover,
.pensamos-register__back .pensamos-text-link:focus-visible {
color: #2a5b8d;
text-decoration: underline;
}
@media (max-width: 1100px) {
.pensamos-register .pensamos-shell {
padding-inline: 18px;
}
.pensamos-register__card {
padding: 24px 20px;
border-radius: 28px;
}
.pensamos-register__actions .pensamos-button {
width: 100%;
}
}
.pensamarket-hero-frame {
position: relative;
margin: 0 10%;
border-radius: 36px;
padding: 2px;
background: rgba(154, 203, 215, 0.5);
overflow: hidden;
isolation: isolate;
}
.pensamarket-hero-frame::before {
content: '';
position: absolute;
width: 300%;
height: 300%;
top: 50%;
left: 50%;
translate: -50% -50%;
background: conic-gradient(
from 0deg,
transparent 0%,
transparent 85%,
rgba(100, 215, 255, 0.0) 85%,
rgba(100, 215, 255, 0.7) 91%,
rgba(220, 248, 255, 1.0) 95%,
rgba(100, 215, 255, 0.7) 99%,
transparent 100%
);
animation: pensaHeroFrameRotate 5s linear infinite;
transform-origin: center;
z-index: 0;
pointer-events: none;
}
@keyframes pensaHeroFrameRotate {
to { rotate: 360deg; }
}
.pensamarket-hero {
position: relative;
z-index: 1;
margin: 0;
padding: clamp(8px, 1.2vw, 12px);
border: none;
border-radius: 34px;
background-color: #f7fbfb;
background-image:
radial-gradient(ellipse 92% 72% at 18% 10%, rgba(255, 255, 255, 0.94) 0%, rgba(255, 255, 255, 0.38) 42%, transparent 74%),
radial-gradient(ellipse 78% 56% at 72% 12%, rgba(186, 230, 253, 0.28) 0%, rgba(186, 230, 253, 0.08) 48%, transparent 74%),
radial-gradient(ellipse 68% 64% at 92% 88%, rgba(187, 247, 208, 0.20) 0%, transparent 64%),
linear-gradient(145deg, rgba(255, 255, 255, 0.92) 0%, rgba(239, 248, 249, 0.88) 48%, rgba(244, 250, 247, 0.96) 100%);
background-origin: padding-box;
box-shadow:
inset 0 1px 0 rgba(255, 255, 255, 0.90),
0 26px 62px rgba(10, 31, 52, 0.10),
0 8px 22px rgba(0, 120, 212, 0.06);
overflow: hidden;
isolation: isolate;
}
.pensamarket-hero::before,
.pensamarket-hero::after {
content: "";
position: absolute;
pointer-events: none;
}
.pensamarket-hero::before {
inset: -28% -12%;
background:
radial-gradient(ellipse at 18% 48%, rgba(255, 255, 255, 0.82), transparent 42%),
radial-gradient(ellipse at 72% 44%, rgba(162, 228, 245, 0.24), transparent 38%),
linear-gradient(104deg, transparent 14%, rgba(255, 255, 255, 0.44) 38%, rgba(213, 244, 236, 0.22) 62%, transparent 84%);
filter: blur(8px);
opacity: 0.72;
z-index: 0;
}
.pensamarket-hero::after {
inset: 1px;
border-radius: 32px;
background:
linear-gradient(122deg, rgba(255, 255, 255, 0.34) 0%, rgba(255, 255, 255, 0.16) 34%, rgba(255, 255, 255, 0) 62%),
radial-gradient(ellipse at 78% 20%, rgba(187, 247, 208, 0.16), transparent 32%);
opacity: 1;
z-index: 0;
}
.pensamarket-hero__layout {
}
.pensamarket-hero__slider {
position: relative;
min-width: 0;
z-index: 1;
}
.pensamarket-hero__track {
position: relative;
min-height: clamp(300px, 28vw, 400px);
}
.pensamarket-slide {
position: absolute;
inset: 0;
display: grid;
grid-template-columns: minmax(0, 1.08fr) minmax(0, 0.92fr);
grid-template-rows: 1fr;
border: 1px solid rgba(255, 255, 255, 0.58);
border-radius: 26px;
background:
radial-gradient(ellipse 70% 72% at 18% 52%, rgba(255, 255, 255, 0.90), transparent 58%),
linear-gradient(112deg, rgba(244, 250, 252, 0.96) 0%, rgba(240, 249, 248, 0.86) 44%, rgba(232, 246, 248, 0.72) 100%);
overflow: hidden;
opacity: 0;
transform: translateX(24px);
pointer-events: none;
box-shadow: 0 18px 44px rgba(10, 31, 52, 0.08), 0 4px 12px rgba(10, 31, 52, 0.04);
transition: opacity 700ms cubic-bezier(0.22, 1, 0.36, 1), transform 700ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 360ms ease;
isolation: isolate;
}
.pensamarket-slide::before {
content: "";
position: absolute;
inset: 0;
background:
radial-gradient(ellipse 74% 42% at 30% 0%, rgba(214, 239, 249, 0.24), transparent 70%),
linear-gradient(180deg, rgba(255, 255, 255, 0.42) 0%, rgba(255, 255, 255, 0) 48%);
pointer-events: none;
z-index: 0;
}
.pensamarket-slide.is-active {
opacity: 1;
transform: translateX(0);
pointer-events: auto;
}
.pensamarket-slide.is-active .pensamarket-slide__image {
transform: scale(1.035);
}
.pensamarket-slide[data-tone="memory"] .pensamarket-slide__media {
background: #cdddf5;
}
.pensamarket-slide[data-tone="work"] .pensamarket-slide__media {
background: #b2dfe0;
}
.pensamarket-slide[data-tone="focus"] .pensamarket-slide__media {
background: #d4caf5;
}
.pensamarket-slide[data-tone="coach"] .pensamarket-slide__media {
background: #f5cdd2;
}
.pensamarket-slide[data-tone="languages"] .pensamarket-slide__media {
background: #b2e8d8;
}
.pensamarket-slide[data-tone="calm"] .pensamarket-slide__media {
background: #b8dde8;
}
.pensamarket-slide[data-tone="exam"] .pensamarket-slide__media {
background: #f0dfc0;
}
.pensamarket-slide[data-tone="ai"] .pensamarket-slide__media {
background: #d0d4f0;
}
.pensamarket-slide__media {
position: relative;
grid-column: 2;
grid-row: 1;
background: linear-gradient(180deg, rgba(209, 227, 245, 0.85) 0%, rgba(186, 224, 255, 0.80) 56%, rgba(186, 230, 220, 0.75) 100%);
border-left: 1px solid rgba(191, 219, 254, 0.30);
overflow: hidden;
z-index: 1;
}
.pensamarket-slide__media::before {
content: "";
position: absolute;
inset: 0;
background:
linear-gradient(90deg, rgba(248, 252, 252, 0.22) 0%, rgba(248, 252, 252, 0.06) 18%, transparent 36%),
linear-gradient(180deg, rgba(240, 247, 255, 0.14) 0%, transparent 28%),
linear-gradient(0deg, rgba(15, 30, 50, 0.10) 0%, transparent 32%);
z-index: 1;
pointer-events: none;
}
.pensamarket-slide__image {
position: absolute;
inset: 0;
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: center 34%;
filter: saturate(0.94) contrast(0.99) brightness(1.05);
z-index: 0;
transform: scale(1.015);
transition: transform 800ms cubic-bezier(0.22, 1, 0.36, 1), filter 600ms ease;
}
.pensamarket-slide[data-key="asesoria-especializada"] .pensamarket-slide__image,
.pensamarket-slide[data-key="idiomas"] .pensamarket-slide__image {
object-position: 58% 34%;
}
.pensamarket-slide[data-key="clases"] .pensamarket-slide__image {
object-position: center 18%;
transform: scale(1.03);
filter: saturate(0.92) contrast(0.98) brightness(1.08);
}
.pensamarket-slide[data-key="clases"] .pensamarket-slide__image--primary {
object-position: center 20%;
}
.pensamarket-slide[data-key="clases"] .pensamarket-slide__image--meeting-client {
object-position: center 16%;
}
.pensamarket-slide[data-key="clases"] .pensamarket-slide__image--working {
object-position: center 28%;
}
.pensamarket-slide[data-key="trabajo"] .pensamarket-slide__image,
.pensamarket-slide[data-key="agencia-ia"] .pensamarket-slide__image {
object-position: 52% 42%;
}
.pensamarket-slide[data-key="memoria"] .pensamarket-slide__image,
.pensamarket-slide[data-key="preparación-examenes"] .pensamarket-slide__image {
object-position: 54% 32%;
}
.pensamarket-slide[data-key="musica"] .pensamarket-slide__image {
object-position: 50% 22%;
}
.pensamarket-slide[data-key="relajacion"] .pensamarket-slide__image {
object-position: 50% 30%;
}
.pensamarket-slide__media-copy {
position: absolute;
left: 22px;
right: 22px;
bottom: 22px;
z-index: 3;
display: grid;
gap: 10px;
align-content: end;
max-width: min(360px, 100%);
padding: 18px 18px 16px;
border-radius: 22px;
background:
linear-gradient(180deg, rgba(9, 28, 48, 0.22) 0%, rgba(8, 37, 60, 0.62) 100%);
border: 1px solid rgba(184, 245, 229, 0.22);
box-shadow:
0 18px 34px rgba(8, 15, 29, 0.22),
inset 0 1px 0 rgba(255, 255, 255, 0.14);
backdrop-filter: blur(14px);
}
.pensamarket-slide__media-badge {
display: inline-flex;
align-items: center;
justify-content: center;
width: fit-content;
min-height: 30px;
padding: 0 12px;
border-radius: 999px;
background: rgba(255, 255, 255, 0.14);
border: 1px solid rgba(255, 255, 255, 0.22);
color: #f9fbff;
font-size: 0.74rem;
font-weight: 800;
letter-spacing: 0.08em;
text-transform: uppercase;
}
.pensamarket-slide__media-copy p {
margin: 0;
max-width: 28ch;
font-size: 0.92rem;
line-height: 1.55;
color: rgba(247, 250, 255, 0.94);
text-wrap: balance;
}
.pensamarket-slide[data-key="clases"] {
grid-template-columns: 1fr;
}
.pensamarket-slide[data-key="clases"]::before {
background:
radial-gradient(ellipse 58% 74% at 18% 50%, rgba(255, 255, 255, 0.78) 0%, rgba(255, 255, 255, 0.40) 38%, rgba(255, 255, 255, 0) 72%),
linear-gradient(90deg, rgba(245, 251, 252, 0.92) 0%, rgba(236, 248, 247, 0.66) 25%, rgba(224, 243, 245, 0.20) 54%, rgba(255, 255, 255, 0) 78%),
radial-gradient(circle at 86% 20%, rgba(203, 244, 226, 0.18), transparent 24%);
}
.pensamarket-slide[data-key="clases"] .pensamarket-slide__media {
grid-column: 1;
border-left: 0;
background:
linear-gradient(135deg, rgba(240, 248, 250, 0.92) 0%, rgba(219, 242, 244, 0.60) 46%, rgba(218, 246, 235, 0.44) 100%);
}
.pensamarket-slide[data-key="clases"] .pensamarket-slide__media::before {
display: none;
}
.pensamarket-slide[data-key="clases"] .pensamarket-slide__media-copy {
display: none;
}
.pensamarket-slide[data-key="clases"] .pensamarket-slide__content {
position: absolute;
inset: 0;
grid-column: 1;
z-index: 2;
display: flex;
align-items: center;
justify-content: flex-start;
padding: clamp(24px, 4.2vw, 54px) clamp(28px, 6vw, 86px) clamp(24px, 4.2vw, 54px) clamp(48px, 8vw, 122px);
background:
radial-gradient(ellipse 44% 72% at 22% 50%, rgba(255, 255, 255, 0.34), rgba(255, 255, 255, 0) 76%);
}
.pensamarket-slide[data-key="clases"] .pensamarket-slide__content::before {
content: "";
position: absolute;
left: clamp(24px, 5vw, 74px);
top: 50%;
width: min(48vw, 560px);
height: 76%;
border-radius: 30px;
background:
radial-gradient(ellipse at 28% 50%, rgba(255, 255, 255, 0.86), rgba(255, 255, 255, 0.34) 48%, rgba(255, 255, 255, 0) 76%),
linear-gradient(110deg, rgba(219, 242, 244, 0.30) 0%, rgba(255, 255, 255, 0) 68%);
filter: blur(14px);
transform: translateY(-50%);
pointer-events: none;
z-index: 0;
}
.pensamarket-slide[data-key="clases"] .pensamarket-floating-card {
width: min(468px, 100%);
max-height: clamp(260px, 24vw, 336px);
padding: 22px 24px 24px;
border: 1px solid rgba(255, 255, 255, 0.74);
border-radius: 26px;
background:
linear-gradient(156deg, rgba(255, 255, 255, 0.91) 0%, rgba(250, 253, 253, 0.86) 58%, rgba(240, 249, 247, 0.82) 100%);
align-self: center;
margin-block: 0;
box-shadow:
0 22px 48px rgba(10, 31, 52, 0.16),
0 8px 18px rgba(0, 120, 212, 0.08),
inset 0 1px 0 rgba(255, 255, 255, 0.96);
backdrop-filter: blur(18px);
z-index: 1;
overflow: hidden;
}
.pensamarket-slide[data-key="clases"] .pensamarket-floating-card::before {
height: 4px;
border-radius: 26px 26px 0 0;
background: linear-gradient(90deg, rgba(0, 120, 212, 0.70) 0%, rgba(54, 180, 255, 0.58) 52%, rgba(62, 226, 143, 0.54) 100%);
}
.pensamarket-slide[data-key="clases"] .pensamarket-floating-card::after {
inset: 9px;
border-color: rgba(255, 255, 255, 0.66);
border-radius: 18px;
}
.pensamarket-slide[data-key="clases"] .pensamarket-floating-card h2 {
margin-bottom: 10px;
max-width: none;
font-size: clamp(1.55rem, 1.9vw, 2.1rem);
line-height: 1.06;
}
.pensamarket-slide[data-key="clases"] .pensamarket-floating-card > p:not(.pensamarket-floating-card__microcopy) {
margin-bottom: 10px;
max-width: 30ch;
font-size: 0.95rem;
line-height: 1.52;
}
.pensamarket-slide[data-key="clases"] .pensamarket-floating-card .pensamos-eyebrow {
margin-bottom: 12px;
min-height: 22px;
padding-inline: 10px;
font-size: 0.64rem;
}
.pensamarket-slide[data-key="clases"] .pensamarket-floating-card .pensamos-actions {
margin-top: 12px;
}
.pensamarket-slide[data-key="clases"] .pensamarket-floating-card .pensamos-button:not(.pensamos-button--ghost),
.pensamarket-slide[data-key="clases"] .pensamarket-floating-card .pensamos-button:not(.pensamos-button--ghost):visited {
min-width: 0;
min-height: 36px;
padding-inline: 16px;
font-size: 0.88rem;
}
.pensamarket-slide[data-key="clases"] .pensamarket-floating-card .pensamos-button--ghost,
.pensamarket-slide[data-key="clases"] .pensamarket-floating-card .pensamos-button--ghost:visited,
.pensamarket-slide[data-key="clases"] .pensamarket-floating-card__highlights,
.pensamarket-slide[data-key="clases"] .pensamarket-floating-card__microcopy {
display: none;
}
.pensamarket-hero-frame {
padding: 0;
border-radius: 0;
background: transparent;
box-shadow: none;
}
.pensamarket-hero-frame::before {
display: none;
}
.pensamarket-hero {
border: 0;
border-radius: 0;
padding: 0;
background: transparent;
box-shadow: none;
}
.pensamarket-hero::after,
.pensamarket-slide {
border-radius: 0;
}
.pensamarket-hero::before,
.pensamarket-hero::after {
display: none;
}
.pensamarket-slide {
border: 0;
box-shadow: none;
}
.pensamarket-slide[data-key="clases"] .pensamarket-slide__image {
object-position: center 18%;
transform: scale(1.04);
filter: saturate(0.92) contrast(0.98) brightness(1.08);
}
.pensamarket-slide__content {
position: relative;
z-index: 2;
grid-column: 1;
grid-row: 1;
display: flex;
align-items: center;
justify-content: center;
background:
radial-gradient(ellipse 90% 60% at 0% 50%, rgba(255, 255, 255, 0.60), transparent 70%),
radial-gradient(ellipse 60% 40% at 50% 100%, rgba(219, 234, 254, 0.18), transparent 70%);
padding: 22px 20px 22px 34px;
}
.pensamarket-floating-card {
width: min(520px, 100%);
padding: 26px 30px 22px;
background:
linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(248, 251, 255, 0.97) 60%, rgba(242, 248, 254, 0.96) 100%);
border: 1px solid rgba(191, 219, 254, 0.38);
border-radius: 28px;
box-shadow:
0 2px 4px rgba(10, 31, 52, 0.04),
0 12px 32px rgba(10, 31, 52, 0.10),
0 28px 56px rgba(10, 31, 52, 0.08),
inset 0 1px 0 rgba(255, 255, 255, 0.95);
backdrop-filter: blur(12px);
position: relative;
}
.pensamarket-floating-card::before {
content: "";
position: absolute;
inset: 0 0 auto;
height: 6px;
border-radius: 32px 32px 0 0;
background: linear-gradient(90deg, #0078d4 0%, #36b4ff 54%, #3ee28f 100%);
}
.pensamarket-floating-card::after {
content: "";
position: absolute;
inset: 10px;
border-radius: 20px;
border: 1px solid rgba(255, 255, 255, 0.60);
pointer-events: none;
}
.pensamarket-floating-card h2 {
margin: 0 0 12px;
font-size: clamp(1.9rem, 2.6vw, 2.9rem);
line-height: 0.96;
letter-spacing: -0.06em;
max-width: 13ch;
color: #081827;
text-wrap: balance;
}
.pensamarket-floating-card .pensamos-eyebrow {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 28px;
padding: 0 14px;
margin-bottom: 10px;
font-size: 0.76rem;
font-weight: 800;
letter-spacing: 0.08em;
text-transform: uppercase;
color: var(--pensamarket-azure-blue);
background: rgba(0, 120, 212, 0.08);
border: 1px solid rgba(0, 120, 212, 0.14);
border-radius: 999px;
}
.pensamarket-floating-card > p:not(.pensamarket-floating-card__microcopy) {
margin: 0 0 14px;
max-width: 33ch;
font-size: 1rem;
line-height: 1.65;
color: #30485c;
}
.pensamarket-floating-card__highlights {
display: flex;
flex-wrap: wrap;
gap: 8px;
margin: 0 0 14px;
padding: 0;
list-style: none;
}
.pensamarket-floating-card__highlights li {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 34px;
padding: 0 12px;
border-radius: 999px;
background: linear-gradient(180deg, rgba(252, 254, 254, 0.96) 0%, rgba(240, 249, 247, 0.94) 100%);
border: 1px solid rgba(167, 194, 206, 0.5);
color: #1f557e;
font-size: 0.8rem;
font-weight: 700;
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.86);
}
.pensamarket-floating-card .pensamos-actions {
gap: 14px;
margin-top: 6px;
align-items: stretch;
}
.pensamarket-floating-card .pensamos-button,
.pensamarket-floating-card .pensamos-button:visited {
min-height: 54px;
padding: 0 24px;
font-size: 0.97rem;
box-shadow: 0 16px 30px rgba(13, 28, 49, 0.16);
}
.pensamarket-floating-card .pensamos-button:not(.pensamos-button--ghost),
.pensamarket-floating-card .pensamos-button:not(.pensamos-button--ghost):visited {
background: linear-gradient(135deg, #0078d4 0%, #1188e0 58%, #1aa0f1 100%);
box-shadow: 0 24px 44px rgba(0, 120, 212, 0.3);
min-width: 188px;
font-weight: 800;
letter-spacing: -0.02em;
}
.pensamarket-floating-card .pensamos-button--ghost,
.pensamarket-floating-card .pensamos-button--ghost:visited {
background: rgba(248, 252, 253, 0.9);
border: 1px solid rgba(152, 178, 193, 0.44);
color: var(--pensamarket-azure-ink);
box-shadow: 0 12px 24px rgba(10, 31, 52, 0.08);
}
.pensamarket-floating-card__microcopy {
margin: 16px 0 0 !important;
max-width: 40ch !important;
font-size: 0.84rem !important;
line-height: 1.58 !important;
color: #5b7183 !important;
}
.pensamarket-arrow {
position: absolute;
display: inline-flex;
align-items: center;
justify-content: center;
width: 40px;
height: 40px;
padding: 0;
appearance: none;
-webkit-appearance: none;
border: 1px solid rgba(163, 188, 202, 0.6);
border-radius: 999px;
background: rgba(247, 252, 253, 0.9);
color: var(--pensamarket-azure-ink);
font-size: 0;
line-height: 1;
top: 50%;
bottom: auto;
transform: translateY(calc(-50% - 8px));
box-shadow: 0 10px 24px rgba(10, 31, 52, 0.14);
cursor: pointer;
z-index: 3;
transition: transform 180ms ease, box-shadow 180ms ease, background 180ms ease, color 180ms ease;
}
.pensamarket-arrow:focus {
outline: none;
}
.pensamarket-arrow:hover,
.pensamarket-arrow:focus-visible {
background: rgba(255, 255, 255, 0.98);
color: #081827;
box-shadow: 0 22px 38px rgba(0, 120, 212, 0.18);
}
.pensamarket-arrow:focus:not(:focus-visible) {
background: rgba(247, 252, 253, 0.9);
color: var(--pensamarket-azure-ink);
box-shadow: 0 10px 24px rgba(10, 31, 52, 0.14);
}
.pensamarket-arrow:active {
background: rgba(238, 246, 252, 0.98);
box-shadow: 0 8px 18px rgba(10, 31, 52, 0.12);
transform: translateY(-50%) scale(0.98);
}
.pensamarket-arrow--prev {
left: 16px;
}
.pensamarket-arrow--next {
right: 16px;
}
.pensamarket-arrow__glyph {
display: inline-flex;
align-items: center;
justify-content: center;
width: 100%;
height: 100%;
font-size: 1.4rem;
line-height: 1;
transform: translateY(-2px);
}
.pensamarket-arrow--prev .pensamarket-arrow__glyph {
transform: translate(-1px, -2px);
}
.pensamarket-arrow--next .pensamarket-arrow__glyph {
transform: translate(1px, -2px);
}
@media (max-width: 560px) {
.pensamarket-arrow {
width: 36px;
height: 36px;
}
.pensamarket-arrow--prev {
left: -8px;
}
.pensamarket-arrow--next {
right: -8px;
}
}
.pensamarket-slide__media::after {
content: "Añade tu imagen aquí";
position: absolute;
inset: 0;
display: flex;
align-items: center;
justify-content: center;
font-size: 0.85rem;
font-weight: 700;
letter-spacing: 0.02em;
color: rgba(0, 0, 0, 0.3);
pointer-events: none;
opacity: 1;
transition: opacity 300ms ease;
z-index: 2;
}
.pensamarket-slide__media:has(img.is-loaded)::after,
.pensamarket-slide__media:has(img[src$=".jpg"])::after,
.pensamarket-slide__media:has(img[src$=".webp"])::after,
.pensamarket-slide__media:has(img[src$=".png"])::after {
opacity: 0;
}
.pensamarket-dots {
display: flex;
justify-content: center;
gap: 8px;
padding-top: 24px;
min-height: 28px;
position: relative;
z-index: 4;
}
.pensamarket-dot {
width: 8px;
height: 8px;
border: 0;
border-radius: 999px;
background: #b9c5d4;
cursor: pointer;
transition: transform 180ms ease, background 180ms ease;
}
.pensamarket-dot.is-active {
background: #1f2937;
transform: scale(1.3);
}
@media (max-width: 1100px) {
.pensamarket-slide__content {
padding: 34px 36px 34px 40px;
}
}
@media (max-width: 921px) {
.pensamarket-hero-frame,
.pensamarket-hero {
margin-inline: 0;
}
.pensamarket-hero-frame {
padding: 4px;
}
.pensamarket-slide {
grid-template-columns: 1fr;
grid-template-rows: auto 240px;
}
.pensamarket-slide[data-key="clases"] {
grid-template-rows: minmax(360px, auto);
}
.pensamarket-slide__content {
grid-column: 1;
grid-row: 1;
align-items: flex-start;
justify-content: flex-start;
padding: 30px 24px 26px;
}
.pensamarket-slide__media {
grid-column: 1;
grid-row: 2;
}
.pensamarket-slide[data-key="clases"] .pensamarket-slide__media,
.pensamarket-slide[data-key="clases"] .pensamarket-slide__content {
grid-column: 1;
grid-row: 1;
}
.pensamarket-slide[data-key="clases"] .pensamarket-slide__content {
inset: 0;
align-items: center;
padding: 24px;
}
.pensamarket-slide[data-key="clases"] .pensamarket-slide__content::before {
left: 50%;
width: min(94%, 420px);
height: 84%;
transform: translate(-50%, -50%);
opacity: 0.72;
}
.pensamarket-slide[data-key="clases"] .pensamarket-floating-card {
width: min(360px, 100%);
padding: 22px 20px 24px;
}
.pensamarket-slide__media-copy {
left: 18px;
right: 18px;
bottom: 18px;
max-width: none;
padding: 16px 16px 14px;
}
.pensamarket-floating-card {
width: 100%;
max-width: 100%;
padding: 32px 26px 26px;
}
.pensamarket-arrow {
top: auto;
bottom: 100px;
transform: none;
}
}
@media (max-width: 640px) {
.pensamarket-slide__content {
padding: 22px 18px;
}
.pensamarket-slide[data-key="clases"] {
min-height: 320px;
}
.pensamarket-slide[data-key="clases"] .pensamarket-slide__content {
inset: 0;
align-items: center;
padding: 18px;
}
.pensamarket-floating-card {
width: 100%;
padding: 26px 20px 22px;
}
.pensamarket-slide[data-key="clases"] .pensamarket-floating-card {
width: 100%;
padding: 18px 16px 20px;
}
.pensamarket-floating-card h2 {
font-size: 2rem;
}
.pensamarket-slide[data-key="clases"] .pensamarket-floating-card h2 {
font-size: 1.55rem;
max-width: 10ch;
}
.pensamarket-slide__media-copy p {
font-size: 0.86rem;
max-width: 30ch;
}
.pensamarket-floating-card__highlights {
gap: 8px;
}
.pensamarket-floating-card__highlights li {
font-size: 0.78rem;
}
.pensamarket-arrow {
width: 36px;
height: 36px;
top: 50%;
bottom: auto;
transform: translateY(calc(-50% - 8px));
}
.pensamarket-arrow--prev {
left: -8px;
}
.pensamarket-arrow--next {
right: -8px;
}
}
.pensamarket-slide,
.pensamarket-slide__copy,
.pensamarket-slide__visual {
min-width: 0;
}
.pensamarket-slide[data-key="clases"] .pensamarket-slide__image,
.pensamos-home .pensamarket-slide[data-key="clases"] .pensamarket-slide__image {
object-position: center 22%;
transform: scale(1.01);
}
.pensamarket-slide.is-active[data-key="clases"] .pensamarket-slide__image,
.pensamos-home .pensamarket-slide.is-active[data-key="clases"] .pensamarket-slide__image {
transform: scale(1.01);
}
@media (max-width: 1180px) {
.pensamarket-slide {
position: relative;
min-height: auto;
grid-template-columns: 1fr;
}
.pensamarket-slide:not(.is-active) {
display: none;
}
.pensamarket-hero__track {
min-height: 0;
}
}
@media (max-width: 720px) {
.pensamarket-hero {
margin-inline: 18px;
}
}
@media (max-width: 767px) {
.pensamarket-hero-frame {
display: none !important;
}
}
.pensamarket-routes {
margin: 0 10% var(--pensamos-space-9);
padding-top: clamp(28px, 3vw, 40px);
}
.pensamarket-routes__head {
display: flex;
align-items: baseline;
gap: 16px;
margin-bottom: 20px;
}
.pensamarket-routes__head h2 {
margin: 0;
font-size: clamp(1.55rem, 2vw, 2rem);
line-height: 1.05;
letter-spacing: -0.04em;
color: #111827;
}
.pensamarket-routes__head p {
margin: 7px 0 0;
font-size: 0.875rem;
line-height: 1.5;
color: #6b7d95;
}
.pensamarket-routes .pensamarket-offer-grid {
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 16px;
}
.pensamarket-routes .pensamarket-offer-card.is-featured {
grid-column: auto;
}
.pensamarket-offer-card__icon {
display: inline-flex;
align-items: center;
justify-content: center;
width: 34px;
height: 34px;
border-radius: 10px;
background: color-mix(in srgb, var(--pensamarket-offer-accent) 12%, white);
border: 1px solid color-mix(in srgb, var(--pensamarket-offer-accent) 18%, white);
color: var(--pensamarket-offer-accent);
flex-shrink: 0;
}
.pensamarket-routes {
text-align: left;
}
.pensamarket-routes .pensamarket-routes__head {
justify-content: flex-start;
text-align: left;
flex-direction: column;
align-items: flex-start;
gap: 0;
margin-bottom: clamp(22px, 2.4vw, 30px);
}
.pensamarket-routes .pensamarket-routes__head h2::before {
content: none;
}
.pensamarket-routes .pensamarket-routes__head h2 {
font-size: clamp(1.5rem, 1.9vw, 2rem);
font-weight: 700;
letter-spacing: -0.026em;
color: #091b32;
line-height: 1.1;
white-space: nowrap;
}
.pensamarket-offer-grid--three {
grid-template-columns: repeat(3, minmax(min-content, 400px));
justify-content: space-between;
text-align: left;
}
@media (max-width: 768px) {
.pensamarket-offer-grid--three {
grid-template-columns: 1fr;
}
}
.pensamarket-cats,
.pensamarket-chip,
.pensamarket-offer-card {
min-width: 0;
}
@media (max-width: 1280px) {
.pensamarket-routes {
margin-inline: clamp(18px, 5vw, 56px);
}
}
@media (max-width: 1024px) {
.pensamarket-routes__head h2,
.pensamarket-routes .pensamarket-routes__head h2 {
white-space: normal;
}
}
@media (max-width: 768px) {
.pensamarket-routes {
margin-inline: 18px;
}
.pensamarket-cats {
width: 100%;
max-width: 100%;
padding-inline: 0;
justify-content: flex-start;
}
.pensamarket-chip {
max-width: 100%;
white-space: normal;
overflow-wrap: anywhere;
}
}
.pensamarket-offer-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 16px;
}
.pensamarket-offer-card.is-featured {
grid-column: 1 / -1;
padding: 20px 20px 18px;
gap: 10px;
}
.pensamarket-offer-card {
--pensamarket-offer-accent: var(--pensamarket-azure-blue);
--pensamarket-offer-glow: rgba(0, 120, 212, 0.18);
--pensamarket-offer-soft: #e9f6ff;
--pensamarket-offer-soft-strong: #d7efff;
--pensamarket-offer-pill: #eef9ff;
--pensamarket-offer-pill-border: rgba(154, 209, 245, 0.92);
position: relative;
display: grid;
align-content: start;
gap: 12px;
padding: 20px;
border: 1px solid color-mix(in srgb, var(--pensamarket-offer-pill-border) 62%, rgba(255, 255, 255, 0.92));
border-radius: 22px;
background:
radial-gradient(circle at top right, color-mix(in srgb, var(--pensamarket-offer-glow) 52%, transparent), transparent 50%),
linear-gradient(145deg, rgba(255, 255, 255, 0.80) 0%, color-mix(in srgb, var(--pensamarket-offer-soft) 46%, rgba(255, 255, 255, 0.62)) 58%, rgba(248, 252, 255, 0.70) 100%);
backdrop-filter: blur(10px) saturate(1.18);
-webkit-backdrop-filter: blur(10px) saturate(1.18);
box-shadow:
0 8px 28px rgba(10, 31, 52, 0.07),
0 2px 6px rgba(10, 31, 52, 0.04),
inset 0 1px 0 rgba(255, 255, 255, 0.84);
cursor: pointer;
transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease, background 180ms ease;
overflow: hidden;
}
.pensamarket-offer-card::before {
content: "";
position: absolute;
inset: 0 0 auto;
height: 3px;
background: linear-gradient(90deg, var(--pensamarket-offer-accent) 0%, color-mix(in srgb, var(--pensamarket-offer-accent) 56%, var(--pensamarket-azure-green)) 100%);
opacity: 0.74;
}
.pensamarket-offer-card:hover,
.pensamarket-offer-card:focus-visible {
transform: translateY(-2px);
border-color: color-mix(in srgb, var(--pensamarket-offer-accent) 40%, rgba(255, 255, 255, 0.88));
box-shadow:
0 14px 32px rgba(10, 31, 52, 0.09),
0 3px 8px rgba(10, 31, 52, 0.05),
inset 0 1px 0 rgba(255, 255, 255, 0.90);
}
.pensamarket-offer-card.is-active {
border-color: color-mix(in srgb, var(--pensamarket-offer-accent) 38%, rgba(255, 255, 255, 0.84));
background:
radial-gradient(circle at top right, color-mix(in srgb, var(--pensamarket-offer-glow) 68%, transparent), transparent 52%),
linear-gradient(145deg, rgba(255, 255, 255, 0.88) 0%, color-mix(in srgb, var(--pensamarket-offer-soft) 56%, rgba(255, 255, 255, 0.68)) 60%, rgba(244, 252, 250, 0.76) 100%);
box-shadow:
0 12px 36px color-mix(in srgb, var(--pensamarket-offer-glow) 62%, rgba(10, 31, 52, 0.04)),
inset 0 1px 0 rgba(255, 255, 255, 0.90);
}
.pensamarket-offer-card[data-tone="sand"] {
--pensamarket-offer-accent: #f0a64c;
--pensamarket-offer-glow: rgba(240, 166, 76, 0.14);
--pensamarket-offer-soft: #fff7eb;
--pensamarket-offer-soft-strong: #ffefcf;
--pensamarket-offer-pill: #fff6e8;
--pensamarket-offer-pill-border: rgba(255, 205, 126, 0.94);
}
.pensamarket-offer-card[data-tone="sky"] {
--pensamarket-offer-accent: #0078d4;
--pensamarket-offer-glow: rgba(0, 120, 212, 0.18);
--pensamarket-offer-soft: #e9f6ff;
--pensamarket-offer-soft-strong: #d7efff;
--pensamarket-offer-pill: #eef9ff;
--pensamarket-offer-pill-border: rgba(154, 209, 245, 0.92);
}
.pensamarket-offer-card[data-tone="mint"] {
--pensamarket-offer-accent: #17ba71;
--pensamarket-offer-glow: rgba(62, 226, 143, 0.17);
--pensamarket-offer-soft: #ebfbf4;
--pensamarket-offer-soft-strong: #d8f7e7;
--pensamarket-offer-pill: #effdf6;
--pensamarket-offer-pill-border: rgba(160, 236, 201, 0.94);
}
.pensamarket-offer-card[data-tone="berry"] {
--pensamarket-offer-accent: #c05d8d;
--pensamarket-offer-glow: rgba(255, 140, 171, 0.14);
--pensamarket-offer-soft: #fff1f6;
--pensamarket-offer-soft-strong: #ffe2ec;
--pensamarket-offer-pill: #fff3f7;
--pensamarket-offer-pill-border: rgba(255, 196, 214, 0.95);
}
.pensamarket-offer-card__top {
display: flex;
align-items: center;
justify-content: space-between;
gap: 10px;
}
.pensamarket-offer-card__meta {
display: flex;
align-items: center;
gap: 10px;
min-width: 0;
}
.pensamarket-offer-card__step {
display: inline-flex;
align-items: center;
justify-content: center;
width: 38px;
height: 38px;
border-radius: 14px;
background: var(--pensamarket-offer-accent);
color: #ffffff;
font-size: 1.02rem;
font-weight: 800;
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.22);
flex-shrink: 0;
}
.pensamarket-offer-card__label,
.pensamarket-offer-card__time {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 28px;
padding: 0 10px;
border-radius: 999px;
font-size: 0.72rem;
font-weight: 800;
}
.pensamarket-offer-card__label {
background: var(--pensamarket-offer-pill);
border: 1px solid var(--pensamarket-offer-pill-border);
color: color-mix(in srgb, var(--pensamarket-offer-accent) 74%, #31425f);
}
.pensamarket-offer-card__time {
border: 1px solid var(--pensamarket-offer-pill-border);
background: rgba(255, 255, 255, 0.9);
color: #4e617d;
}
.pensamarket-offer-card h3 {
margin: 0;
font-size: 1.18rem;
line-height: 1.16;
letter-spacing: -0.035em;
color: #1d2940;
}
.pensamarket-offer-card.is-featured h3 {
font-size: 1.34rem;
}
.pensamarket-offer-card h3::after {
content: "";
display: block;
width: 96px;
height: 4px;
margin-top: 10px;
border-radius: 999px;
background: color-mix(in srgb, var(--pensamarket-offer-accent) 58%, white);
}
.pensamarket-offer-card p {
margin: 0;
font-size: 0.94rem;
line-height: 1.56;
color: #516076;
}
.pensamarket-offer-card__note {
padding: 14px 16px;
border: 1px solid color-mix(in srgb, var(--pensamarket-offer-accent) 34%, white);
border-radius: 18px;
background: color-mix(in srgb, var(--pensamarket-offer-soft-strong) 72%, white);
font-size: 0.9rem;
line-height: 1.5;
color: #4b5f7c;
}
.pensamarket-offer-card__cta {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 42px;
padding: 0 16px;
border-radius: 999px;
background: linear-gradient(135deg, #0078d4 0%, #1088df 56%, #1aa0f1 100%);
color: #ffffff;
font-size: 0.94rem;
font-weight: 800;
text-decoration: none;
box-shadow: 0 16px 30px rgba(0, 120, 212, 0.24);
}
.pensamarket-offer-card__cta:hover,
.pensamarket-offer-card__cta:focus-visible {
transform: translateY(-1px);
}
.pensamarket .pensamarket-routes {
width: auto;
padding-inline: 0;
}
.pensamarket-routes {
position: relative;
margin: 0 10% var(--pensamos-space-9);
padding-top: clamp(16px, 1.8vw, 22px);
text-align: left;
z-index: 1;
}
.pensamarket-routes__head {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 0;
max-width: none;
margin: 0 0 clamp(16px, 2vw, 22px);
padding-left: 6px;
text-align: left;
}
.pensamarket-routes__head h2,
.pensamarket-routes .pensamarket-routes__head h2 {
margin: 0;
font-size: clamp(1.5rem, 1.9vw, 2rem);
font-weight: 700;
line-height: 1.1;
letter-spacing: -0.026em;
color: #091b32;
}
.pensamarket-routes__head h2::before,
.pensamarket-routes .pensamarket-routes__head h2::before {
content: none;
}
.pensamarket-routes .pensamarket-offer-grid,
.pensamarket-routes .pensamarket-offer-grid--three {
grid-template-columns: repeat(auto-fit, minmax(min(250px, 100%), 1fr));
gap: clamp(14px, 1.4vw, 18px);
width: 100%;
text-align: left;
}
.pensamarket-routes .pensamarket-offer-card,
.pensamarket-routes .pensamarket-offer-card.is-featured {
display: flex;
flex-direction: column;
grid-column: auto;
gap: 10px;
min-height: 100%;
padding: clamp(16px, 1.45vw, 19px);
border: 1px solid color-mix(in srgb, var(--pensamarket-offer-pill-border) 42%, rgba(255, 255, 255, 0.94));
border-radius: 22px;
background:
radial-gradient(ellipse at 86% 0%, color-mix(in srgb, var(--pensamarket-offer-glow) 38%, transparent), transparent 54%),
linear-gradient(145deg, rgba(255, 255, 255, 0.86) 0%, color-mix(in srgb, var(--pensamarket-offer-soft) 28%, rgba(255, 255, 255, 0.80)) 58%, rgba(248, 252, 255, 0.84) 100%);
backdrop-filter: blur(7px) saturate(1.08);
-webkit-backdrop-filter: blur(7px) saturate(1.08);
box-shadow:
0 10px 28px rgba(10, 31, 52, 0.058),
0 2px 6px rgba(10, 31, 52, 0.032),
inset 0 1px 0 rgba(255, 255, 255, 0.92);
cursor: default;
}
.pensamarket-routes .pensamarket-offer-card::before {
height: 2px;
opacity: 0.55;
}
.pensamarket-routes .pensamarket-offer-card:hover,
.pensamarket-routes .pensamarket-offer-card:focus-visible {
transform: translateY(-2px);
box-shadow:
0 16px 36px rgba(10, 31, 52, 0.082),
0 3px 10px rgba(10, 31, 52, 0.036),
inset 0 1px 0 rgba(255, 255, 255, 0.94);
}
.pensamarket-routes .pensamarket-offer-card__top {
align-items: center;
gap: 9px;
margin-bottom: 0;
}
.pensamarket-routes .pensamarket-offer-card__meta {
gap: 8px;
}
.pensamarket-routes .pensamarket-offer-card__icon {
width: 29px;
height: 29px;
border-radius: 10px;
background: color-mix(in srgb, var(--pensamarket-offer-accent) 10%, rgba(255, 255, 255, 0.9));
border-color: color-mix(in srgb, var(--pensamarket-offer-accent) 18%, rgba(255, 255, 255, 0.88));
}
.pensamarket-routes .pensamarket-offer-card__label,
.pensamarket-routes .pensamarket-offer-card__time {
min-height: 23px;
padding: 0 8px;
font-size: 0.68rem;
line-height: 1;
letter-spacing: 0;
background: rgba(255, 255, 255, 0.72);
}
.pensamarket-routes .pensamarket-offer-card__label {
border-color: color-mix(in srgb, var(--pensamarket-offer-pill-border) 70%, rgba(255, 255, 255, 0.88));
}
.pensamarket-routes .pensamarket-offer-card h3,
.pensamarket-routes .pensamarket-offer-card.is-featured h3 {
margin: 0;
font-size: clamp(1.06rem, 1.18vw, 1.18rem);
font-weight: 700;
line-height: 1.13;
letter-spacing: -0.018em;
color: #0c1d33;
}
.pensamarket-routes .pensamarket-offer-card h3::after {
width: 28px;
height: 2px;
margin-top: 6px;
opacity: 0.64;
}
.pensamarket-routes .pensamarket-offer-card p {
font-size: 0.9rem;
line-height: 1.48;
color: #52657a;
}
.pensamarket-routes .pensamarket-offer-card__note {
padding: 8px 10px;
border-radius: 14px;
background: color-mix(in srgb, var(--pensamarket-offer-soft-strong) 40%, rgba(255, 255, 255, 0.80));
border-color: color-mix(in srgb, var(--pensamarket-offer-accent) 20%, rgba(255, 255, 255, 0.88));
font-size: 0.84rem;
line-height: 1.38;
}
.pensamarket-routes .pensamarket-offer-card__cta,
.pensamarket-routes .pensamarket-offer-card__cta:visited {
align-self: flex-start;
min-height: 32px;
margin-top: auto;
padding: 0 14px;
border: 1.5px solid color-mix(in srgb, var(--pensamarket-offer-accent) 50%, rgba(255, 255, 255, 0.62));
border-radius: 999px;
background: rgba(255, 255, 255, 0.76);
color: color-mix(in srgb, var(--pensamarket-offer-accent) 86%, #0b1f35);
font-size: 0.85rem;
font-weight: 700;
letter-spacing: 0;
box-shadow: 0 1px 4px rgba(10, 31, 52, 0.06);
transition: background 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}
.pensamarket-routes .pensamarket-offer-card__cta:hover,
.pensamarket-routes .pensamarket-offer-card__cta:focus-visible {
transform: translateY(-1px);
background: color-mix(in srgb, var(--pensamarket-offer-accent) 11%, rgba(255, 255, 255, 0.92));
box-shadow: 0 4px 14px color-mix(in srgb, var(--pensamarket-offer-accent) 22%, transparent);
}
@media (max-width: 1024px) {
.pensamarket-routes {
margin-inline: 0;
}
}
@media (max-width: 768px) {
.pensamarket-offer-card {
padding: 16px;
border-radius: 20px;
}
.pensamarket-offer-card.is-featured {
grid-column: auto;
padding: 16px;
}
.pensamarket-offer-card__step {
width: 34px;
height: 34px;
border-radius: 12px;
}
.pensamarket-routes {
padding-top: 24px;
}
.pensamarket-routes__head {
margin-bottom: 16px;
}
.pensamarket-routes__head h2,
.pensamarket-routes .pensamarket-routes__head h2 {
font-size: 1.45rem;
}
.pensamarket-routes .pensamarket-offer-card,
.pensamarket-routes .pensamarket-offer-card.is-featured {
padding: 14px;
border-radius: 18px;
}
}
.pensamos-assistant {
--pensamos-assistant-ink: #172033;
--pensamos-assistant-ink-strong: #111827;
--pensamos-assistant-ink-body: var(--pensamos-ink, #1f2a44);
--pensamos-assistant-ink-link: #1d2b43;
--pensamos-assistant-ink-deep: #16233b;
--pensamos-assistant-muted: #64748b;
--pensamos-assistant-copy-muted: #5d6679;
--pensamos-assistant-surface: var(--pensamos-surface, #ffffff);
--pensamos-assistant-surface-soft: #f6f9fd;
--pensamos-assistant-surface-softer: #eef4ff;
--pensamos-assistant-surface-tint: #f8fbff;
--pensamos-assistant-line: #edf1f6;
--pensamos-assistant-line-card: #dfe6ef;
--pensamos-assistant-line-action: #dde5ef;
--pensamos-assistant-line-control: #cfd8e6;
--pensamos-assistant-line-hover: #c8d5e5;
--pensamos-assistant-line-prompt: #d7e2f0;
--pensamos-assistant-line-suggestion: #d8e3f0;
--pensamos-assistant-primary-start: #111827;
--pensamos-assistant-primary-end: #22385a;
--pensamos-assistant-close-bg: #edf2f8;
--pensamos-assistant-close-bg-hover: #dbe5f0;
--pensamos-assistant-message-bg-start: #fbfdff;
--pensamos-assistant-message-bg-end: #f5f8fc;
--pensamos-assistant-card-bg-end: #fbfcff;
--pensamos-assistant-action-bg-end: #f7f9fc;
--pensamos-assistant-core-mid: #a7d8ff;
--pensamos-assistant-core-end: #6fa3ff;
--pensamos-assistant-highlight-rgb: 79, 124, 255;
--pensamos-assistant-shadow-rgb: 17, 24, 39;
--pensamos-assistant-glow-cyan: #5ae0ff;
--pensamos-assistant-glow-blue: var(--pensamos-highlight, #4f7cff);
--pensamos-assistant-glow-purple: #db83ff;
position: fixed;
right: clamp(16px, 2vw, 28px);
bottom: clamp(18px, 3vh, 36px);
z-index: 9999;
display: flex;
flex-direction: column;
align-items: end;
gap: 12px;
}
.pensamos-course-guide-page .pensamos-assistant,
.page-template-course-hub .pensamos-assistant,
.page-template-templates-course-hub .pensamos-assistant {
right: 16px;
bottom: 24px;
}
.pensamos-assistant__toggle {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 10px;
min-height: 44px;
padding: 0 14px;
border: 1px solid rgba(205, 218, 235, 0.95);
border-radius: 999px;
background: rgba(255, 255, 255, 0.98);
color: var(--pensamos-assistant-ink);
box-shadow: 0 14px 34px rgba(var(--pensamos-assistant-shadow-rgb), 0.14);
cursor: pointer;
opacity: 1;
pointer-events: auto;
transition: transform 180ms ease, box-shadow 180ms ease, opacity 180ms ease, background 180ms ease;
white-space: nowrap;
}
.pensamos-course-guide-page .pensamos-assistant__toggle,
.page-template-course-hub .pensamos-assistant__toggle,
.page-template-templates-course-hub .pensamos-assistant__toggle {
min-height: 40px;
padding: 0 12px;
font-size: 0.88rem;
}
.pensamos-assistant__toggle:hover,
.pensamos-assistant__toggle:focus-visible {
transform: translateY(-1px);
box-shadow: 0 18px 36px rgba(var(--pensamos-assistant-shadow-rgb), 0.18);
background: var(--pensamos-assistant-surface);
}
.pensamos-assistant.is-open .pensamos-assistant__toggle {
opacity: 0;
pointer-events: none;
transform: translateY(8px) scale(0.96);
}
.pensamos-assistant:not(.is-open) .pensamos-assistant__toggle {
opacity: 1;
pointer-events: auto;
}
.pensamos-assistant__toggle-dot {
width: 10px;
height: 10px;
border-radius: 999px;
background: linear-gradient(135deg, var(--pensamos-assistant-glow-cyan) 0%, var(--pensamos-assistant-glow-blue) 52%, var(--pensamos-assistant-glow-purple) 100%);
box-shadow: none;
flex: 0 0 auto;
}
.pensamos-assistant:not(.is-open) .pensamos-assistant__toggle-dot {
animation: pensamosAssistantTogglePulse 1.2s ease-in-out infinite;
}
.pensamos-assistant__toggle-label {
font-size: 0.9rem;
font-weight: 700;
letter-spacing: -0.01em;
}
@keyframes pensamosAssistantTogglePulse {
0%,
100% {
opacity: 0.55;
transform: scale(0.82);
}
50% {
opacity: 1;
transform: scale(1);
}
}
.pensamos-assistant__panel {
width: min(360px, calc(100vw - 28px));
max-height: min(560px, calc(100vh - 104px));
display: flex;
flex-direction: column;
background: rgba(255, 255, 255, 0.96);
border: 1px solid rgba(218, 227, 239, 0.95);
border-radius: 24px;
box-shadow: 0 22px 52px rgba(var(--pensamos-assistant-shadow-rgb), 0.14);
overflow: hidden;
backdrop-filter: blur(18px);
color: var(--pensamos-assistant-ink);
}
.pensamos-assistant__panel[hidden] {
display: none !important;
}
.pensamos-assistant.is-open .pensamos-assistant__panel {
animation: pensamosAssistantPanelIn 220ms cubic-bezier(0.22, 1, 0.36, 1);
transform-origin: bottom right;
}
@keyframes pensamosAssistantPanelIn {
from {
opacity: 0;
transform: translateY(14px) scale(0.96);
}
to {
opacity: 1;
transform: translateY(0) scale(1);
}
}
.pensamos-assistant__header {
display: flex;
justify-content: space-between;
gap: 12px;
padding: 14px 16px 12px;
border-bottom: 1px solid var(--pensamos-assistant-line);
}
.pensamos-assistant__heading {
display: flex;
align-items: center;
gap: 10px;
}
.pensamos-assistant__header strong {
display: block;
font-size: 0.96rem;
letter-spacing: -0.02em;
color: var(--pensamos-assistant-ink-strong);
}
.pensamos-assistant__header p {
margin: 4px 0 0;
color: var(--pensamos-assistant-copy-muted);
font-size: 0.82rem;
line-height: 1.4;
}
.pensamos-assistant__header-icon {
position: relative;
display: inline-flex;
width: 38px;
height: 22px;
align-items: center;
justify-content: center;
overflow: visible;
filter: drop-shadow(0 0 10px rgba(89, 152, 255, 0.28));
}
.pensamos-assistant__header-icon::before {
content: "";
position: absolute;
inset: -12px -14px;
border-radius: 999px;
background:
radial-gradient(circle, rgba(84, 153, 255, 0.28), transparent 58%),
radial-gradient(circle at 75% 40%, rgba(216, 117, 255, 0.18), transparent 46%);
}
.pensamos-assistant__header-loop {
position: absolute;
top: 1px;
width: 18px;
height: 18px;
border: 2.5px solid transparent;
border-radius: 999px;
background:
linear-gradient(var(--pensamos-assistant-surface), var(--pensamos-assistant-surface)) padding-box,
linear-gradient(135deg, var(--pensamos-assistant-glow-cyan) 0%, var(--pensamos-assistant-glow-blue) 48%, var(--pensamos-assistant-glow-purple) 100%) border-box;
box-shadow:
0 0 10px rgba(90, 224, 255, 0.28),
0 0 16px rgba(79, 124, 255, 0.18);
overflow: hidden;
}
.pensamos-assistant__header-loop::after {
content: "";
position: absolute;
inset: -28%;
background: linear-gradient(90deg, transparent 0%, rgba(92, 227, 255, 0) 28%, rgba(92, 227, 255, 0.7) 46%, rgba(255, 255, 255, 1) 50%, rgba(153, 117, 255, 0.74) 56%, transparent 76%);
filter: blur(1px);
opacity: 0;
transform: translateX(-140%) skewX(-18deg);
animation: pensamosAssistantHeaderCharge 2.35s linear infinite;
}
.pensamos-assistant__header-loop--left {
left: 1px;
transform: rotate(-18deg);
}
.pensamos-assistant__header-loop--right {
right: 1px;
transform: rotate(18deg);
}
.pensamos-assistant__header-loop--right::after {
animation-delay: 1.17s;
}
.pensamos-assistant__header-core {
position: absolute;
left: 50%;
top: 50%;
width: 8px;
height: 8px;
border-radius: 999px;
background: radial-gradient(circle, var(--pensamos-assistant-surface) 0%, var(--pensamos-assistant-core-mid) 62%, var(--pensamos-assistant-core-end) 100%);
box-shadow: 0 0 10px rgba(146, 198, 255, 0.52);
transform: translate(-50%, -50%);
animation: pensamosAssistantHeaderCore 2.35s ease-in-out infinite;
}
.pensamos-assistant.is-listening .pensamos-assistant__header-loop::after {
animation-duration: 1.05s;
}
.pensamos-assistant.is-listening .pensamos-assistant__header-core {
animation-duration: 1.05s;
}
@keyframes pensamosAssistantHeaderCharge {
0% {
transform: translateX(-140%) skewX(-18deg);
opacity: 0;
}
10% {
opacity: 0.95;
}
50% {
opacity: 1;
}
100% {
transform: translateX(140%) skewX(-18deg);
opacity: 0;
}
}
@keyframes pensamosAssistantHeaderCore {
0%,
100% {
box-shadow: 0 0 8px rgba(146, 198, 255, 0.34);
opacity: 0.9;
}
50% {
box-shadow:
0 0 10px rgba(146, 198, 255, 0.7),
0 0 22px rgba(103, 163, 255, 0.4);
opacity: 1;
}
}
.pensamos-assistant__close {
display: inline-flex;
align-items: center;
justify-content: center;
width: 32px;
height: 32px;
border: 0;
border-radius: 999px;
background: var(--pensamos-assistant-close-bg);
font-size: 1.1rem;
font-weight: 700;
line-height: 1;
cursor: pointer;
color: var(--pensamos-assistant-ink-strong);
flex: 0 0 auto;
}
.pensamos-assistant__close:hover,
.pensamos-assistant__close:focus-visible {
background: var(--pensamos-assistant-close-bg-hover);
}
.pensamos-assistant__messages {
display: grid;
gap: 10px;
padding: 14px 16px;
overflow: auto;
background: linear-gradient(180deg, var(--pensamos-assistant-message-bg-start) 0%, var(--pensamos-assistant-message-bg-end) 100%);
}
.pensamos-assistant__message {
max-width: 90%;
padding: 10px 12px;
border-radius: 16px;
}
.pensamos-assistant__message p {
margin: 0;
font-size: 0.9rem;
line-height: 1.45;
color: inherit;
}
.pensamos-assistant__message.is-bot {
max-width: 100%;
background: linear-gradient(180deg, var(--pensamos-assistant-surface) 0%, var(--pensamos-assistant-card-bg-end) 100%);
border: 1px solid var(--pensamos-assistant-line-card);
color: var(--pensamos-assistant-ink-body);
box-shadow: 0 10px 20px rgba(var(--pensamos-assistant-shadow-rgb), 0.04);
}
.pensamos-assistant__message.is-user {
margin-left: auto;
background: linear-gradient(135deg, var(--pensamos-assistant-primary-start) 0%, var(--pensamos-assistant-primary-end) 100%);
color: var(--pensamos-assistant-surface);
}
.pensamos-assistant__message--typing {
width: fit-content;
}
.pensamos-assistant__typing {
display: inline-flex;
gap: 5px;
align-items: center;
padding: 2px 0;
}
.pensamos-assistant__typing span {
width: 7px;
height: 7px;
border-radius: 50%;
background: var(--pensamos-assistant-ink-body, #5f6b84);
opacity: 0.45;
animation: pensamosAssistantTyping 1s ease-in-out infinite;
}
.pensamos-assistant__typing span:nth-child(2) {
animation-delay: 0.15s;
}
.pensamos-assistant__typing span:nth-child(3) {
animation-delay: 0.3s;
}
@keyframes pensamosAssistantTyping {
0%,
60%,
100% {
transform: translateY(0);
opacity: 0.45;
}
30% {
transform: translateY(-4px);
opacity: 1;
}
}
@media (prefers-reduced-motion: reduce) {
.pensamos-assistant.is-open .pensamos-assistant__panel,
.pensamos-assistant__typing span {
animation: none;
}
}
.pensamos-assistant__actions {
display: grid;
gap: 8px;
margin-top: 12px;
}
.pensamos-assistant__action {
display: block;
width: 100%;
appearance: none;
padding: 11px 13px;
border: 1px solid var(--pensamos-assistant-line-action);
border-radius: 14px;
background: linear-gradient(180deg, var(--pensamos-assistant-surface) 0%, var(--pensamos-assistant-action-bg-end) 100%);
color: var(--pensamos-assistant-ink-link);
font-weight: 600;
font-family: inherit;
text-decoration: none;
font-size: 0.88rem;
line-height: 1.4;
text-align: left;
box-shadow: 0 1px 0 rgba(255, 255, 255, 0.9);
cursor: pointer;
transition: background 0.18s ease, border-color 0.18s ease, transform 0.18s ease, color 0.18s ease;
}
.pensamos-assistant__action--secondary {
width: auto;
justify-self: start;
padding: 7px 10px;
border-radius: 999px;
background: var(--pensamos-assistant-surface-softer);
color: var(--pensamos-assistant-ink);
font-size: 0.8rem;
line-height: 1.2;
}
.pensamos-assistant__action:hover,
.pensamos-assistant__action:focus-visible {
background: var(--pensamos-assistant-surface);
border-color: var(--pensamos-assistant-line-hover);
color: var(--pensamos-assistant-ink-strong);
transform: translateY(-1px);
}
.pensamos-assistant__prompts {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 8px;
padding: 0 16px 12px;
background: var(--pensamos-assistant-surface-soft);
}
.pensamos-assistant__prompts[hidden] {
display: none !important;
}
.pensamos-assistant__prompt {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
border: 1px solid var(--pensamos-assistant-line-prompt);
border-radius: 16px;
background: var(--pensamos-assistant-surface);
min-height: 40px;
padding: 10px 12px;
font-weight: 600;
font-size: 0.84rem;
line-height: 1.3;
text-align: center;
color: var(--pensamos-assistant-ink);
cursor: pointer;
box-shadow: 0 6px 14px rgba(var(--pensamos-assistant-shadow-rgb), 0.03);
}
.pensamos-assistant__prompt:hover,
.pensamos-assistant__prompt:focus-visible {
background: var(--pensamos-assistant-surface-softer);
color: var(--pensamos-assistant-ink-strong);
}
.pensamos-assistant__form {
display: grid;
grid-template-columns: 1fr auto;
gap: 8px;
padding: 12px 16px 16px;
border-top: 1px solid var(--pensamos-assistant-line);
background: var(--pensamos-assistant-surface);
}
.pensamos-assistant__form input {
height: 42px;
border-radius: 14px;
border: 1px solid var(--pensamos-assistant-line-control);
padding: 0 12px;
background: var(--pensamos-assistant-surface);
color: var(--pensamos-assistant-ink);
font-size: 0.92rem;
}
.pensamos-assistant__form input::placeholder {
color: var(--pensamos-assistant-muted);
}
.pensamos-assistant__form button {
min-width: 84px;
height: 42px;
border: 0;
border-radius: 14px;
background: linear-gradient(135deg, var(--pensamos-assistant-primary-start) 0%, var(--pensamos-assistant-primary-end) 100%);
color: var(--pensamos-assistant-surface);
font-weight: 700;
font-size: 0.9rem;
cursor: pointer;
}
.pensamos-assistant__suggestions {
display: grid;
gap: 8px;
padding: 0 16px 14px;
border-top: 1px solid var(--pensamos-assistant-line);
background: var(--pensamos-assistant-surface);
}
.pensamos-assistant__suggestions[hidden] {
display: none !important;
}
.pensamos-assistant__suggestion {
display: grid;
gap: 3px;
width: 100%;
padding: 10px 12px;
border: 1px solid var(--pensamos-assistant-line-suggestion);
border-radius: 16px;
background: var(--pensamos-assistant-surface-tint);
color: var(--pensamos-assistant-ink);
text-align: left;
cursor: pointer;
transition: background 0.18s ease, border-color 0.18s ease, transform 0.18s ease;
}
.pensamos-assistant__suggestion:hover,
.pensamos-assistant__suggestion:focus-visible {
background: var(--pensamos-assistant-surface);
border-color: rgba(var(--pensamos-assistant-highlight-rgb), 0.36);
transform: translateY(-1px);
}
.pensamos-assistant__suggestion strong {
font-size: 0.9rem;
line-height: 1.35;
color: var(--pensamos-assistant-ink-deep);
}
.pensamos-assistant__suggestion span {
font-size: 0.78rem;
line-height: 1.35;
color: var(--pensamos-assistant-muted);
}
.pensamos-assistant__panel {
min-width: 0;
}
@media (max-width: 720px) {
.pensamos-assistant__prompts,
.pensamos-assistant__form {
grid-template-columns: 1fr;
}
.pensamos-assistant__form button {
width: 100%;
}
}
@media (max-width: 520px) {
.pensamos-assistant {
right: 10px;
left: 10px;
bottom: 64px;
}
.pensamos-assistant__header,
.pensamos-assistant__messages,
.pensamos-assistant__prompts,
.pensamos-assistant__form,
.pensamos-assistant__suggestions {
padding-inline: 12px;
}
}
@media (max-width: 640px) {
.pensamos-assistant {
right: 14px;
left: 14px;
bottom: 14px;
align-items: stretch;
}
.pensamos-assistant:not(.is-open) {
left: auto;
}
.pensamos-assistant__toggle {
align-self: end;
width: 44px;
min-width: 44px;
padding: 0;
}
.pensamos-assistant__toggle-label {
position: absolute;
width: 1px;
height: 1px;
margin: -1px;
padding: 0;
overflow: hidden;
clip: rect(0 0 0 0);
clip-path: inset(50%);
white-space: nowrap;
}
.pensamos-assistant__panel {
width: 100%;
}
}
@media (max-width: 767px) {
.pensamos-assistant {
display: none !important;
}
}
.pensamos-course-walkthrough__test[hidden],
.pensamos-course-walkthrough__modal[hidden],
.pensamos-course-walkthrough__test-modal[hidden] {
display: none;
}
.pensamos-popup[hidden] {
display: none;
}
.pensamos-course-walkthrough__test {
gap: 16px;
}
.pensamos-popup {
position: fixed;
inset: 0;
z-index: 10010;
display: flex;
align-items: center;
justify-content: center;
padding: 18px;
overflow: hidden;
overscroll-behavior: contain;
}
.pensamos-course-walkthrough__modal,
.pensamos-course-walkthrough__test-modal {
position: fixed;
inset: 0;
z-index: 10010;
display: flex;
align-items: center;
justify-content: center;
padding: 18px;
overflow: hidden;
overscroll-behavior: contain;
}
.pensamos-popup__backdrop,
.pensamos-course-walkthrough__modal-backdrop {
position: absolute;
inset: 0;
background: rgba(13, 28, 49, 0.58);
backdrop-filter: blur(10px);
}
.pensamos-popup__dialog,
.pensamos-course-walkthrough__modal-dialog,
.pensamos-course-walkthrough__test-modal-dialog {
position: relative;
z-index: 1;
height: min(94dvh, 920px);
max-height: min(94dvh, 920px);
display: flex;
flex-direction: column;
min-height: 0;
overflow: hidden;
padding: 22px;
border-radius: 30px;
border: 1px solid rgba(214, 224, 236, 0.96);
background: #ffffff;
box-shadow:
0 12px 32px rgba(13, 28, 49, 0.12),
0 34px 86px rgba(13, 28, 49, 0.22);
animation: pensamosCourseModalFade 140ms ease-out;
}
.pensamos-popup__dialog,
.pensamos-popup__dialog--wide,
.pensamos-course-walkthrough__modal-dialog {
width: min(1520px, calc(100vw - 36px));
}
.pensamos-popup__dialog--narrow,
.pensamos-course-walkthrough__test-modal-dialog {
width: min(1200px, calc(100vw - 36px));
}
.pensamos-auth-modal__dialog {
width: min(640px, calc(100vw - 36px));
height: auto;
max-height: min(94dvh, 820px);
padding: 32px 30px;
overflow-y: auto;
}
.pensamos-auth-modal__panel {
display: grid;
gap: 16px;
}
.pensamos-auth-modal__panel[hidden] {
display: none;
}
.pensamos-auth-modal__dialog h2 {
margin: 0;
color: #18314f;
font-size: clamp(1.72rem, 3vw, 2.16rem);
font-weight: 700;
line-height: 1.08;
letter-spacing: -0.025em;
}
.pensamos-auth-modal__intro {
margin: 0;
max-width: 44ch;
color: #52657f;
font-size: 0.98rem;
line-height: 1.6;
}
.pensamos-auth-modal__login-form {
display: grid;
gap: 14px;
margin: 0;
padding: 0;
border: 0;
background: transparent;
box-shadow: none;
}
.pensamos-auth-modal__login-field,
.pensamos-auth-modal__remember,
.pensamos-auth-modal__submit {
margin: 0;
}
.pensamos-auth-modal__login-field {
display: grid;
gap: 6px;
}
.pensamos-auth-modal__login-field label {
color: #18314f;
font-size: 0.92rem;
font-weight: 700;
line-height: 1.35;
}
.pensamos-auth-modal input[type="text"],
.pensamos-auth-modal input[type="password"],
.pensamos-auth-modal input[type="email"] {
width: 100%;
min-height: 48px;
padding: 0 16px;
border: 1px solid rgba(196, 214, 235, 0.98);
border-radius: 14px;
background: #fff;
color: #18314f;
font-size: 1rem;
line-height: 1.4;
box-shadow: none;
}
.pensamos-auth-modal input[type="text"]:focus,
.pensamos-auth-modal input[type="password"]:focus,
.pensamos-auth-modal input[type="email"]:focus {
outline: none;
border-color: rgba(95, 146, 221, 0.82);
box-shadow: 0 0 0 4px rgba(121, 179, 255, 0.16);
}
.pensamos-auth-modal__remember label {
display: inline-flex;
align-items: center;
gap: 8px;
color: #52657f;
font-size: 0.94rem;
font-weight: 700;
line-height: 1.35;
}
.pensamos-auth-modal__remember input[type="checkbox"] {
width: 18px;
height: 18px;
margin: 0;
border: 1px solid rgba(196, 214, 235, 0.98);
border-radius: 5px;
}
.pensamos-auth-modal__submit .button,
.pensamos-auth-modal__submit .button-primary,
.pensamos-auth-modal__submit input[type="submit"] {
display: inline-flex;
align-items: center;
justify-content: center;
width: auto;
min-height: 54px;
padding: 0 26px;
border: 0;
border-radius: 999px;
background: linear-gradient(135deg, #111827 0%, #243b62 100%);
color: #fff;
font-size: 0.97rem;
font-weight: 800;
line-height: 1;
text-decoration: none;
box-shadow: 0 14px 28px rgba(13, 28, 49, 0.16);
cursor: pointer;
}
.pensamos-auth-modal__submit .button:hover,
.pensamos-auth-modal__submit .button:focus-visible,
.pensamos-auth-modal__submit input[type="submit"]:hover,
.pensamos-auth-modal__submit input[type="submit"]:focus-visible {
transform: translateY(-2px);
box-shadow: 0 18px 32px rgba(13, 28, 49, 0.18);
}
.pensamos-auth-modal__footer {
display: grid;
grid-template-columns: minmax(0, 1fr) auto;
align-items: center;
gap: 12px;
}
.pensamos-auth-modal__footer .pensamos-text-link {
color: #18314f;
font-size: 0.94rem;
font-weight: 800;
line-height: 1.5;
text-decoration: none;
}
.pensamos-auth-modal__footer .pensamos-text-link:hover,
.pensamos-auth-modal__footer .pensamos-text-link:focus-visible {
color: #2a5b8d;
text-decoration: underline;
}
.pensamos-auth-modal__secondary {
min-height: 54px;
}
.pensamos-course-walkthrough__modal-dialog::after {
content: none;
}
.pensamos-popup__close,
.pensamos-course-walkthrough__modal-close {
position: absolute;
top: 24px;
right: 24px;
display: inline-flex;
align-items: center;
justify-content: center;
width: 46px;
height: 46px;
border: 1px solid rgba(214, 224, 236, 0.98);
border-radius: 16px;
background: #ffffff;
color: #516073;
font-size: 1.4rem;
line-height: 1;
cursor: pointer;
z-index: 2;
box-shadow: none;
transition: border-color 180ms ease, background 180ms ease, color 180ms ease;
}
.pensamos-popup__close:hover,
.pensamos-popup__close:focus-visible,
.pensamos-course-walkthrough__modal-close:hover,
.pensamos-course-walkthrough__modal-close:focus-visible {
border-color: rgba(79, 124, 255, 0.2);
background: #ffffff;
color: #20314f;
}
.pensamos-course-walkthrough__modal-head,
.pensamos-course-walkthrough__modal-body,
.pensamos-course-walkthrough__modal-actions,
.pensamos-course-walkthrough__test-modal-head,
.pensamos-course-walkthrough__test-modal-body,
.pensamos-popup__head,
.pensamos-popup__body,
.pensamos-popup__actions {
position: relative;
z-index: 1;
display: grid;
gap: 14px;
}
.pensamos-popup__head,
.pensamos-course-walkthrough__modal-head,
.pensamos-course-walkthrough__test-modal-head {
flex: 0 0 auto;
padding: 18px 96px 18px 18px;
border-radius: 24px;
border: 1px solid rgba(214, 224, 236, 0.96);
background: #ffffff;
box-shadow: 0 14px 28px rgba(13, 28, 49, 0.08);
}
.pensamos-popup__head,
.pensamos-course-walkthrough__modal-head {
position: relative;
overflow: hidden;
}
.pensamos-course-walkthrough__modal-head::before {
content: none;
}
.pensamos-popup__eyebrow,
.pensamos-course-walkthrough__modal-counter {
display: inline-flex;
align-items: center;
justify-content: center;
width: fit-content;
min-height: 34px;
padding: 0 14px;
border-radius: 999px;
border: 1px solid rgba(252, 200, 104, 0.96);
background: #fff5d9;
color: #785400;
font-size: 0.78rem;
font-weight: 900;
letter-spacing: 0.06em;
box-shadow: none;
}
.pensamos-popup__head h3,
.pensamos-course-walkthrough__modal-head h3 {
margin: 0;
font-size: clamp(1.38rem, 2.2vw, 1.92rem);
line-height: 1.02;
letter-spacing: -0.045em;
color: #20314f;
}
.pensamos-popup__head p,
.pensamos-course-walkthrough__modal-head p {
margin: 0;
max-width: 70ch;
font-size: 1rem;
line-height: 1.55;
color: #607088;
font-weight: 700;
}
.pensamos-course-walkthrough__test-modal-head h3 {
margin: 0;
font-size: clamp(1.32rem, 2.05vw, 1.8rem);
line-height: 1.08;
letter-spacing: -0.04em;
color: #20314f;
}
.pensamos-course-walkthrough__test-modal-head p {
margin: 0;
font-size: 0.96rem;
line-height: 1.55;
color: #607088;
font-weight: 700;
}
.pensamos-popup__body,
.pensamos-course-walkthrough__modal-body,
.pensamos-course-walkthrough__test-modal-body {
flex: 1 1 auto;
min-height: 0;
margin-top: 18px;
padding-right: 10px;
padding-bottom: 8px;
overflow-y: auto;
overscroll-behavior: contain;
-webkit-overflow-scrolling: touch;
}
.pensamos-popup__body {
flex: 1 1 auto;
}
.pensamos-course-walkthrough__modal-body {
grid-template-columns: repeat(2, minmax(0, 1fr));
align-items: start;
gap: 16px;
}
.pensamos-course-walkthrough__test-modal-body > .pensamos-course-walkthrough__test {
padding: 0;
border: 0;
border-radius: 0;
background: transparent;
box-shadow: none;
}
.pensamos-popup__actions,
.pensamos-course-walkthrough__modal-actions {
flex: 0 0 auto;
grid-template-columns: minmax(0, 1fr) auto;
align-items: center;
gap: 14px;
margin-top: 18px;
padding: 16px;
border: 1px solid rgba(220, 232, 189, 0.96);
border-radius: 22px;
background: rgba(255, 255, 255, 0.96);
box-shadow: 0 12px 24px rgba(13, 28, 49, 0.06);
}
.pensamos-course-walkthrough__modal-section {
position: relative;
display: grid;
gap: 10px;
align-content: start;
padding: 20px 18px 18px 72px;
border-radius: 24px;
border: 1px solid rgba(221, 232, 240, 0.96);
background: #ffffff;
box-shadow: 0 8px 18px rgba(13, 28, 49, 0.05);
}
.pensamos-course-walkthrough__modal-body > .pensamos-course-walkthrough__modal-section:first-child,
.pensamos-course-walkthrough__modal-body > .pensamos-course-walkthrough__modal-section.is-note {
grid-column: 1 / -1;
}
.pensamos-course-walkthrough__modal-section::before {
position: absolute;
left: 18px;
top: 18px;
display: inline-flex;
align-items: center;
justify-content: center;
width: 38px;
height: 38px;
border-radius: 14px;
font-size: 0.84rem;
font-weight: 900;
letter-spacing: 0.03em;
color: #ffffff;
}
.pensamos-course-walkthrough__modal-section:nth-child(1) {
border-color: #aee0ff;
background: #ffffff;
box-shadow: 0 8px 18px rgba(13, 28, 49, 0.05);
}
.pensamos-course-walkthrough__modal-section:nth-child(1)::before {
content: "01";
background: linear-gradient(180deg, #6cd6ff 0%, #3dbaf3 100%);
box-shadow: none;
}
.pensamos-course-walkthrough__modal-section:nth-child(2) {
border-color: #cce97a;
background: #ffffff;
box-shadow: 0 8px 18px rgba(13, 28, 49, 0.05);
}
.pensamos-course-walkthrough__modal-section:nth-child(2)::before {
content: "02";
background: linear-gradient(180deg, #7be51a 0%, #58cc02 100%);
box-shadow: none;
}
.pensamos-course-walkthrough__modal-section:nth-child(3) {
border-color: #ffd86d;
background: #ffffff;
box-shadow: 0 8px 18px rgba(13, 28, 49, 0.05);
}
.pensamos-course-walkthrough__modal-section:nth-child(3)::before {
content: "03";
background: linear-gradient(180deg, #ffd54f 0%, #ffbf2f 100%);
box-shadow: none;
}
.pensamos-course-walkthrough__modal-section.is-note {
border-color: #ffc2d1;
background: #ffffff;
box-shadow: 0 8px 18px rgba(13, 28, 49, 0.05);
}
.pensamos-course-walkthrough__modal-section.is-note::before {
content: "!";
background: linear-gradient(180deg, #ff8cab 0%, #ff6b95 100%);
box-shadow: none;
}
.pensamos-course-walkthrough__modal-section h4 {
margin: 0;
font-size: 0.82rem;
font-weight: 900;
line-height: 1.1;
letter-spacing: 0.08em;
text-transform: uppercase;
color: #22344d;
}
.pensamos-course-walkthrough__modal-section p,
.pensamos-course-walkthrough__modal-section li {
margin: 0;
font-size: 0.96rem;
line-height: 1.6;
color: #35475e;
}
.pensamos-course-walkthrough__modal-section ul {
margin: 0;
padding: 0;
list-style: none;
display: grid;
gap: 10px;
}
.pensamos-course-walkthrough__modal-section li {
position: relative;
padding-left: 18px;
}
.pensamos-course-walkthrough__modal-section li::before {
content: "";
position: absolute;
left: 0;
top: 0.58em;
width: 8px;
height: 8px;
border-radius: 999px;
background: #58cc02;
box-shadow: 0 0 0 3px rgba(88, 204, 2, 0.16);
}
.pensamos-course-walkthrough__modal-nav {
display: flex;
flex-wrap: wrap;
justify-content: flex-end;
gap: 12px;
}
.pensamos-course-walkthrough__modal-actions .pensamos-text-link,
.pensamos-course-walkthrough__modal-actions .pensamos-text-link:visited {
display: inline-flex;
align-items: center;
justify-content: center;
justify-self: start;
width: auto;
min-height: 48px;
padding: 0 16px;
border: 1px solid #8ec9ef;
border-radius: 16px;
background: #eef8ff;
color: #0d5577;
box-shadow: none;
transition: border-color 180ms ease, background 180ms ease, color 180ms ease;
}
.pensamos-course-walkthrough__modal-actions .pensamos-text-link:hover,
.pensamos-course-walkthrough__modal-actions .pensamos-text-link:focus-visible {
border-color: #73b8e5;
background: #e5f4ff;
color: #0a4d6d;
}
.pensamos-course-walkthrough__modal .pensamos-course-button,
.pensamos-course-walkthrough__modal .pensamos-course-button:visited {
min-height: 52px;
padding: 0 18px;
border-radius: 16px;
border: 3px solid transparent;
font-size: 0.95rem;
box-shadow: none;
transition: border-color 180ms ease, background 180ms ease, color 180ms ease;
}
.pensamos-course-walkthrough__modal .pensamos-course-button:not(.pensamos-course-button--ghost),
.pensamos-course-walkthrough__modal .pensamos-course-button:not(.pensamos-course-button--ghost):visited {
background: #f4ffe7;
border-color: rgba(210, 231, 160, 0.98);
color: #117a59;
box-shadow: none;
}
.pensamos-course-walkthrough__modal .pensamos-course-button:not(.pensamos-course-button--ghost):hover,
.pensamos-course-walkthrough__modal .pensamos-course-button:not(.pensamos-course-button--ghost):focus-visible {
background: #eef9d9;
border-color: rgba(191, 220, 121, 0.98);
color: #0f6b4d;
}
.pensamos-course-walkthrough__modal .pensamos-course-button--ghost,
.pensamos-course-walkthrough__modal .pensamos-course-button--ghost:visited {
background: #ffffff;
border-color: #d2e7a0;
color: #527505;
box-shadow: none;
}
.pensamos-course-walkthrough__modal .pensamos-course-button--ghost:hover,
.pensamos-course-walkthrough__modal .pensamos-course-button--ghost:focus-visible {
background: #f7fce9;
border-color: #bfdc79;
color: #476603;
}
.pensamos-course-walkthrough__modal .pensamos-course-button:hover,
.pensamos-course-walkthrough__modal .pensamos-course-button:focus-visible,
.pensamos-course-walkthrough__modal .pensamos-course-button:disabled,
.pensamos-course-walkthrough__modal .pensamos-course-button[aria-disabled="true"] {
box-shadow: none;
}
.pensamos-course-walkthrough__modal .pensamos-course-button:disabled,
.pensamos-course-walkthrough__modal .pensamos-course-button[aria-disabled="true"] {
opacity: 0.7;
}
@keyframes pensamosCourseModalFade {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
body.pensamos-ui-modal-open,
body.pensamos-course-modal-open {
overflow: hidden;
}
body.pensamos-ui-modal-open .pensamos-assistant,
body.pensamos-ui-modal-open .pensamos-cookies,
body.pensamos-course-modal-open .pensamos-assistant,
body.pensamos-course-modal-open .pensamos-cookies {
opacity: 0;
pointer-events: none;
visibility: hidden;
}
body.pensamos-awaiting-portal-modal .pensamos-course-walkthrough__grid,
body.pensamos-awaiting-portal-modal .pensamos-course-walkthrough__hero,
body.pensamos-awaiting-portal-modal .pensamos-course-walkthrough,
body.pensamos-awaiting-portal-modal .pensamos-portal-sibling-panel,
body.pensamos-awaiting-portal-modal .pensamos-section-comments,
body.pensamos-awaiting-portal-modal .pensamos-course-block.is-active {
display: none !important;
}
body.pensamos-awaiting-portal-modal::before {
content: "";
position: fixed;
top: 50%;
left: calc(50% - 160px);
width: 96px;
height: 96px;
margin: -48px 0 0 -48px;
border: 7px solid rgba(15, 99, 184, 0.18);
border-top-color: var(--pensamos-primary, #0b3d6a);
border-radius: 999px;
animation: pensamos-awaiting-portal-spin 720ms linear infinite;
z-index: 10005;
pointer-events: none;
}
@media (max-width: 1100px) {
body.pensamos-awaiting-portal-modal::before {
left: 50%;
}
}
@keyframes pensamos-awaiting-portal-spin {
to {
transform: rotate(360deg);
}
}
@media (max-width: 921px) {
.pensamos-popup {
padding: 8px;
}
.pensamos-popup__dialog {
width: calc(100vw - 16px);
height: calc(100dvh - 16px);
max-height: calc(100dvh - 16px);
padding: 18px 14px 14px;
border-radius: 28px;
}
.pensamos-auth-modal__dialog {
height: auto;
max-height: calc(100dvh - 16px);
padding: 24px 20px;
}
.pensamos-popup__close {
top: 12px;
right: 12px;
width: 42px;
height: 42px;
border-radius: 14px;
}
.pensamos-popup__head {
padding: 16px 56px 16px 16px;
border-radius: 22px;
}
.pensamos-popup__body {
margin-top: 12px;
padding-right: 4px;
}
.pensamos-popup__actions,
.pensamos-course-walkthrough__modal-actions {
padding: 14px;
border-radius: 22px;
}
.pensamos-auth-modal__footer,
.pensamos-auth-modal .pensamos-register__actions {
display: grid;
grid-template-columns: 1fr;
}
.pensamos-auth-modal__footer .pensamos-button,
.pensamos-auth-modal .pensamos-register__actions .pensamos-button,
.pensamos-auth-modal__submit input[type="submit"] {
width: 100%;
}
.pensamos-course-walkthrough__modal-body {
grid-template-columns: 1fr;
}
.pensamos-course-walkthrough__modal-body > .pensamos-course-walkthrough__modal-section:first-child,
.pensamos-course-walkthrough__modal-body > .pensamos-course-walkthrough__modal-section.is-note {
grid-column: auto;
}
.pensamos-course-walkthrough__modal-nav {
justify-content: flex-start;
}
}
@media (max-width: 640px) {
.pensamos-course-walkthrough__test,
.pensamos-course-walkthrough__modal-dialog,
.pensamos-course-walkthrough__test-modal-dialog {
padding: 20px 18px;
border-radius: 24px;
}
.pensamos-course-walkthrough__modal,
.pensamos-course-walkthrough__test-modal {
padding: 8px;
}
.pensamos-course-walkthrough__modal-dialog,
.pensamos-course-walkthrough__test-modal-dialog {
width: calc(100vw - 16px);
height: calc(100dvh - 16px);
max-height: calc(100dvh - 16px);
padding: 18px 14px 14px;
border-radius: 28px;
}
.pensamos-course-walkthrough__modal-close {
top: 12px;
right: 12px;
width: 42px;
height: 42px;
border-radius: 14px;
}
.pensamos-course-walkthrough__modal-head,
.pensamos-course-walkthrough__test-modal-head {
padding: 16px 56px 16px 16px;
border-radius: 22px;
}
.pensamos-course-walkthrough__modal-body,
.pensamos-course-walkthrough__test-modal-body {
margin-top: 12px;
padding-right: 4px;
}
.pensamos-course-walkthrough__modal-body {
gap: 12px;
}
.pensamos-course-walkthrough__modal-section {
padding: 18px 16px 16px 62px;
border-radius: 22px;
}
.pensamos-course-walkthrough__modal-section::before {
left: 14px;
top: 14px;
width: 34px;
height: 34px;
border-radius: 12px;
}
}