: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%;
}
}
.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-guide {
padding: 0 0 var(--pensamos-space-9);
background:
radial-gradient(circle at 6% 4%, rgba(173, 213, 215, 0.24), transparent 28%),
linear-gradient(180deg, #f4f8fb 0%, #f8fbfd 42%, #ffffff 100%);
}
.pensamos-course-guide .pensamos-shell,
.pensamos-classes-guide .pensamos-shell {
position: relative;
z-index: 1;
width: 100%;
max-width: none;
margin: 0;
padding: 4px clamp(6px, 0.8vw, 10px) 4px;
}
.pensamos-course-guide__topbar {
display: grid;
grid-template-columns: auto minmax(320px, 1fr) auto auto;
gap: 18px;
align-items: center;
padding: 18px 24px 16px;
margin-top: 12px;
border: 1px solid rgba(207, 219, 233, 0.9);
border-bottom: 0;
border-radius: var(--pensamos-radius-lg) var(--pensamos-radius-lg) 0 0;
background: rgba(255, 255, 255, 0.9);
box-shadow: 0 22px 44px rgba(13, 28, 49, 0.06);
backdrop-filter: blur(18px);
}
.pensamos-course-guide .pensamarket-cats--links,
.pensamos-classes-guide .pensamarket-cats--links {
margin-top: 0;
margin-bottom: 0;
}
.pensamarket-cats--links .pensamarket-chip {
min-height: 36px;
padding: 0 14px;
font-size: 0.88rem;
}
.pensamarket-cats--links .pensamarket-chip:hover,
.pensamarket-cats--links .pensamarket-chip:focus-visible {
transform: none;
}
.pensamos-course-block,
.pensamos-course-guide__sidebar-card {
border: 1px solid rgba(214, 224, 236, 0.92);
border-radius: 24px;
background: rgba(255, 255, 255, 0.92);
box-shadow: 0 22px 44px rgba(13, 28, 49, 0.05);
backdrop-filter: blur(16px);
}
.pensamos-course-guide__layout {
display: grid;
grid-template-columns: minmax(0, 1fr) 210px;
gap: 10px;
margin-top: 10px;
align-items: start;
}
.pensamos-course-guide__content {
display: grid;
gap: 10px;
min-width: 0;
}
.pensamos-course-guide__layout.is-focus-mode {
position: relative;
grid-template-columns: minmax(0, 1fr) 308px;
gap: 24px;
}
.pensamos-course-guide__layout.is-focus-mode .pensamos-course-guide__content {
width: auto;
}
.pensamos-course-guide__layout.is-focus-mode.pensamos-course-guide__layout--no-sidebar {
grid-template-columns: minmax(0, 1fr);
}
.pensamos-course-guide__focus-back-link {
display: inline-flex;
align-items: center;
justify-content: center;
width: 42px;
height: 42px;
border: 1px solid rgba(195, 209, 225, 0.92);
border-radius: 14px;
background: rgba(255, 255, 255, 0.92);
color: #20314f;
font-size: 1.2rem;
font-weight: 700;
text-decoration: none;
box-shadow: 0 12px 24px rgba(13, 28, 49, 0.05);
transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}
.pensamos-course-guide__focus-back-link:hover,
.pensamos-course-guide__focus-back-link:focus-visible {
transform: translateY(-1px);
border-color: rgba(79, 124, 255, 0.38);
box-shadow: 0 16px 28px rgba(13, 28, 49, 0.08);
}
.pensamos-course-guide__focus-back-link--inline {
flex: 0 0 auto;
align-self: flex-start;
}
.pensamos-course-breadcrumb {
display: inline-flex;
flex-wrap: wrap;
align-items: center;
gap: 8px;
max-width: 100%;
font-size: 0.82rem;
line-height: 1.3;
}
.pensamos-course-breadcrumb__link,
.pensamos-course-breadcrumb__link:visited {
color: #5e7894;
font-weight: 700;
text-decoration: none;
}
.pensamos-course-breadcrumb__link:hover,
.pensamos-course-breadcrumb__link:focus-visible {
color: #294d74;
}
.pensamos-course-breadcrumb__separator {
color: #a4b1c2;
font-weight: 600;
}
.pensamos-course-breadcrumb__current {
color: #20314f;
font-weight: 800;
}
.pensamos-course-block__head .pensamos-course-breadcrumb {
margin-bottom: 6px;
}
.pensamos-course-walkthrough__hero-top .pensamos-course-walkthrough__kicker {
display: none;
}
.pensamos-course-walkthrough__hero-top .pensamos-course-breadcrumb {
justify-content: flex-start;
text-align: left;
}
.pensamos-course-overview-guide {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 10px;
margin: 14px 0 16px;
padding: 12px 0;
border-top: 1px solid rgba(207, 219, 233, 0.78);
border-bottom: 1px solid rgba(207, 219, 233, 0.78);
}
.pensamos-course-overview-guide__item {
display: grid;
gap: 5px;
min-width: 0;
padding-right: 12px;
}
.pensamos-course-overview-guide__label {
color: #3f6b8a;
font-size: 0.72rem;
font-weight: 800;
letter-spacing: 0.08em;
text-transform: uppercase;
}
.pensamos-course-overview-guide__item strong {
color: #162640;
font-size: 0.95rem;
line-height: 1.18;
}
.pensamos-course-overview-guide__item span:not(.pensamos-course-overview-guide__label) {
color: #5d6f86;
font-size: 0.86rem;
line-height: 1.42;
}
.pensamos-route-onboarding[hidden] {
display: none;
}
.pensamos-route-onboarding {
position: fixed;
inset: 0;
z-index: 100000;
display: grid;
place-items: center;
padding: 20px;
}
.pensamos-route-onboarding-is-open {
overflow: hidden;
}
.pensamos-route-onboarding__backdrop {
position: absolute;
inset: 0;
background: rgba(14, 24, 38, 0.48);
backdrop-filter: blur(7px);
}
.pensamos-route-onboarding__dialog {
position: relative;
z-index: 1;
display: grid;
grid-template-rows: auto minmax(0, 1fr) auto;
width: min(760px, 100%);
max-height: min(88dvh, 760px);
border: 1px solid rgba(184, 204, 218, 0.95);
border-radius: 18px;
background: #ffffff;
box-shadow: 0 28px 80px rgba(13, 28, 49, 0.2);
overflow: hidden;
}
.pensamos-route-onboarding__header,
.pensamos-route-onboarding__footer {
display: flex;
align-items: center;
justify-content: space-between;
gap: 16px;
padding: 18px 20px;
border-bottom: 1px solid rgba(214, 224, 236, 0.86);
}
.pensamos-route-onboarding__footer {
border-top: 1px solid rgba(214, 224, 236, 0.86);
border-bottom: 0;
}
.pensamos-route-onboarding__header span,
.pensamos-route-onboarding__label,
.pensamos-route-onboarding__footer > span {
color: #2f6f68;
font-size: 0.74rem;
font-weight: 800;
text-transform: uppercase;
}
.pensamos-route-onboarding__header h2,
.pensamos-route-onboarding__step h3 {
margin: 4px 0 0;
color: #162640;
line-height: 1.12;
}
.pensamos-route-onboarding__header h2 {
font-size: 1.3rem;
}
.pensamos-route-onboarding__close {
display: inline-flex;
align-items: center;
justify-content: center;
width: 38px;
height: 38px;
border: 1px solid rgba(201, 214, 228, 0.95);
border-radius: 999px;
background: #f8fbfd;
color: #25364f;
font-size: 1.05rem;
font-weight: 800;
cursor: pointer;
}
.pensamos-route-onboarding__body {
display: grid;
gap: 16px;
min-height: 0;
padding: 18px 20px 20px;
overflow: auto;
}
.pensamos-route-onboarding__intro,
.pensamos-route-onboarding__step p {
margin: 0;
color: #52677f;
font-size: 0.98rem;
line-height: 1.55;
}
.pensamos-route-onboarding__step {
display: grid;
gap: 12px;
}
.pensamos-route-onboarding__step[hidden] {
display: none;
}
.pensamos-route-onboarding__table-wrap {
order: 5;
overflow-x: auto;
border: 1px solid rgba(205, 219, 232, 0.88);
border-radius: 12px;
background: #f8fbfd;
}
.pensamos-route-onboarding__table {
width: 100%;
min-width: 560px;
border-collapse: collapse;
font-size: 0.86rem;
}
.pensamos-route-onboarding__table th,
.pensamos-route-onboarding__table td {
padding: 11px 12px;
border-bottom: 1px solid rgba(215, 225, 235, 0.9);
text-align: left;
vertical-align: top;
}
.pensamos-route-onboarding__table th {
color: #2f5f81;
font-weight: 800;
}
.pensamos-route-onboarding__table tbody tr:last-child td {
border-bottom: 0;
}
.pensamos-route-onboarding__resource {
justify-self: start;
}
.pensamos-route-onboarding__footer-actions {
display: flex;
align-items: center;
justify-content: flex-end;
gap: 8px;
flex-wrap: wrap;
}
.pensamos-course-walkthrough__intro-actions {
display: flex;
align-items: center;
gap: 8px;
margin-top: 12px;
flex-wrap: wrap;
}
.pensamos-course-walkthrough__intro-actions .pensamos-course-button--compact {
min-height: 36px;
padding: 8px 16px;
border-radius: 999px;
font-size: 0.8rem;
font-weight: 650;
letter-spacing: 0;
}
@media (max-width: 640px) {
.pensamos-route-onboarding {
padding: 10px;
align-items: end;
}
.pensamos-route-onboarding__dialog {
width: 100%;
max-height: 92dvh;
border-radius: 16px;
}
.pensamos-route-onboarding__header,
.pensamos-route-onboarding__footer {
align-items: flex-start;
padding: 15px;
}
.pensamos-route-onboarding__footer {
display: grid;
}
.pensamos-route-onboarding__footer-actions {
width: 100%;
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.pensamos-route-onboarding__body {
padding: 15px;
}
.pensamos-course-walkthrough__intro-actions .pensamos-course-button--compact {
min-height: 34px;
padding: 7px 14px;
font-size: 0.78rem;
}
.pensamos-route-onboarding__table {
min-width: 0;
}
.pensamos-route-onboarding__table thead {
display: none;
}
.pensamos-route-onboarding__table,
.pensamos-route-onboarding__table tbody,
.pensamos-route-onboarding__table tr,
.pensamos-route-onboarding__table td {
display: block;
width: 100%;
}
.pensamos-route-onboarding__table tr {
padding: 10px 12px;
border-bottom: 1px solid rgba(215, 225, 235, 0.9);
}
.pensamos-route-onboarding__table tr:nth-child(n+2) {
display: none;
}
.pensamos-route-onboarding__table tr:last-child {
border-bottom: 0;
}
.pensamos-route-onboarding__table td {
display: grid;
grid-template-columns: minmax(94px, 0.42fr) minmax(0, 1fr);
gap: 8px;
padding: 5px 0;
border-bottom: 0;
}
.pensamos-route-onboarding__table td::before {
content: attr(data-label);
color: #2f5f81;
font-weight: 800;
}
.pensamos-route-onboarding__resource {
order: 4;
width: 100%;
}
}
.pensamos-course-guide__sidebar.is-focus-mode {
position: sticky;
top: 24px;
display: block;
}
.pensamos-course-guide__intro,
.pensamos-course-guide__sidebar {
position: sticky;
top: 18px;
}
.pensamos-course-guide__intro {
position: static;
justify-self: start;
width: min(100%, 980px);
padding: 16px 16px 18px;
border: 1px solid rgba(214, 224, 236, 0.92);
border-radius: 22px;
background:
radial-gradient(circle at top left, rgba(79, 124, 255, 0.12), transparent 34%),
radial-gradient(circle at bottom right, rgba(35, 93, 129, 0.06), transparent 32%),
linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(248, 251, 255, 0.96) 100%);
box-shadow: 0 18px 36px rgba(13, 28, 49, 0.05);
backdrop-filter: blur(16px);
}
.pensamos-course-guide__intro-copy {
display: block;
min-width: 0;
}
.pensamos-course-guide__intro h1 {
margin: 10px 0 8px;
max-width: 15ch;
font-size: clamp(1.55rem, 2.05vw, 2.25rem);
line-height: 1.01;
letter-spacing: -0.055em;
}
.pensamos-course-guide__intro p {
margin: 0;
max-width: 54ch;
font-size: 0.95rem;
line-height: 1.52;
color: #5b6780;
}
.pensamos-course-guide__intro-note {
margin-top: 12px;
padding-top: 12px;
border-top: 1px solid rgba(207, 219, 233, 0.7);
font-size: 0.84rem;
line-height: 1.45;
color: #40516c;
}
.pensamos-course-guide__intro-route-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(min(220px, 100%), 1fr));
gap: 10px;
margin-top: 16px;
max-width: 900px;
}
.pensamos-course-guide__sidebar {
display: grid;
gap: 8px;
}
.pensamos-course-guide__sidebar-card {
position: static;
padding: 8px;
background:
radial-gradient(circle at top right, rgba(79, 124, 255, 0.05), transparent 40%),
linear-gradient(180deg, rgba(255, 255, 255, 0.95) 0%, rgba(248, 251, 255, 0.93) 100%);
box-shadow: 0 16px 30px rgba(13, 28, 49, 0.035);
}
.pensamos-course-guide__sidebar-card--compact {
position: static;
}
.pensamos-course-guide__sidebar-kicker {
margin: 0 0 6px;
font-size: 0.74rem;
font-weight: 800;
letter-spacing: 0.12em;
text-transform: uppercase;
color: #50718b;
}
.pensamos-course-guide__sidebar-card ul {
list-style: none;
margin: 0;
padding: 0;
display: grid;
gap: 8px;
}
.pensamos-course-guide__sidebar-card a {
display: grid;
grid-template-columns: auto minmax(0, 1fr);
align-items: start;
gap: 7px;
padding: 8px 9px;
border-radius: 14px;
text-decoration: none;
color: #20314f;
background: rgba(255, 255, 255, 0.9);
border: 1px solid rgba(207, 219, 233, 0.9);
box-shadow: 0 6px 16px rgba(13, 28, 49, 0.025);
}
.pensamos-course-guide__intro-route-card {
position: relative;
display: grid;
gap: 3px;
min-height: 66px;
padding: 8px 10px 8px 14px;
border-radius: 14px;
text-decoration: none;
color: #20314f;
background: linear-gradient(180deg, #ffffff 0%, #f9fbff 100%);
border: 1px solid rgba(207, 219, 233, 0.88);
box-shadow: 0 10px 18px rgba(13, 28, 49, 0.035);
}
.pensamos-course-guide__intro-route-card::before {
content: "";
position: absolute;
left: 0;
top: 12px;
width: 6px;
height: calc(100% - 24px);
border-radius: 999px;
background: #93a4bb;
}
.pensamos-course-guide__intro-route-card strong {
font-size: 0.86rem;
line-height: 1.14;
}
.pensamos-course-guide__intro-route-card span {
margin-top: 1px;
font-size: 0.72rem;
line-height: 1.24;
color: #64748b;
}
.pensamos-course-guide__intro-route-card:hover,
.pensamos-course-guide__intro-route-card:focus-visible {
transform: translateY(-1px);
border-color: rgba(35, 93, 129, 0.3);
box-shadow: 0 12px 22px rgba(13, 28, 49, 0.05);
}
.pensamarket-chip--start.pensamos-course-guide__intro-route-card::before {
background: linear-gradient(180deg, #1fa77a 0%, #27c18a 100%);
}
.pensamarket-chip--cv.pensamos-course-guide__intro-route-card::before {
background: linear-gradient(180deg, #f0a64c 0%, #ea8f1f 100%);
}
.pensamarket-chip--search.pensamos-course-guide__intro-route-card::before {
background: linear-gradient(180deg, #4f7cff 0%, #245d81 100%);
}
.pensamos-course-guide__nav-badge {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 24px;
height: 24px;
padding: 0 4px;
border-radius: 8px;
font-size: 0.5rem;
font-weight: 800;
letter-spacing: 0.06em;
color: #20314f;
background: rgba(31, 47, 77, 0.07);
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
}
.pensamos-course-guide__nav-copy {
display: grid;
gap: 3px;
min-width: 0;
}
.pensamos-course-guide__nav-copy strong {
font-size: 0.84rem;
line-height: 1.12;
}
.pensamos-course-guide__nav-link.is-active,
.pensamos-course-guide__sidebar-card a:hover,
.pensamos-course-guide__sidebar-card a:focus-visible {
border-color: rgba(35, 93, 129, 0.28);
background: rgba(35, 93, 129, 0.05);
transform: translateY(-1px);
box-shadow: 0 10px 18px rgba(13, 28, 49, 0.04);
}
.pensamos-course-guide__sidebar-card a span {
font-size: 0.71rem;
line-height: 1.24;
color: #64748b;
}
.pensamos-course-guide__nav-link--coach .pensamos-course-guide__nav-badge {
background: rgba(31, 167, 122, 0.14);
color: #117a59;
}
.pensamos-course-guide__nav-link--search .pensamos-course-guide__nav-badge {
background: rgba(79, 124, 255, 0.14);
color: #245d81;
}
.pensamos-course-guide__nav-link--dev .pensamos-course-guide__nav-badge {
background: rgba(99, 102, 241, 0.14);
color: #4c51bf;
}
.pensamos-course-guide__nav-link--remote .pensamos-course-guide__nav-badge {
background: rgba(43, 143, 110, 0.14);
color: #1f7a5e;
}
.pensamos-course-guide__nav-link--cv .pensamos-course-guide__nav-badge {
background: rgba(240, 166, 76, 0.16);
color: #b96b11;
}
.pensamos-course-guide__nav-link--ai .pensamos-course-guide__nav-badge {
background: rgba(141, 92, 246, 0.14);
color: #6e42d3;
}
.pensamos-course-guide__nav-link--review .pensamos-course-guide__nav-badge {
background: rgba(224, 91, 104, 0.14);
color: #b83f52;
}
.pensamos-course-guide__nav-link--start .pensamos-course-guide__nav-badge {
background: rgba(31, 167, 122, 0.14);
color: #117a59;
}
.pensamos-course-guide__sidebar-actions {
display: grid;
gap: 7px;
margin-top: 10px;
}
[data-course-panel] {
display: none;
}
[data-course-panel].is-active {
display: block;
}
.pensamos-course-block {
padding: 16px;
scroll-margin-top: 24px;
}
.pensamos-course-block__head {
display: flex;
justify-content: space-between;
align-items: flex-start;
gap: 16px;
margin-bottom: 14px;
}
.pensamos-course-block__head > div {
min-width: 0;
flex: 1 1 auto;
}
.pensamos-course-block__head h2 {
margin: 0 0 6px;
font-size: clamp(1.22rem, 1.6vw, 1.62rem);
line-height: 1.02;
letter-spacing: -0.05em;
}
.pensamos-course-block__head p {
margin: 0;
max-width: 70ch;
color: #607088;
font-size: 0.94rem;
line-height: 1.45;
}
.pensamos-course-button,
.pensamos-course-button:visited {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 44px;
padding: 0 18px;
border-radius: 999px;
border: 1px solid transparent;
background: linear-gradient(135deg, #17324d 0%, #1f3158 100%);
color: #f8fbff;
font-size: 0.9rem;
font-weight: 800;
letter-spacing: -0.02em;
text-decoration: none;
box-shadow: 0 12px 24px rgba(13, 28, 49, 0.14);
transition: transform 180ms ease, box-shadow 180ms ease, background 180ms ease, border-color 180ms ease, color 180ms ease;
}
.pensamos-course-button:hover,
.pensamos-course-button:focus-visible {
transform: translateY(-1px);
box-shadow: 0 18px 32px rgba(13, 28, 49, 0.16);
}
.pensamos-course-button:disabled,
.pensamos-course-button[aria-disabled="true"] {
opacity: 0.46;
cursor: not-allowed;
box-shadow: none;
transform: none;
}
.pensamos-course-button--ghost,
.pensamos-course-button--ghost:visited {
background: rgba(255, 255, 255, 0.96);
color: #1f3158;
border-color: rgba(203, 214, 228, 0.95);
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.92);
}
.pensamos-course-button--ghost:hover,
.pensamos-course-button--ghost:focus-visible {
background: rgba(79, 124, 255, 0.08);
border-color: rgba(79, 124, 255, 0.24);
color: #17324d;
}
.pensamos-course-block__actions {
display: flex;
flex-wrap: wrap;
gap: 10px;
margin-top: 18px;
}
#puntos-revisión {
--pensamos-review-accent: #e05b68;
--pensamos-review-accent-soft: rgba(224, 91, 104, 0.12);
--pensamos-review-accent-border: rgba(224, 91, 104, 0.22);
}
#puntos-revisión .pensamos-course-guidance-columns {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 16px;
align-items: start;
}
#puntos-revisión .pensamos-course-guidance-column {
display: grid;
gap: 14px;
align-content: start;
}
#puntos-revisión .pensamos-course-guidance-card {
display: grid;
gap: 14px;
padding: 18px;
border: 1px solid var(--pensamos-review-accent-border);
border-radius: 22px;
background:
radial-gradient(circle at top right, rgba(224, 91, 104, 0.07), transparent 38%),
linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(252, 246, 247, 0.98) 100%);
box-shadow: 0 18px 34px rgba(13, 28, 49, 0.05);
}
#puntos-revisión .pensamos-course-guidance-card__head {
display: grid;
grid-template-columns: auto minmax(0, 1fr);
gap: 12px;
align-items: start;
}
#puntos-revisión .pensamos-course-guidance-card__index {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 34px;
height: 34px;
padding: 0 10px;
border-radius: 11px;
background: var(--pensamos-review-accent-soft);
border: 1px solid rgba(224, 91, 104, 0.16);
color: #b83f52;
font-size: 0.78rem;
font-weight: 800;
letter-spacing: 0.08em;
}
#puntos-revisión .pensamos-course-guidance-card h3 {
margin: 0;
font-size: 1rem;
line-height: 1.16;
letter-spacing: -0.03em;
color: #20314f;
}
#puntos-revisión .pensamos-course-guidance-list {
display: grid;
gap: 10px;
margin: 0;
padding: 0;
list-style: none;
}
#puntos-revisión .pensamos-course-guidance-list__item {
display: grid;
grid-template-columns: auto minmax(0, 1fr);
gap: 10px;
align-items: start;
margin: 0;
color: #52657f;
font-size: 0.9rem;
line-height: 1.48;
}
#puntos-revisión .pensamos-course-guidance-list__item::before {
content: "";
width: 9px;
height: 9px;
margin-top: 0.34rem;
border-radius: 999px;
background: linear-gradient(135deg, #ff8cab 0%, #e05b68 100%);
box-shadow: 0 0 0 4px rgba(224, 91, 104, 0.08);
}
@media (max-width: 920px) {
#puntos-revisión .pensamos-course-guidance-columns {
grid-template-columns: 1fr;
}
}
.pensamos-course-guide__content,
.pensamos-course-guide__sidebar,
.pensamos-course-guide__intro,
.pensamos-intent-panel,
.pensamos-course-guide__sidebar-card {
min-width: 0;
}
@media (max-width: 1180px) {
.pensamos-course-guide__layout.is-focus-mode {
grid-template-columns: 1fr;
}
.pensamos-course-guide__layout.is-focus-mode .pensamos-course-guide__sidebar {
position: static;
}
}
@media (max-width: 921px) {
.pensamos-course-guide__layout,
.pensamos-course-guide__layout.is-focus-mode {
grid-template-columns: 1fr;
}
.pensamos-course-guide .pensamos-shell,
.pensamos-classes-guide .pensamos-shell {
padding-inline: clamp(10px, 3vw, 18px);
}
.pensamos-course-guide__topbar {
grid-template-columns: 1fr;
gap: 12px;
padding: 16px;
}
.pensamos-course-guide__intro,
.pensamos-course-guide__sidebar {
position: static;
width: 100%;
}
.pensamos-course-overview-guide {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}
@media (max-width: 720px) {
.pensamos-course-guide__sidebar-card {
border-radius: 22px;
}
}
@media (max-width: 768px) {
.pensamos-course-guide__sidebar,
.pensamos-course-guide__layout.is-focus-mode .pensamos-course-guide__sidebar {
display: none;
}
}
@media (max-width: 520px) {
.pensamos-course-guide .pensamos-shell,
.pensamos-classes-guide .pensamos-shell {
padding-inline: 8px;
}
.pensamos-course-guide__topbar {
margin-top: 8px;
padding: 14px;
border-radius: 22px 22px 0 0;
}
.pensamos-course-breadcrumb {
gap: 6px;
font-size: 0.76rem;
}
.pensamos-course-overview-guide {
grid-template-columns: 1fr;
margin: 12px 0 14px;
}
.pensamos-course-overview-guide__item {
padding-right: 0;
}
}
.pensamos-course-prompt-grid,
.pensamos-course-cv-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(min(320px, 100%), 1fr));
gap: 20px;
margin-top: 16px;
}
.pensamos-course-prompt-card,
.pensamos-course-cv-card {
background: #fff;
border: 1px solid #e6e6ed;
border-radius: 16px;
padding: 20px;
box-shadow: 0 2px 6px rgba(20, 20, 40, 0.04);
display: flex;
flex-direction: column;
gap: 14px;
}
.pensamos-course-prompt-card header h3,
.pensamos-course-cv-card__head h3 {
margin: 0 0 4px 0;
font-size: 1.05rem;
}
.pensamos-course-prompt-card header p {
margin: 0;
color: #4c4c66;
font-size: 0.9rem;
}
.pensamos-course-prompt-card ul {
list-style: none;
margin: 0;
padding: 0;
display: flex;
flex-direction: column;
gap: 10px;
}
.pensamos-course-prompt-card li code {
display: block;
background: #f7f7fb;
border: 1px solid #ececf4;
border-radius: 10px;
padding: 10px 12px;
font-size: 0.85rem;
line-height: 1.45;
white-space: pre-wrap;
color: #2d2d44;
}
.pensamos-course-cv-card {
gap: 16px;
}
.pensamos-course-cv-card__meta {
margin: 0;
color: #6f6f88;
font-size: 0.85rem;
}
.pensamos-course-cv-card__body {
display: flex;
flex-direction: column;
gap: 14px;
}
.pensamos-course-cv-card__section h4 {
margin: 0 0 6px 0;
font-size: 0.75rem;
text-transform: uppercase;
letter-spacing: 0.06em;
color: #7a7a92;
}
.pensamos-course-cv-card__section p,
.pensamos-course-cv-card__section ul {
margin: 0;
}
.pensamos-course-cv-card__section ul {
padding-left: 18px;
display: flex;
flex-direction: column;
gap: 4px;
}
.pensamos-course-cv-card__headline {
font-weight: 600;
color: #2d2d44;
}
.pensamos-course-cv-card__job + .pensamos-course-cv-card__job {
margin-top: 12px;
padding-top: 12px;
border-top: 1px dashed #ececf4;
}
.pensamos-course-cv-card__job-head {
margin: 0 0 6px 0;
font-size: 0.92rem;
color: #2d2d44;
}
.pensamos-course-cv-card__job-head span {
color: #6f6f88;
font-weight: 400;
}
.pensamos-course-cv-card .pensamos-course-badge-list {
display: flex;
flex-wrap: wrap;
gap: 6px;
list-style: none;
padding: 0;
}
.pensamos-course-cv-card .pensamos-course-badge-list li {
background: #f0f0f8;
border-radius: 999px;
padding: 4px 10px;
font-size: 0.78rem;
color: #3a3a55;
}
.pensamos-course-cv-card__notes {
background: #fff8e6;
border-left: 3px solid #ffc107;
padding: 10px 14px;
border-radius: 0 10px 10px 0;
font-size: 0.88rem;
color: #5b4a00;
display: flex;
flex-direction: column;
gap: 4px;
}
.pensamos-course-cv-card__notes strong {
font-size: 0.78rem;
text-transform: uppercase;
letter-spacing: 0.06em;
color: #7a5b00;
}
.pensamos-section-comments {
max-width: 720px;
margin: 12px auto 6px 0;
padding: 0;
width: 100%;
}
.pensamos-comment-toast {
position: fixed;
left: 50%;
top: 88px;
transform: translate(-50%, -16px);
z-index: 2147483000;
display: inline-flex;
align-items: center;
gap: 8px;
padding: 12px 20px;
border-radius: 999px;
background: linear-gradient(180deg, #17324d 0%, #0f2538 100%);
color: #ffffff;
font-size: 0.92rem;
font-weight: 600;
box-shadow: 0 18px 40px rgba(13, 28, 49, 0.28);
opacity: 0;
pointer-events: none;
transition: opacity 0.25s ease, transform 0.25s ease;
}
.pensamos-comment-toast::before {
content: "";
width: 18px;
height: 18px;
border-radius: 50%;
background: #2b8f6e url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center/12px no-repeat;
flex: none;
}
.pensamos-comment-toast.is-visible {
opacity: 1;
transform: translate(-50%, 0);
}
@media (prefers-reduced-motion: reduce) {
.pensamos-comment-toast {
transition: opacity 0.25s ease;
transform: translate(-50%, 0);
}
}
.pensamos-section-comments__inner {
position: relative;
overflow: hidden;
display: grid;
gap: 14px;
width: 100%;
padding: 18px 22px;
border: 1px solid rgba(137, 205, 245, 0.78);
border-radius: 18px;
background: #f4f9fd;
box-shadow: 0 12px 28px rgba(45, 115, 165, 0.08);
box-sizing: border-box;
}
.pensamos-section-comments__form {
width: 100%;
max-width: none;
}
.pensamos-section-comments__form form {
display: grid;
grid-template-columns: minmax(0, 1fr) auto;
gap: 12px;
align-items: end;
margin: 0;
}
.pensamos-section-comments__head {
display: flex;
align-items: center;
gap: 10px;
}
.pensamos-section-comments__icon {
display: inline-flex;
flex: 0 0 auto;
align-items: center;
justify-content: center;
width: 34px;
height: 34px;
border-radius: 11px;
background: linear-gradient(145deg, #46c7f4 0%, #8d7cf6 100%);
box-shadow: 0 7px 15px rgba(82, 151, 224, 0.2);
color: #ffffff;
font-size: 1rem;
font-weight: 900;
}
.pensamos-section-comments__head h2 {
margin: 0;
color: #0d1c31;
font-size: clamp(1rem, 1.4vw, 1.16rem);
line-height: 1.15;
}
.pensamos-section-comments__head p {
margin: 3px 0 0;
color: #5e7894;
font-size: 0.86rem;
line-height: 1.35;
}
.pensamos-section-comments__form {
display: grid;
gap: 8px;
padding: 0;
border: 0;
}
.pensamos-section-comments__form .comment-reply-title:empty {
display: none;
}
.pensamos-section-comments__form .comment-reply-title {
display: none;
margin: 0;
color: #0d1c31;
font-size: 1rem;
}
.pensamos-section-comments__form .ast-comment-formwrap,
.pensamos-section-comments__form .comment-form-cookies-consent {
grid-column: 1 / -1;
}
.pensamos-section-comments__form .comment-form-comment,
.pensamos-section-comments__form .comment-form-author,
.pensamos-section-comments__form .comment-form-email,
.pensamos-section-comments__form .comment-form-url {
display: grid;
gap: 6px;
margin: 0;
}
.pensamos-section-comments__form label {
color: #2b3d59;
font-size: 0.9rem;
font-weight: 700;
}
.pensamos-section-comments__form input[type="text"],
.pensamos-section-comments__form input[type="email"],
.pensamos-section-comments__form input[type="url"],
.pensamos-section-comments__form textarea {
width: 100%;
padding: 9px 12px;
border: 1px solid rgba(154, 198, 228, 0.82);
border-radius: 12px;
background: rgba(255, 255, 255, 0.88);
color: #20314f;
font-size: 0.92rem;
box-sizing: border-box;
transition: border-color 0.18s ease, box-shadow 0.18s ease, background-color 0.18s ease;
}
.pensamos-section-comments__form textarea {
height: 60px;
min-height: 60px;
resize: vertical;
}
.pensamos-section-comments__form input:focus,
.pensamos-section-comments__form textarea:focus {
outline: none;
border-color: rgba(40, 120, 189, 0.5);
box-shadow: 0 0 0 4px rgba(40, 120, 189, 0.14);
background: #ffffff;
}
.pensamos-section-comments__form .form-submit {
align-self: end;
margin: 0;
display: flex;
justify-content: flex-end;
}
.pensamos-section-comments__form .form-submit .pensamos-section-comments__submit {
appearance: none;
-webkit-appearance: none;
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 0;
min-height: 28px;
height: 28px;
padding: 0 12px;
border: 1px solid rgba(137, 205, 245, 0.9);
border-radius: 10px;
background: #f4f9fd;
color: #1d557f;
font-family: inherit;
font-size: 0.78rem;
font-weight: 850;
line-height: 1;
text-align: center;
box-shadow: none;
}
.pensamos-section-comments__form .form-submit .pensamos-section-comments__submit:hover,
.pensamos-section-comments__form .form-submit .pensamos-section-comments__submit:focus-visible {
border-color: #46a9df;
background: #e5f5fd;
color: #174b70;
transform: translateY(-1px);
}
.pensamos-section-comments__form .logged-in-as,
.pensamos-section-comments__form .comment-notes {
margin: 0;
color: #5e7894;
font-size: 0.78rem;
line-height: 1.35;
}
.pensamos-section-comments__form .logged-in-as a {
color: #1d557f;
font-weight: 700;
text-decoration: none;
}
.pensamos-section-comments__form .comment-form-cookies-consent {
display: flex;
align-items: flex-start;
gap: 8px;
}
.pensamos-section-comments__form .comment-form-cookies-consent input {
width: auto;
margin-top: 3px;
}
@media (max-width: 600px) {
.pensamos-section-comments {
margin-top: 14px;
}
.pensamos-section-comments__inner {
padding: 14px;
}
.pensamos-section-comments__form .form-submit {
justify-content: flex-end;
}
.pensamos-section-comments__submit {
width: auto;
}
.pensamos-section-comments__form form {
grid-template-columns: 1fr;
}
}
.pensamos-course-focus-quiz-shell {
position: relative;
height: 0;
overflow: visible;
}
.pensamos-course-focus-quiz-shell .pensamos-route-tracker {
padding: 0;
margin: 0;
border: 0;
background: transparent;
box-shadow: none;
}
.pensamos-course-focus-quiz-shell .pensamos-route-tracker__sidebar,
.pensamos-course-focus-quiz-shell .pensamos-route-tracker__blocks,
.pensamos-course-focus-quiz-shell .pensamos-route-tracker__noscript {
display: none;
}
.pensamos-course-focus-quiz-shell .pensamos-route-tracker__layout,
.pensamos-course-focus-quiz-shell .pensamos-route-tracker__main {
display: block;
}
.pensamos-course-walkthrough {
display: grid;
gap: 18px;
}
.pensamos-course-walkthrough__hero,
.pensamos-course-walkthrough__test {
padding: 24px;
border-radius: 28px;
border: 1px solid rgba(214, 224, 236, 0.96);
background: #ffffff;
box-shadow: 0 14px 30px rgba(13, 28, 49, 0.05);
}
.pensamos-course-walkthrough__hero {
display: grid;
grid-template-columns: minmax(0, 1.3fr) minmax(280px, 0.9fr);
gap: 20px;
align-items: start;
}
.pensamos-course-walkthrough__hero-copy {
display: grid;
gap: 12px;
align-content: start;
}
.pensamos-course-walkthrough__hero-top {
display: flex;
align-items: flex-start;
justify-content: flex-start;
gap: 12px;
}
.pensamos-course-walkthrough__kicker {
display: inline-flex;
align-items: center;
font-size: 0.78rem;
font-weight: 800;
letter-spacing: 0.08em;
text-transform: uppercase;
color: #335f86;
}
.pensamos-course-walkthrough__hero-copy h3,
.pensamos-course-walkthrough__test-head h3 {
margin: 0;
font-size: clamp(1.26rem, 1.8vw, 1.6rem);
line-height: 1.05;
letter-spacing: -0.04em;
color: #20314f;
}
.pensamos-course-walkthrough__hero-copy p,
.pensamos-course-walkthrough__test-head p {
margin: 0;
font-size: 0.94rem;
line-height: 1.54;
color: #607088;
max-width: 68ch;
}
.pensamos-course-priority-tool {
display: grid;
gap: 10px;
padding: 16px;
border: 1px solid color-mix(in srgb, var(--pensamos-route-theme-accent, #1d71c8) 20%, white);
border-radius: 22px;
background:
radial-gradient(circle at 88% 10%, var(--pensamos-route-theme-glow, rgba(34, 184, 207, 0.14)), transparent 38%),
rgba(255, 255, 255, 0.86);
box-shadow: 0 10px 24px rgba(13, 28, 49, 0.04);
}
.pensamos-course-priority-tool strong {
color: #20314f;
font-size: 1.02rem;
line-height: 1.12;
}
.pensamos-course-priority-tool > span {
max-width: 58ch;
color: #42546d;
font-size: 0.9rem;
line-height: 1.42;
}
.pensamos-course-priority-tool__actions {
display: flex;
flex-wrap: wrap;
gap: 8px;
margin-top: 2px;
}
.pensamos-course-priority-tool__actions .pensamos-course-button {
min-height: 38px;
padding-inline: 14px;
font-size: 0.84rem;
font-weight: 650;
letter-spacing: 0;
font-family: inherit;
cursor: pointer;
}
.pensamos-course-walkthrough__hero-actions,
.pensamos-course-walkthrough__test-head {
display: grid;
gap: 14px;
align-content: start;
}
.pensamos-course-walkthrough__progress {
display: grid;
gap: 8px;
padding: 16px;
border-radius: 22px;
background: #ffffff;
border: 1px solid rgba(174, 224, 255, 0.92);
box-shadow: 0 10px 24px rgba(13, 28, 49, 0.04);
}
.pensamos-course-walkthrough__progress strong {
color: #20314f;
font-size: 0.94rem;
line-height: 1;
}
.pensamos-course-walkthrough__progress .pensamos-course-walkthrough__progress-guidance {
font-size: 0.82rem;
font-weight: 600;
line-height: 1.35;
}
.pensamos-course-walkthrough__progress span:last-child {
font-size: 0.84rem;
line-height: 1.4;
color: #607088;
}
.pensamos-course-walkthrough__progress-bar {
position: relative;
height: 10px;
border-radius: 999px;
background: rgba(214, 223, 234, 0.72);
overflow: hidden;
}
.pensamos-course-walkthrough__progress-bar > span {
display: block;
width: 0;
height: 100%;
border-radius: inherit;
background: #4f7cff;
transition: width 180ms ease;
}
.pensamos-course-guide[data-route-theme="work"] {
--pensamos-route-theme-accent: #1d71c8;
--pensamos-route-theme-accent-2: #22b8cf;
--pensamos-route-theme-soft: rgba(29, 113, 200, 0.08);
--pensamos-route-theme-glow: rgba(34, 184, 207, 0.14);
--pensamos-route-theme-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23ffffff' d='M9 6V5a3 3 0 0 1 6 0v1h3a3 3 0 0 1 3 3v9a3 3 0 0 1-3 3H6a3 3 0 0 1-3-3V9a3 3 0 0 1 3-3h3Zm2 0h2V5a1 1 0 0 0-2 0v1ZM5 11v7a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-7h-5v1a1 1 0 0 1-1 1h-2a1 1 0 0 1-1-1v-1H5Z'/%3E%3C/svg%3E");
}
.pensamos-course-guide[data-route-theme="study"] {
--pensamos-route-theme-accent: #7c3aed;
--pensamos-route-theme-accent-2: #16a34a;
--pensamos-route-theme-soft: rgba(124, 58, 237, 0.08);
--pensamos-route-theme-glow: rgba(22, 163, 74, 0.14);
--pensamos-route-theme-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23ffffff' d='M5 4a4 4 0 0 1 4-4h1v20H9a4 4 0 0 0-4 4H3V6a2 2 0 0 1 2-2Zm10-4a4 4 0 0 1 4 4 2 2 0 0 1 2 2v18h-2a4 4 0 0 0-4-4h-1V0h1Z'/%3E%3C/svg%3E");
}
.pensamos-course-guide[data-route-theme="work"] .pensamos-course-walkthrough__hero,
.pensamos-course-guide[data-route-theme="study"] .pensamos-course-walkthrough__hero {
position: relative;
border-color: color-mix(in srgb, var(--pensamos-route-theme-accent) 18%, white);
background:
radial-gradient(circle at 88% 16%, var(--pensamos-route-theme-glow), transparent 34%),
linear-gradient(180deg, color-mix(in srgb, var(--pensamos-route-theme-soft) 72%, white) 0%, #ffffff 100%);
}
.pensamos-course-guide[data-route-theme="work"] .pensamos-course-walkthrough__hero-copy h3,
.pensamos-course-guide[data-route-theme="study"] .pensamos-course-walkthrough__hero-copy h3 {
display: inline-flex;
align-items: center;
gap: 12px;
}
.pensamos-course-guide[data-route-theme="work"] .pensamos-course-walkthrough__hero-copy h3::after,
.pensamos-course-guide[data-route-theme="study"] .pensamos-course-walkthrough__hero-copy h3::after {
content: "";
display: inline-flex;
flex: 0 0 auto;
width: 30px;
height: 30px;
border-radius: 11px;
background-image: var(--pensamos-route-theme-icon), linear-gradient(135deg, var(--pensamos-route-theme-accent) 0%, var(--pensamos-route-theme-accent-2) 100%);
background-position: center;
background-repeat: no-repeat;
background-size: 17px 17px, auto;
box-shadow: 0 10px 18px color-mix(in srgb, var(--pensamos-route-theme-accent) 18%, transparent);
}
.pensamos-course-guide[data-route-theme="work"] .pensamos-course-walkthrough__kicker,
.pensamos-course-guide[data-route-theme="study"] .pensamos-course-walkthrough__kicker {
color: var(--pensamos-route-theme-accent);
}
.pensamos-course-guide[data-route-theme="work"] .pensamos-course-walkthrough__progress,
.pensamos-course-guide[data-route-theme="study"] .pensamos-course-walkthrough__progress {
border-color: color-mix(in srgb, var(--pensamos-route-theme-accent) 18%, white);
background: rgba(255, 255, 255, 0.78);
}
.pensamos-course-guide[data-route-theme="work"] .pensamos-course-walkthrough__progress-bar > span,
.pensamos-course-guide[data-route-theme="study"] .pensamos-course-walkthrough__progress-bar > span {
background: linear-gradient(90deg, var(--pensamos-route-theme-accent) 0%, var(--pensamos-route-theme-accent-2) 100%);
}
.pensamos-course-guide[data-route-theme="work"] .pensamos-route-tracker__sidebar-card,
.pensamos-course-guide[data-route-theme="study"] .pensamos-route-tracker__sidebar-card {
border-color: color-mix(in srgb, var(--pensamos-route-theme-accent) 16%, white);
background:
radial-gradient(circle at 92% 4%, var(--pensamos-route-theme-glow), transparent 32%),
linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, color-mix(in srgb, var(--pensamos-route-theme-soft) 38%, white) 100%);
}
.pensamos-course-guide[data-route-theme="work"] .pensamos-route-tracker__sidebar-kicker,
.pensamos-course-guide[data-route-theme="study"] .pensamos-route-tracker__sidebar-kicker {
color: var(--pensamos-route-theme-accent);
}
.pensamos-course-walkthrough__actions {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 10px;
}
.pensamos-course-walkthrough__quiz-count {
color: #52627a;
font-size: 0.82rem;
font-weight: 700;
line-height: 1.2;
}
.pensamos-course-walkthrough__actions [hidden] {
display: none !important;
}
.pensamos-course-walkthrough__actions .pensamos-course-button,
.pensamos-course-walkthrough__actions .pensamos-course-button:visited {
min-height: 46px;
padding: 0 14px;
border-radius: 16px;
box-shadow: none;
transition: border-color 180ms ease, background 180ms ease, color 180ms ease;
}
.pensamos-course-walkthrough__actions .pensamos-course-button:not(.pensamos-course-button--ghost),
.pensamos-course-walkthrough__actions .pensamos-course-button:not(.pensamos-course-button--ghost):visited {
background: #f4ffe7;
border-color: rgba(210, 231, 160, 0.98);
color: #117a59;
}
.pensamos-course-walkthrough__actions .pensamos-course-button:not(.pensamos-course-button--ghost):hover,
.pensamos-course-walkthrough__actions .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__actions .pensamos-course-button--ghost,
.pensamos-course-walkthrough__actions .pensamos-course-button--ghost:visited {
background: #f4ffe7;
border-color: rgba(210, 231, 160, 0.98);
color: #117a59;
box-shadow: none;
}
.pensamos-course-walkthrough__actions .pensamos-course-button--ghost:hover,
.pensamos-course-walkthrough__actions .pensamos-course-button--ghost:focus-visible {
background: #eef9d9;
border-color: rgba(191, 220, 121, 0.98);
color: #0f6b4d;
}
.pensamos-course-walkthrough__actions .pensamos-course-button.pensamarket-auth__button,
.pensamos-course-walkthrough__actions .pensamos-course-button.pensamarket-auth__button:visited {
border-color: transparent;
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);
}
.pensamos-course-walkthrough__actions .pensamos-course-button.pensamarket-auth__button:hover,
.pensamos-course-walkthrough__actions .pensamos-course-button.pensamarket-auth__button:focus-visible {
background: linear-gradient(135deg, #111827 0%, #243b62 100%);
color: #fff;
box-shadow: 0 14px 28px rgba(17, 24, 39, 0.16);
}
.pensamos-course-walkthrough__actions .pensamos-course-button:not(.pensamarket-auth__button):hover,
.pensamos-course-walkthrough__actions .pensamos-course-button:not(.pensamarket-auth__button):focus-visible {
transform: none;
box-shadow: none;
}
.pensamos-course-walkthrough__footer-actions {
display: flex;
justify-content: flex-end;
margin-top: 2px;
}
.pensamos-course-walkthrough__footer-actions[hidden] {
display: none;
}
.pensamos-course-walkthrough__footer-actions .pensamos-course-button,
.pensamos-course-walkthrough__footer-actions .pensamos-course-button:visited {
min-height: 44px;
padding: 0 14px;
border-radius: 14px;
background: #f4ffe7;
border-color: rgba(210, 231, 160, 0.98);
color: #117a59;
box-shadow: none;
transition: border-color 180ms ease, background 180ms ease, color 180ms ease;
}
.pensamos-course-walkthrough__footer-actions .pensamos-course-button:hover,
.pensamos-course-walkthrough__footer-actions .pensamos-course-button:focus-visible {
background: #eef9d9;
border-color: rgba(191, 220, 121, 0.98);
color: #0f6b4d;
transform: none;
box-shadow: none;
}
.pensamos-course-walkthrough__grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 14px;
}
.pensamos-course-outcome-matrix {
display: flex;
align-items: center;
gap: 10px;
min-width: 0;
margin-top: 12px;
padding: 2px 0 0;
}
.pensamos-course-outcome-matrix__title {
flex: 0 0 auto;
color: #20314f;
font-size: 0.82rem;
line-height: 1.2;
white-space: nowrap;
}
.pensamos-course-outcome-matrix__items {
display: flex;
flex: 1 1 auto;
flex-wrap: wrap;
gap: 6px;
margin: 0;
padding: 0;
list-style: none;
}
.pensamos-course-outcome-matrix__items li {
position: relative;
display: inline-flex;
align-items: center;
gap: 5px;
min-width: 0;
padding: 5px 8px;
border: 1px solid color-mix(in srgb, var(--pensamos-route-theme-accent, #4f7cff) 14%, #dbe5f1);
border-radius: 999px;
background: rgba(255, 255, 255, 0.76);
outline: none;
cursor: help;
}
.pensamos-course-outcome-matrix__items li:hover,
.pensamos-course-outcome-matrix__items li:focus-visible {
border-color: color-mix(in srgb, var(--pensamos-route-theme-accent, #4f7cff) 34%, #dbe5f1);
background: #fff;
}
.pensamos-course-outcome-matrix__items li.is-filled {
border-color: color-mix(in srgb, var(--pensamos-route-theme-accent, #4f7cff) 42%, #dbe5f1);
background: color-mix(in srgb, var(--pensamos-route-theme-accent, #4f7cff) 7%, #fff);
}
.pensamos-course-outcome-matrix__items span {
color: var(--pensamos-route-theme-accent, #4f7cff);
font-size: 0.7rem;
font-weight: 800;
line-height: 1.2;
}
.pensamos-course-outcome-matrix__items small {
color: #20314f;
font-size: 0.72rem;
font-weight: 700;
line-height: 1.2;
}
.pensamos-course-outcome-matrix__items em {
position: absolute;
z-index: 12;
left: 0;
bottom: calc(100% + 8px);
display: block;
width: min(320px, 72vw);
padding: 10px 12px;
border: 1px solid color-mix(in srgb, var(--pensamos-route-theme-accent, #4f7cff) 22%, #dbe5f1);
border-radius: 12px;
background: #fff;
box-shadow: 0 16px 36px rgba(13, 28, 49, 0.14);
color: #20314f;
font-size: 0.78rem;
font-style: normal;
font-weight: 600;
line-height: 1.35;
opacity: 0;
pointer-events: none;
transform: translateY(4px);
transition: opacity 160ms ease, transform 160ms ease;
}
.pensamos-course-outcome-matrix__items li:hover em,
.pensamos-course-outcome-matrix__items li:focus-visible em {
opacity: 1;
transform: translateY(0);
}
.pensamos-course-walkthrough__modal-section {
min-width: 0;
}
@media (max-width: 921px) {
.pensamos-course-walkthrough__modal-actions,
.pensamos-course-walkthrough__modal-nav {
display: grid;
grid-template-columns: 1fr;
}
}
@media (max-width: 768px) {
.pensamos-course-walkthrough__hero {
grid-template-columns: 1fr;
}
}
.pensamos-course-platform-card {
--pensamos-platform-accent: #4f7cff;
--pensamos-platform-accent-soft: rgba(79, 124, 255, 0.1);
--pensamos-platform-accent-line: rgba(79, 124, 255, 0.34);
--pensamos-platform-accent-shadow: rgba(79, 124, 255, 0.18);
display: flex;
min-width: 0;
}
.pensamos-course-card-grid > .pensamos-course-platform-card:nth-child(4n + 1) {
--pensamos-platform-accent: #4f7cff;
--pensamos-platform-accent-soft: rgba(79, 124, 255, 0.1);
--pensamos-platform-accent-line: rgba(79, 124, 255, 0.34);
--pensamos-platform-accent-shadow: rgba(79, 124, 255, 0.18);
}
.pensamos-course-card-grid > .pensamos-course-platform-card:nth-child(4n + 2) {
--pensamos-platform-accent: #58cc02;
--pensamos-platform-accent-soft: rgba(88, 204, 2, 0.1);
--pensamos-platform-accent-line: rgba(88, 204, 2, 0.3);
--pensamos-platform-accent-shadow: rgba(88, 204, 2, 0.16);
}
.pensamos-course-card-grid > .pensamos-course-platform-card:nth-child(4n + 3) {
--pensamos-platform-accent: #ffb92f;
--pensamos-platform-accent-soft: rgba(255, 185, 47, 0.12);
--pensamos-platform-accent-line: rgba(255, 185, 47, 0.32);
--pensamos-platform-accent-shadow: rgba(255, 185, 47, 0.18);
}
.pensamos-course-card-grid > .pensamos-course-platform-card:nth-child(4n) {
--pensamos-platform-accent: #ff6b95;
--pensamos-platform-accent-soft: rgba(255, 107, 149, 0.1);
--pensamos-platform-accent-line: rgba(255, 107, 149, 0.32);
--pensamos-platform-accent-shadow: rgba(255, 107, 149, 0.18);
}
.pensamos-course-guide[data-route-theme="study"] .pensamos-course-card-grid > .pensamos-course-platform-card:nth-child(4n + 1) {
--pensamos-platform-accent: #7c3aed;
--pensamos-platform-accent-soft: rgba(124, 58, 237, 0.1);
--pensamos-platform-accent-line: rgba(124, 58, 237, 0.32);
--pensamos-platform-accent-shadow: rgba(124, 58, 237, 0.18);
}
.pensamos-course-guide[data-route-theme="study"] .pensamos-course-card-grid > .pensamos-course-platform-card:nth-child(4n + 2) {
--pensamos-platform-accent: #16a34a;
--pensamos-platform-accent-soft: rgba(22, 163, 74, 0.1);
--pensamos-platform-accent-line: rgba(22, 163, 74, 0.3);
--pensamos-platform-accent-shadow: rgba(22, 163, 74, 0.16);
}
.pensamos-course-guide[data-route-theme="study"] .pensamos-course-card-grid > .pensamos-course-platform-card:nth-child(4n + 3) {
--pensamos-platform-accent: #f59e0b;
--pensamos-platform-accent-soft: rgba(245, 158, 11, 0.12);
--pensamos-platform-accent-line: rgba(245, 158, 11, 0.32);
--pensamos-platform-accent-shadow: rgba(245, 158, 11, 0.18);
}
.pensamos-course-guide[data-route-theme="study"] .pensamos-course-card-grid > .pensamos-course-platform-card:nth-child(4n) {
--pensamos-platform-accent: #2563eb;
--pensamos-platform-accent-soft: rgba(37, 99, 235, 0.1);
--pensamos-platform-accent-line: rgba(37, 99, 235, 0.32);
--pensamos-platform-accent-shadow: rgba(37, 99, 235, 0.18);
}
.pensamos-course-platform-card__button {
appearance: none;
width: 100%;
height: 100%;
display: grid;
grid-template-columns: auto minmax(0, 1fr) auto;
gap: 14px;
align-items: start;
padding: 18px 18px 17px;
border: 1px solid rgba(219, 229, 241, 0.96);
border-radius: 24px;
background: #ffffff;
color: inherit;
font: inherit;
text-align: left;
cursor: pointer;
box-shadow: 0 10px 24px rgba(13, 28, 49, 0.04);
transition: transform 200ms ease, border-color 200ms ease, background 200ms ease, box-shadow 200ms ease;
}
.pensamos-course-platform-card__button:hover,
.pensamos-course-platform-card__button:focus-visible {
transform: translateY(-3px);
border-color: var(--pensamos-platform-accent-line);
box-shadow: 0 18px 34px rgba(13, 28, 49, 0.08), 0 8px 18px var(--pensamos-platform-accent-shadow);
background: #ffffff;
}
.pensamos-course-guide[data-route-theme="work"] .pensamos-course-platform-card__button,
.pensamos-course-guide[data-route-theme="study"] .pensamos-course-platform-card__button {
border-color: color-mix(in srgb, var(--pensamos-platform-accent) 16%, white);
background:
radial-gradient(circle at 96% 0%, var(--pensamos-platform-accent-soft), transparent 34%),
linear-gradient(180deg, #ffffff 0%, #fbfdff 100%);
}
.pensamos-course-platform-card__marker {
display: inline-flex;
align-items: center;
justify-content: center;
width: 26px;
height: 26px;
border-radius: 999px;
background: #eef4fb;
color: #3f5f86;
font-size: 0;
font-weight: 800;
line-height: 1;
}
.pensamos-course-platform-card__marker::before {
content: "+";
font-size: 1rem;
line-height: 1;
}
.pensamos-course-guide[data-route-theme="work"] .pensamos-course-platform-card__marker,
.pensamos-course-guide[data-route-theme="study"] .pensamos-course-platform-card__marker {
--pensamos-platform-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 6V5a3 3 0 0 1 6 0v1h3a3 3 0 0 1 3 3v9a3 3 0 0 1-3 3H6a3 3 0 0 1-3-3V9a3 3 0 0 1 3-3h3Zm2 0h2V5a1 1 0 0 0-2 0v1ZM5 11v7a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-7h-5v1a1 1 0 0 1-1 1h-2a1 1 0 0 1-1-1v-1H5Z'/%3E%3C/svg%3E");
width: 30px;
height: 30px;
border-radius: 0;
background: transparent;
color: var(--pensamos-platform-accent);
box-shadow: none;
}
.pensamos-course-guide[data-route-theme="work"] .pensamos-course-platform-card__marker::before,
.pensamos-course-guide[data-route-theme="study"] .pensamos-course-platform-card__marker::before {
content: "";
display: block;
width: 19px;
height: 19px;
background: currentColor;
filter: drop-shadow(0 1px 1px color-mix(in srgb, var(--pensamos-platform-accent) 30%, transparent));
-webkit-mask: var(--pensamos-platform-icon) center / contain no-repeat;
mask: var(--pensamos-platform-icon) center / contain no-repeat;
}
.pensamos-course-guide[data-route-theme="work"] .pensamos-course-platform-card:nth-child(4n + 1) .pensamos-course-platform-card__marker {
--pensamos-platform-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 6V5a3 3 0 0 1 6 0v1h3a3 3 0 0 1 3 3v9a3 3 0 0 1-3 3H6a3 3 0 0 1-3-3V9a3 3 0 0 1 3-3h3Zm2 0h2V5a1 1 0 0 0-2 0v1ZM5 11v7a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-7h-5v1a1 1 0 0 1-1 1h-2a1 1 0 0 1-1-1v-1H5Z'/%3E%3C/svg%3E");
}
.pensamos-course-guide[data-route-theme="work"] .pensamos-course-platform-card:nth-child(4n + 2) .pensamos-course-platform-card__marker {
--pensamos-platform-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 2h8l4 4v16H6V2Zm8 2v4h4l-4-4ZM8 11h8v2H8v-2Zm0 4h8v2H8v-2Zm0-8h4v2H8V7Z'/%3E%3C/svg%3E");
}
.pensamos-course-guide[data-route-theme="work"] .pensamos-course-platform-card:nth-child(4n + 3) .pensamos-course-platform-card__marker {
--pensamos-platform-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 0 1 10 10 10 10 0 0 1-1.8 5.7l2.55 2.55-1.42 1.42-2.43-2.43A10 10 0 1 1 12 2Zm0 2c-.8 0-1.62 1.3-2.1 3h4.2C13.62 5.3 12.8 4 12 4ZM7.82 7C8.06 6.1 8.4 5.26 8.82 4.6A8.04 8.04 0 0 0 5.08 7h2.74Zm8.36 0h2.74a8.04 8.04 0 0 0-3.74-2.4c.42.66.76 1.5 1 2.4ZM4.26 9A8.2 8.2 0 0 0 4 12c0 1.05.2 2.07.57 3h3.05A17.7 17.7 0 0 1 7.4 12c0-1.05.08-2.06.22-3H4.26Zm5.38 0c-.16.92-.24 1.93-.24 3s.08 2.08.24 3h4.72c.16-.92.24-1.93.24-3s-.08-2.08-.24-3H9.64Zm6.74 0c.14.94.22 1.95.22 3 0 1.06-.08 2.06-.22 3h3.05A8.2 8.2 0 0 0 20 12c0-1.05-.2-2.07-.57-3h-3.05ZM9.9 17c.48 1.7 1.3 3 2.1 3s1.62-1.3 2.1-3H9.9Z'/%3E%3C/svg%3E");
}
.pensamos-course-guide[data-route-theme="work"] .pensamos-course-platform-card:nth-child(4n) .pensamos-course-platform-card__marker {
--pensamos-platform-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 3h14v18H5V3Zm3 4v2h8V7H8Zm0 4v2h8v-2H8Zm0 4v2h5v-2H8Zm9.7-.7-1.4-1.4-3.3 3.3-1.3-1.3-1.4 1.4 2.7 2.7 4.7-4.7Z'/%3E%3C/svg%3E");
}
.pensamos-course-guide[data-route-theme="study"] .pensamos-course-platform-card:nth-child(4n + 1) .pensamos-course-platform-card__marker {
--pensamos-platform-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 3a4 4 0 0 0-4 4v10a4 4 0 0 0 4 4h1V3H8Zm8 0h-1v18h1a4 4 0 0 0 4-4V7a4 4 0 0 0-4-4Zm-5 0h2v18h-2V3Z'/%3E%3C/svg%3E");
}
.pensamos-course-guide[data-route-theme="study"] .pensamos-course-platform-card:nth-child(4n + 2) .pensamos-course-platform-card__marker {
--pensamos-platform-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 4h7a3 3 0 0 1 3 3v13a3 3 0 0 0-3-2H4V4Zm16 0v14h-7a3 3 0 0 0-3 2V7a3 3 0 0 1 3-3h7Z'/%3E%3C/svg%3E");
}
.pensamos-course-guide[data-route-theme="study"] .pensamos-course-platform-card:nth-child(4n + 3) .pensamos-course-platform-card__marker {
--pensamos-platform-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a7 7 0 0 0-4 12.74V17a2 2 0 0 0 2 2h4a2 2 0 0 0 2-2v-2.26A7 7 0 0 0 12 2Zm-2 19h4v2h-4v-2Z'/%3E%3C/svg%3E");
}
.pensamos-course-guide[data-route-theme="study"] .pensamos-course-platform-card:nth-child(4n) .pensamos-course-platform-card__marker {
--pensamos-platform-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 5V2L7 6.5 12 11V8a5 5 0 1 1-4.58 7H4.26A8 8 0 1 0 12 5Z'/%3E%3C/svg%3E");
}
.pensamos-course-platform-card__copy {
display: grid;
gap: 6px;
min-width: 0;
}
.pensamos-course-platform-card__copy strong {
font-size: 1rem;
line-height: 1.15;
color: #20314f;
}
.pensamos-course-platform-card__copy span {
font-size: 0.93rem;
line-height: 1.5;
color: #607088;
}
.pensamos-course-platform-card__meta {
display: grid;
gap: 8px;
justify-items: end;
text-align: right;
}
.pensamos-course-platform-card__time,
.pensamos-course-platform-card__state {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 28px;
padding: 0 11px;
border-radius: 999px;
font-size: 0.8rem;
font-weight: 800;
line-height: 1;
white-space: nowrap;
}
.pensamos-course-platform-card__time {
background: #eef2f7;
color: #20314f;
}
.pensamos-course-platform-card__state {
background: #f7fafc;
border: 1px solid rgba(214, 224, 236, 0.96);
color: #607088;
}
.pensamos-course-platform-card.is-read .pensamos-course-platform-card__button {
border-color: rgba(210, 231, 160, 0.98);
background: #ffffff;
}
.pensamos-course-platform-card.is-read .pensamos-course-platform-card__marker {
background: #f4ffe7;
color: #117a59;
}
.pensamos-course-platform-card.is-read .pensamos-course-platform-card__marker::before {
content: "\2713";
font-size: 0.96rem;
}
.pensamos-course-platform-card.is-read .pensamos-course-platform-card__state {
background: #f4ffe7;
border-color: rgba(210, 231, 160, 0.98);
color: #117a59;
}
.pensamos-course-resource-columns {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 14px;
}
.pensamos-course-resource-list {
list-style: none;
margin: 0;
padding: 0;
display: grid;
gap: 10px;
}
.pensamos-course-resource-list li {
display: grid;
grid-template-columns: auto 1fr;
gap: 10px;
align-items: start;
padding: 12px 14px;
border-radius: 18px;
background: linear-gradient(180deg, #f8fbfe 0%, #ffffff 100%);
border: 1px solid rgba(222, 231, 241, 0.92);
}
.pensamos-course-resource-check {
display: inline-flex;
align-items: center;
justify-content: center;
width: 20px;
height: 20px;
border-radius: 999px;
background: rgba(79, 124, 255, 0.1);
color: #235d81;
font-weight: 800;
font-size: 0.82rem;
}
.pensamos-course-resource-list strong a {
color: #1f3158;
text-decoration: none;
}
.pensamos-course-resource-list p {
margin: 4px 0 0;
font-size: 0.92rem;
color: #607088;
line-height: 1.48;
}
.pensamos-course-builder {
display: grid;
gap: 14px;
}
.pensamos-course-builder__primary label,
.pensamos-course-builder__block label {
display: block;
margin-bottom: 6px;
font-weight: 700;
color: #20314f;
}
.pensamos-course-builder__primary textarea,
.pensamos-course-builder__block input {
width: 100%;
border-radius: 16px;
border: 1px solid rgba(205, 216, 229, 0.95);
background: linear-gradient(180deg, #ffffff 0%, #f8fbfe 100%);
padding: 12px 14px;
font: inherit;
color: #1f2a44;
box-shadow: inset 0 1px 2px rgba(17, 24, 39, 0.03);
}
.pensamos-course-builder__primary p,
.pensamos-course-builder__example p {
margin: 8px 0 0;
font-size: 0.92rem;
color: #64748b;
line-height: 1.45;
}
.pensamos-course-builder__actions {
display: flex;
flex-wrap: wrap;
gap: 10px;
}
.pensamos-course-button {
border: 0;
cursor: pointer;
}
.pensamos-course-builder__grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 12px;
align-items: stretch;
grid-auto-rows: 1fr;
}
.pensamos-course-builder__block {
display: flex;
flex-direction: column;
align-items: stretch;
gap: 10px;
height: 100%;
padding: 14px;
border-radius: 18px;
background: linear-gradient(180deg, #f8fbfe 0%, #ffffff 100%);
border: 1px solid rgba(222, 231, 241, 0.92);
}
.pensamos-course-builder__block h3 {
margin: 0;
font-size: 0.94rem;
}
.pensamos-course-builder__block-head {
display: flex;
justify-content: space-between;
gap: 10px;
align-items: flex-start;
margin-bottom: 0;
}
.pensamos-course-builder__block-head .pensamos-text-link {
display: inline-flex;
align-items: center;
justify-content: center;
flex: 0 0 auto;
min-height: 32px;
padding: 0 12px;
border: 1px solid rgba(207, 219, 233, 0.92);
border-radius: 999px;
background: rgba(255, 255, 255, 0.94);
color: #245d81;
font-size: 0.82rem;
font-weight: 800;
line-height: 1;
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.86);
}
.pensamos-course-builder__block-head .pensamos-text-link:hover,
.pensamos-course-builder__block-head .pensamos-text-link:focus-visible {
border-color: rgba(79, 124, 255, 0.34);
background: rgba(79, 124, 255, 0.08);
color: #1f3158;
}
.pensamos-course-platform-card__button.is-loading {
cursor: progress;
position: relative;
}
.pensamos-course-platform-card__button.is-loading::after {
content: "";
position: absolute;
top: 14px;
right: 14px;
width: 18px;
height: 18px;
border: 2px solid rgba(15, 99, 184, 0.18);
border-top-color: var(--pensamos-primary, #0f63b8);
border-radius: 999px;
animation: pensamos-course-card-spin 720ms linear infinite;
pointer-events: none;
z-index: 3;
}
@keyframes pensamos-course-card-spin {
to { transform: rotate(360deg); }
}
.pensamos-course-guide.is-navigating {
cursor: progress;
}
.pensamos-course-guide.is-navigating .pensamos-course-platform-card__button:not(.is-loading),
.pensamos-course-guide.is-navigating .pensamos-route-tracker__nav-item:not(.is-loading),
.pensamos-course-guide.is-navigating .pensamos-route-tracker__subnav-item,
.pensamos-course-guide.is-navigating .pensamos-route-tracker__subnav-site {
pointer-events: none;
opacity: 0.55;
}
.pensamos-course-platform-card[data-section-id="definir-puestos-objetivo"],
.pensamos-course-platform-card[data-section-id="filtrar-mejor"],
.pensamos-course-platform-card[data-section-id="aplicar-y-seguir"] {
display: none;
}
.pensamos-course-guide__layout.is-focus-mode .pensamos-course-block {
padding: 24px;
border-radius: 28px;
}
.pensamos-course-guide__layout.is-focus-mode .pensamos-course-block__head {
margin-bottom: 14px;
}
.pensamos-course-guide__layout.is-focus-mode .pensamos-course-block__head .pensamos-course-breadcrumb {
display: flex;
width: 100%;
margin-bottom: 10px;
}
.pensamos-course-guide__layout.is-focus-mode .pensamos-course-block__head > div {
display: block;
width: 100%;
}
.pensamos-course-guide__layout.is-focus-mode .pensamos-course-block__head .pensamos-eyebrow {
margin-bottom: 8px;
}
.pensamos-course-guide__layout.is-focus-mode .pensamos-route-tracker__steps {
gap: 12px;
}
.pensamos-course-guide__layout.is-focus-mode .pensamos-route-tracker__step {
padding: 16px;
gap: 14px;
}
.pensamos-course-guide__layout.is-focus-mode .pensamos-route-tracker__step-plan {
gap: 12px;
}
.pensamos-course-guide__layout.is-focus-mode .pensamos-route-tracker__step-marker {
width: 32px;
height: 32px;
border-radius: 10px;
}
.pensamos-course-guide__layout.is-focus-mode .pensamos-route-tracker__step-copy {
gap: 4px;
}
.pensamos-course-guide__layout.is-focus-mode .pensamos-route-tracker__step-copy strong {
padding-bottom: 4px;
}
.pensamos-course-guide__layout.is-focus-mode .pensamos-route-tracker__step-meta {
margin-top: 8px;
padding-left: 44px;
gap: 6px;
}
.pensamos-course-guide__layout.is-focus-mode .pensamos-route-tracker__step-tip {
padding: 8px 12px;
}
.pensamos-course-guide__layout.is-focus-mode .pensamos-course-card-grid {
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 8px;
align-items: stretch;
}
.pensamos-course-guide__layout.is-focus-mode .pensamos-course-block--compact-route .pensamos-route-tracker__step {
height: 100%;
grid-template-columns: minmax(0, 1fr);
padding: 10px;
gap: 8px;
align-content: start;
border-radius: 18px;
}
.pensamos-course-guide__layout.is-focus-mode .pensamos-course-block--compact-route .pensamos-route-tracker__step-main {
gap: 0;
}
.pensamos-course-guide__layout.is-focus-mode .pensamos-course-block--compact-route .pensamos-route-tracker__step-plan {
gap: 8px;
}
.pensamos-course-guide__layout.is-focus-mode .pensamos-course-block--compact-route .pensamos-route-tracker__step-marker {
width: 28px;
height: 28px;
border-radius: 8px;
font-size: 0.88rem;
}
.pensamos-course-guide__layout.is-focus-mode .pensamos-course-block--compact-route .pensamos-route-tracker__step-copy {
gap: 2px;
}
.pensamos-course-guide__layout.is-focus-mode .pensamos-course-block--compact-route .pensamos-route-tracker__step-copy strong {
padding-bottom: 2px;
font-size: 0.95rem;
line-height: 1.14;
}
.pensamos-course-guide__layout.is-focus-mode .pensamos-course-block--compact-route .pensamos-route-tracker__step-copy strong::after {
width: 38px;
height: 2px;
}
.pensamos-course-guide__layout.is-focus-mode .pensamos-course-block--compact-route .pensamos-route-tracker__step-copy span {
display: -webkit-box;
font-size: 0.8rem;
line-height: 1.32;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
}
.pensamos-course-guide__layout.is-focus-mode .pensamos-course-block--compact-route .pensamos-route-tracker__step-meta {
margin-top: 4px;
padding-left: 36px;
gap: 5px;
}
.pensamos-course-guide__layout.is-focus-mode .pensamos-course-block--compact-route .pensamos-route-tracker__meta-pill {
min-height: 28px;
padding: 0 10px;
font-size: 0.75rem;
}
.pensamos-course-guide__layout.is-focus-mode .pensamos-course-block--compact-route .pensamos-route-tracker__step-tip {
display: -webkit-box;
padding: 6px 9px;
font-size: 0.76rem;
line-height: 1.34;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
overflow: hidden;
border-radius: 16px;
}
.pensamos-course-guide__layout.is-focus-mode .pensamos-course-block--compact-route .pensamos-route-tracker__step-actions {
margin-top: auto;
align-items: stretch;
padding-top: 0;
}
.pensamos-course-guide__layout.is-focus-mode .pensamos-course-block--compact-route .pensamos-route-tracker__step-action {
width: 100%;
min-height: 34px;
padding: 0 9px;
font-size: 0.78rem;
border-radius: 12px;
}
.pensamos-course-guide__layout.is-focus-mode .pensamos-course-walkthrough--compact-route .pensamos-course-platform-card__button {
--pensamos-compact-card-border: #aee0ff;
--pensamos-compact-card-soft: #eef8ff;
--pensamos-compact-card-badge-start: #6cd6ff;
--pensamos-compact-card-badge-end: #3dbaf3;
--pensamos-compact-card-shadow: rgba(61, 186, 243, 0.16);
grid-template-columns: auto minmax(0, 1fr);
gap: 8px;
min-height: 116px;
padding: 10px;
border: 1px solid var(--pensamos-compact-card-border);
border-radius: 18px;
align-content: start;
background:
radial-gradient(circle at top right, color-mix(in srgb, var(--pensamos-compact-card-shadow) 88%, transparent), transparent 46%),
linear-gradient(180deg, color-mix(in srgb, var(--pensamos-compact-card-soft) 86%, white) 0%, rgba(255, 255, 255, 1) 100%);
box-shadow: 0 10px 24px color-mix(in srgb, var(--pensamos-compact-card-shadow) 32%, rgba(13, 28, 49, 0.04));
}
.pensamos-course-guide__layout.is-focus-mode .pensamos-course-walkthrough--compact-route .pensamos-course-platform-card:nth-child(4n + 1) .pensamos-course-platform-card__button {
--pensamos-compact-card-border: #aee0ff;
--pensamos-compact-card-soft: #eef8ff;
--pensamos-compact-card-badge-start: #6cd6ff;
--pensamos-compact-card-badge-end: #3dbaf3;
--pensamos-compact-card-shadow: rgba(61, 186, 243, 0.16);
}
.pensamos-course-guide__layout.is-focus-mode .pensamos-course-walkthrough--compact-route .pensamos-course-platform-card:nth-child(4n + 2) .pensamos-course-platform-card__button {
--pensamos-compact-card-border: #cce97a;
--pensamos-compact-card-soft: #f7ffe8;
--pensamos-compact-card-badge-start: #7be51a;
--pensamos-compact-card-badge-end: #58cc02;
--pensamos-compact-card-shadow: rgba(88, 204, 2, 0.16);
}
.pensamos-course-guide__layout.is-focus-mode .pensamos-course-walkthrough--compact-route .pensamos-course-platform-card:nth-child(4n + 3) .pensamos-course-platform-card__button {
--pensamos-compact-card-border: #ffd36b;
--pensamos-compact-card-soft: #fff8e5;
--pensamos-compact-card-badge-start: #ffd055;
--pensamos-compact-card-badge-end: #ffb92f;
--pensamos-compact-card-shadow: rgba(255, 185, 47, 0.18);
}
.pensamos-course-guide__layout.is-focus-mode .pensamos-course-walkthrough--compact-route .pensamos-course-platform-card:nth-child(4n) .pensamos-course-platform-card__button {
--pensamos-compact-card-border: #ffc2d1;
--pensamos-compact-card-soft: #fff2f7;
--pensamos-compact-card-badge-start: #ff8cab;
--pensamos-compact-card-badge-end: #ff6b95;
--pensamos-compact-card-shadow: rgba(255, 107, 149, 0.18);
}
.pensamos-course-guide__layout.is-focus-mode .pensamos-course-walkthrough--compact-route .pensamos-course-platform-card__marker {
width: 28px;
height: 28px;
border-radius: 0;
background: transparent;
color: var(--pensamos-compact-card-badge-end);
font-size: 0.88rem;
font-weight: 800;
line-height: 1;
box-shadow: none;
}
.pensamos-course-guide__layout.is-focus-mode .pensamos-course-walkthrough--compact-route .pensamos-course-platform-card__marker::before {
content: none;
}
.pensamos-course-guide[data-route-theme] .pensamos-course-guide__layout.is-focus-mode .pensamos-course-walkthrough--compact-route .pensamos-course-platform-card__marker {
--pensamos-platform-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 6V5a3 3 0 0 1 6 0v1h3a3 3 0 0 1 3 3v9a3 3 0 0 1-3 3H6a3 3 0 0 1-3-3V9a3 3 0 0 1 3-3h3Zm2 0h2V5a1 1 0 0 0-2 0v1ZM5 11v7a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-7h-5v1a1 1 0 0 1-1 1h-2a1 1 0 0 1-1-1v-1H5Z'/%3E%3C/svg%3E");
font-size: 0;
}
.pensamos-course-guide[data-route-theme] .pensamos-course-guide__layout.is-focus-mode .pensamos-course-walkthrough--compact-route .pensamos-course-platform-card__marker::before {
content: "";
display: block;
width: 18px;
height: 18px;
background: currentColor;
filter: drop-shadow(0 1px 1px color-mix(in srgb, var(--pensamos-compact-card-badge-end) 32%, transparent));
-webkit-mask: var(--pensamos-platform-icon) center / contain no-repeat;
mask: var(--pensamos-platform-icon) center / contain no-repeat;
}
.pensamos-course-guide[data-route-theme="work"] .pensamos-course-guide__layout.is-focus-mode .pensamos-course-walkthrough--compact-route .pensamos-course-platform-card:nth-child(4n + 1) .pensamos-course-platform-card__marker {
--pensamos-platform-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 6V5a3 3 0 0 1 6 0v1h3a3 3 0 0 1 3 3v9a3 3 0 0 1-3 3H6a3 3 0 0 1-3-3V9a3 3 0 0 1 3-3h3Zm2 0h2V5a1 1 0 0 0-2 0v1ZM5 11v7a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-7h-5v1a1 1 0 0 1-1 1h-2a1 1 0 0 1-1-1v-1H5Z'/%3E%3C/svg%3E");
}
.pensamos-course-guide[data-route-theme="work"] .pensamos-course-guide__layout.is-focus-mode .pensamos-course-walkthrough--compact-route .pensamos-course-platform-card:nth-child(4n + 2) .pensamos-course-platform-card__marker {
--pensamos-platform-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 2h8l4 4v16H6V2Zm8 2v4h4l-4-4ZM8 11h8v2H8v-2Zm0 4h8v2H8v-2Zm0-8h4v2H8V7Z'/%3E%3C/svg%3E");
}
.pensamos-course-guide[data-route-theme="work"] .pensamos-course-guide__layout.is-focus-mode .pensamos-course-walkthrough--compact-route .pensamos-course-platform-card:nth-child(4n + 3) .pensamos-course-platform-card__marker {
--pensamos-platform-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 0 1 10 10 10 10 0 0 1-1.8 5.7l2.55 2.55-1.42 1.42-2.43-2.43A10 10 0 1 1 12 2Zm0 2c-.8 0-1.62 1.3-2.1 3h4.2C13.62 5.3 12.8 4 12 4ZM7.82 7C8.06 6.1 8.4 5.26 8.82 4.6A8.04 8.04 0 0 0 5.08 7h2.74Zm8.36 0h2.74a8.04 8.04 0 0 0-3.74-2.4c.42.66.76 1.5 1 2.4ZM4.26 9A8.2 8.2 0 0 0 4 12c0 1.05.2 2.07.57 3h3.05A17.7 17.7 0 0 1 7.4 12c0-1.05.08-2.06.22-3H4.26Zm5.38 0c-.16.92-.24 1.93-.24 3s.08 2.08.24 3h4.72c.16-.92.24-1.93.24-3s-.08-2.08-.24-3H9.64Zm6.74 0c.14.94.22 1.95.22 3 0 1.06-.08 2.06-.22 3h3.05A8.2 8.2 0 0 0 20 12c0-1.05-.2-2.07-.57-3h-3.05ZM9.9 17c.48 1.7 1.3 3 2.1 3s1.62-1.3 2.1-3H9.9Z'/%3E%3C/svg%3E");
}
.pensamos-course-guide[data-route-theme="work"] .pensamos-course-guide__layout.is-focus-mode .pensamos-course-walkthrough--compact-route .pensamos-course-platform-card:nth-child(4n) .pensamos-course-platform-card__marker {
--pensamos-platform-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 3h14v18H5V3Zm3 4v2h8V7H8Zm0 4v2h8v-2H8Zm0 4v2h5v-2H8Zm9.7-.7-1.4-1.4-3.3 3.3-1.3-1.3-1.4 1.4 2.7 2.7 4.7-4.7Z'/%3E%3C/svg%3E");
}
.pensamos-course-guide[data-route-theme="study"] .pensamos-course-guide__layout.is-focus-mode .pensamos-course-walkthrough--compact-route .pensamos-course-platform-card:nth-child(4n + 1) .pensamos-course-platform-card__marker {
--pensamos-platform-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 3a4 4 0 0 0-4 4v10a4 4 0 0 0 4 4h1V3H8Zm8 0h-1v18h1a4 4 0 0 0 4-4V7a4 4 0 0 0-4-4Zm-5 0h2v18h-2V3Z'/%3E%3C/svg%3E");
}
.pensamos-course-guide[data-route-theme="study"] .pensamos-course-guide__layout.is-focus-mode .pensamos-course-walkthrough--compact-route .pensamos-course-platform-card:nth-child(4n + 2) .pensamos-course-platform-card__marker {
--pensamos-platform-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 4h7a3 3 0 0 1 3 3v13a3 3 0 0 0-3-2H4V4Zm16 0v14h-7a3 3 0 0 0-3 2V7a3 3 0 0 1 3-3h7Z'/%3E%3C/svg%3E");
}
.pensamos-course-guide[data-route-theme="study"] .pensamos-course-guide__layout.is-focus-mode .pensamos-course-walkthrough--compact-route .pensamos-course-platform-card:nth-child(4n + 3) .pensamos-course-platform-card__marker {
--pensamos-platform-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a7 7 0 0 0-4 12.74V17a2 2 0 0 0 2 2h4a2 2 0 0 0 2-2v-2.26A7 7 0 0 0 12 2Zm-2 19h4v2h-4v-2Z'/%3E%3C/svg%3E");
}
.pensamos-course-guide[data-route-theme="study"] .pensamos-course-guide__layout.is-focus-mode .pensamos-course-walkthrough--compact-route .pensamos-course-platform-card:nth-child(4n) .pensamos-course-platform-card__marker {
--pensamos-platform-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 5V2L7 6.5 12 11V8a5 5 0 1 1-4.58 7H4.26A8 8 0 1 0 12 5Z'/%3E%3C/svg%3E");
}
.pensamos-course-platform-card__marker[data-course-platform-icon="briefcase"],
.pensamos-course-walkthrough__modal-icon[data-course-platform-icon="briefcase"] {
--pensamos-card-item-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 6V5a3 3 0 0 1 6 0v1h3a3 3 0 0 1 3 3v9a3 3 0 0 1-3 3H6a3 3 0 0 1-3-3V9a3 3 0 0 1 3-3h3Zm2 0h2V5a1 1 0 0 0-2 0v1ZM5 11v7a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-7h-5v1a1 1 0 0 1-1 1h-2a1 1 0 0 1-1-1v-1H5Z'/%3E%3C/svg%3E");
}
.pensamos-course-platform-card__marker[data-course-platform-icon="network"],
.pensamos-course-walkthrough__modal-icon[data-course-platform-icon="network"] {
--pensamos-card-item-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 5a3 3 0 1 1 2.83 4H10a4 4 0 0 1 3.74 2.58A3 3 0 0 1 17 11a3 3 0 1 1-2.93 3.67A2 2 0 0 0 12 13H9.46A4 4 0 0 1 6 15a4 4 0 1 0 4 4H8a2 2 0 1 1-2-2c.73 0 1.37.4 1.72 1h2.44A4 4 0 0 0 6 13a2 2 0 0 1 0-4 3 3 0 0 1 1-4Zm11 8a1 1 0 1 0 0 2 1 1 0 0 0 0-2ZM7 7a1 1 0 1 0 2 0 1 1 0 0 0-2 0Z'/%3E%3C/svg%3E");
}
.pensamos-course-platform-card__marker[data-course-platform-icon="search"],
.pensamos-course-walkthrough__modal-icon[data-course-platform-icon="search"] {
--pensamos-card-item-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10.5 3a7.5 7.5 0 0 1 5.92 12.1l4.24 4.24-1.42 1.42-4.24-4.24A7.5 7.5 0 1 1 10.5 3Zm0 2a5.5 5.5 0 1 0 0 11 5.5 5.5 0 0 0 0-11Zm-2 4h4v2h-4V9Z'/%3E%3C/svg%3E");
}
.pensamos-course-platform-card__marker[data-course-platform-icon="reviews"],
.pensamos-course-walkthrough__modal-icon[data-course-platform-icon="reviews"] {
--pensamos-card-item-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 4h16v11H8l-4 4V4Zm2 2v8.17L7.17 13H18V6H6Zm6 1.2 1.18 2.38 2.62.38-1.9 1.85.45 2.61L12 13.18 9.65 14.42l.45-2.61-1.9-1.85 2.62-.38L12 7.2Z'/%3E%3C/svg%3E");
}
.pensamos-course-platform-card__marker[data-course-platform-icon="document"],
.pensamos-course-walkthrough__modal-icon[data-course-platform-icon="document"] {
--pensamos-card-item-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 2h9l4 4v16H6V2Zm8 2v4h4l-4-4ZM8 11h8v2H8v-2Zm0 4h8v2H8v-2Zm0-8h4v2H8V7Z'/%3E%3C/svg%3E");
}
.pensamos-course-platform-card__marker[data-course-platform-icon="bolt"],
.pensamos-course-walkthrough__modal-icon[data-course-platform-icon="bolt"] {
--pensamos-card-item-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M13 2 4 14h7l-1 8 10-13h-7l0-7Z'/%3E%3C/svg%3E");
}
.pensamos-course-platform-card__marker[data-course-platform-icon="radar"],
.pensamos-course-walkthrough__modal-icon[data-course-platform-icon="radar"] {
--pensamos-card-item-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 20a8 8 0 1 1 5.66-13.66l-1.42 1.42A6 6 0 1 0 18 12h2a8 8 0 0 1-8 8Zm0-4a4 4 0 1 1 2.83-6.83l-1.42 1.42A2 2 0 1 0 14 12h2a4 4 0 0 1-4 4Zm0-3a1 1 0 1 1 .71-1.71L21 3l1 1-8.29 8.29A1 1 0 0 1 12 13Z'/%3E%3C/svg%3E");
}
.pensamos-course-platform-card__marker[data-course-platform-icon="map"],
.pensamos-course-walkthrough__modal-icon[data-course-platform-icon="map"] {
--pensamos-card-item-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a7 7 0 0 1 7 7c0 5.25-7 13-7 13S5 14.25 5 9a7 7 0 0 1 7-7Zm0 2a5 5 0 0 0-5 5c0 2.7 2.8 6.82 5 9.44C14.2 15.82 17 11.7 17 9a5 5 0 0 0-5-5Zm0 3a2 2 0 1 1 0 4 2 2 0 0 1 0-4Z'/%3E%3C/svg%3E");
}
.pensamos-course-platform-card__marker[data-course-platform-icon="target"],
.pensamos-course-walkthrough__modal-icon[data-course-platform-icon="target"] {
--pensamos-card-item-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 1 0 10 10h-2a8 8 0 1 1-8-8V2Zm0 4a6 6 0 1 0 6 6h-2a4 4 0 1 1-4-4V6Zm0 4a2 2 0 1 0 2 2h-2v-2Zm4-8v4h4l-7 7-1.4-1.4 7-7H16V2Z'/%3E%3C/svg%3E");
}
.pensamos-course-platform-card__marker[data-course-platform-icon="list"],
.pensamos-course-walkthrough__modal-icon[data-course-platform-icon="list"] {
--pensamos-card-item-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 5h14v2H5V5Zm0 6h14v2H5v-2Zm0 6h9v2H5v-2Zm13.7-1.7 1.4 1.4-4.6 4.6-2.6-2.6 1.4-1.4 1.2 1.2 3.2-3.2Z'/%3E%3C/svg%3E");
}
.pensamos-course-platform-card__marker[data-course-platform-icon="saved"],
.pensamos-course-walkthrough__modal-icon[data-course-platform-icon="saved"] {
--pensamos-card-item-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 3h12a2 2 0 0 1 2 2v16l-8-4-8 4V5a2 2 0 0 1 2-2Zm0 2v12.76l6-3 6 3V5H6Zm3 4h6v2H9V9Zm0 4h4v2H9v-2Z'/%3E%3C/svg%3E");
}
.pensamos-course-platform-card__marker[data-course-platform-icon="spark"],
.pensamos-course-walkthrough__modal-icon[data-course-platform-icon="spark"] {
--pensamos-card-item-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2 9.7 8.7 3 11l6.7 2.3L12 20l2.3-6.7L21 11l-6.7-2.3L12 2Zm7 14-1 3-3 1 3 1 1 3 1-3 3-1-3-1-1-3ZM5 3 4 6 1 7l3 1 1 3 1-3 3-1-3-1-1-3Z'/%3E%3C/svg%3E");
}
.pensamos-course-walkthrough__modal-section[data-course-section-icon="list"] {
--pensamos-section-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 5h14v2H5V5Zm0 6h14v2H5v-2Zm0 6h9v2H5v-2Zm13.7-1.7 1.4 1.4-4.6 4.6-2.6-2.6 1.4-1.4 1.2 1.2 3.2-3.2Z'/%3E%3C/svg%3E");
}
.pensamos-course-walkthrough__modal-section[data-course-section-icon="search"] {
--pensamos-section-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10.5 3a7.5 7.5 0 0 1 5.92 12.1l4.24 4.24-1.42 1.42-4.24-4.24A7.5 7.5 0 1 1 10.5 3Zm0 2a5.5 5.5 0 1 0 0 11 5.5 5.5 0 0 0 0-11Zm-2 4h4v2h-4V9Z'/%3E%3C/svg%3E");
}
.pensamos-course-walkthrough__modal-section[data-course-section-icon="target"] {
--pensamos-section-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 1 0 10 10h-2a8 8 0 1 1-8-8V2Zm0 4a6 6 0 1 0 6 6h-2a4 4 0 1 1-4-4V6Zm0 4a2 2 0 1 0 2 2h-2v-2Zm4-8v4h4l-7 7-1.4-1.4 7-7H16V2Z'/%3E%3C/svg%3E");
}
.pensamos-course-walkthrough__modal-section[data-course-section-icon="spark"] {
--pensamos-section-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2 9.7 8.7 3 11l6.7 2.3L12 20l2.3-6.7L21 11l-6.7-2.3L12 2Zm7 14-1 3-3 1 3 1 1 3 1-3 3-1-3-1-1-3ZM5 3 4 6 1 7l3 1 1 3 1-3 3-1-3-1-1-3Z'/%3E%3C/svg%3E");
}
.pensamos-course-walkthrough__modal-section[data-course-section-icon="alert"] {
--pensamos-section-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2 1 21h22L12 2Zm0 4 7.53 13H4.47L12 6Zm-1 4h2v5h-2v-5Zm0 6h2v2h-2v-2Z'/%3E%3C/svg%3E");
}
.pensamos-course-guide[data-route-theme] .pensamos-course-guide__layout.is-focus-mode .pensamos-course-walkthrough--compact-route .pensamos-course-platform-card .pensamos-course-platform-card__marker[data-course-platform-icon],
.pensamos-course-platform-card__marker--icon[data-course-platform-icon],
.pensamos-course-walkthrough__modal-icon[data-course-platform-icon] {
--pensamos-platform-icon: var(--pensamos-card-item-icon, url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 6V5a3 3 0 0 1 6 0v1h3a3 3 0 0 1 3 3v9a3 3 0 0 1-3 3H6a3 3 0 0 1-3-3V9a3 3 0 0 1 3-3h3Zm2 0h2V5a1 1 0 0 0-2 0v1ZM5 11v7a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-7h-5v1a1 1 0 0 1-1 1h-2a1 1 0 0 1-1-1v-1H5Z'/%3E%3C/svg%3E"));
}
.pensamos-course-platform-card__marker--icon {
border-radius: 0;
background: transparent;
color: var(--pensamos-compact-card-badge-end, var(--pensamos-platform-accent, #3dbaf3));
box-shadow: none;
font-size: 0;
}
.pensamos-course-guide__layout.is-focus-mode .pensamos-course-walkthrough--compact-route .pensamos-course-platform-card__marker--icon::before,
.pensamos-course-platform-card__marker--icon::before {
content: "";
display: block;
width: 19px;
height: 19px;
background: currentColor;
filter: drop-shadow(0 1px 1px color-mix(in srgb, currentColor 30%, transparent));
-webkit-mask: var(--pensamos-platform-icon) center / contain no-repeat;
mask: var(--pensamos-platform-icon) center / contain no-repeat;
}
.pensamos-course-walkthrough__modal-head.has-modal-icon {
padding-left: 82px;
background:
radial-gradient(circle at 36px 36px, rgba(108, 214, 255, 0.24), transparent 58px),
#ffffff;
}
.pensamos-course-walkthrough__modal-icon {
position: absolute;
left: 22px;
top: 22px;
display: inline-flex;
align-items: center;
justify-content: center;
width: 42px;
height: 42px;
color: #249bd8;
}
.pensamos-course-walkthrough__modal-icon::before {
content: "";
display: block;
width: 30px;
height: 30px;
background: currentColor;
filter: drop-shadow(0 2px 3px rgba(36, 155, 216, 0.18));
-webkit-mask: var(--pensamos-platform-icon) center / contain no-repeat;
mask: var(--pensamos-platform-icon) center / contain no-repeat;
}
.pensamos-course-walkthrough__modal-body .pensamos-course-walkthrough__modal-section[data-course-section-icon]::before {
content: "";
background: currentColor;
color: #3dbaf3;
box-shadow: none;
-webkit-mask: var(--pensamos-section-icon) center / 23px 23px no-repeat;
mask: var(--pensamos-section-icon) center / 23px 23px no-repeat;
}
.pensamos-course-walkthrough__modal-body .pensamos-course-walkthrough__modal-section[data-course-section-icon="target"]::before {
color: #58cc02;
}
.pensamos-course-walkthrough__modal-body .pensamos-course-walkthrough__modal-section[data-course-section-icon="spark"]::before {
color: #ffbf2f;
}
.pensamos-course-walkthrough__modal-body .pensamos-course-walkthrough__modal-section[data-course-section-icon="alert"]::before {
color: #ff6b95;
}
@media (max-width: 560px) {
.pensamos-course-walkthrough__modal-head.has-modal-icon {
padding-left: 64px;
}
.pensamos-course-walkthrough__modal-icon {
left: 16px;
top: 18px;
width: 34px;
height: 34px;
}
.pensamos-course-walkthrough__modal-icon::before {
width: 24px;
height: 24px;
}
}
.pensamos-course-guide__layout.is-focus-mode .pensamos-course-walkthrough--compact-route .pensamos-course-platform-card__copy {
gap: 2px;
}
.pensamos-course-guide__layout.is-focus-mode .pensamos-course-walkthrough--compact-route .pensamos-course-platform-card__inner-titles {
padding-top: 10px;
padding-bottom: 10px;
}
.pensamos-course-guide__layout.is-focus-mode .pensamos-course-walkthrough--compact-route .pensamos-course-platform-card__copy strong {
font-size: 0.95rem;
line-height: 1.14;
}
.pensamos-course-guide__layout.is-focus-mode .pensamos-course-walkthrough--compact-route .pensamos-course-platform-card__copy span {
display: -webkit-box;
min-height: calc(0.8rem * 1.32 * 2);
font-size: 0.8rem;
line-height: 1.32;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
}
.pensamos-course-guide__layout.is-focus-mode .pensamos-course-walkthrough--compact-route .pensamos-course-platform-card__meta {
grid-column: 2;
grid-template-columns: repeat(3, auto);
justify-content: end;
justify-items: end;
text-align: right;
gap: 6px;
margin-top: 4px;
}
.pensamos-course-guide__layout.is-focus-mode .pensamos-course-walkthrough--compact-route .pensamos-course-platform-card__time,
.pensamos-course-guide__layout.is-focus-mode .pensamos-course-walkthrough--compact-route .pensamos-course-platform-card__state,
.pensamos-course-guide__layout.is-focus-mode .pensamos-course-walkthrough--compact-route .pensamos-course-platform-card__test-cta {
min-height: 28px;
padding: 0 10px;
font-size: 0.75rem;
}
.pensamos-course-guide__layout.is-focus-mode .pensamos-course-walkthrough--compact-route .pensamos-course-platform-card__time {
border: 1px solid var(--pensamos-compact-card-border);
background: color-mix(in srgb, var(--pensamos-compact-card-soft) 84%, white);
color: #20314f;
}
.pensamos-course-guide__layout.is-focus-mode .pensamos-course-walkthrough--compact-route .pensamos-course-platform-card__state {
border: 1px solid var(--pensamos-compact-card-border);
background: color-mix(in srgb, var(--pensamos-compact-card-soft) 90%, white);
color: #607088;
}
.pensamos-course-guide__layout.is-focus-mode .pensamos-course-walkthrough--compact-route .pensamos-course-platform-card__test-cta {
display: inline-flex;
align-items: center;
justify-content: center;
border: 1px solid transparent;
border-radius: 999px;
background: linear-gradient(135deg, #111827 0%, #243b62 100%);
color: #fff;
font-weight: 800;
box-shadow: 0 10px 18px rgba(17, 24, 39, 0.12);
}
.pensamos-course-guide__layout.is-focus-mode #puntos-revisión .pensamos-course-guidance-columns {
gap: 14px;
}
.pensamos-course-guide__layout.is-focus-mode #puntos-revisión .pensamos-course-guidance-column {
gap: 12px;
}
.pensamos-course-guide__layout.is-focus-mode #puntos-revisión .pensamos-course-guidance-card {
gap: 12px;
padding: 16px;
border-radius: 20px;
}
.pensamos-course-guide__layout.is-focus-mode #puntos-revisión .pensamos-course-guidance-card__head {
gap: 10px;
}
.pensamos-course-guide__layout.is-focus-mode #puntos-revisión .pensamos-course-guidance-card__index {
min-width: 30px;
height: 30px;
border-radius: 10px;
font-size: 0.72rem;
}
.pensamos-course-guide__layout.is-focus-mode #puntos-revisión .pensamos-course-guidance-card h3 {
font-size: 0.96rem;
}
.pensamos-course-guide__layout.is-focus-mode #puntos-revisión .pensamos-course-guidance-list {
gap: 8px;
}
.pensamos-course-guide__layout.is-focus-mode #puntos-revisión .pensamos-course-guidance-list__item {
gap: 8px;
font-size: 0.84rem;
line-height: 1.4;
}
.pensamos-course-guide__layout.is-focus-mode #puntos-revisión .pensamos-course-guidance-list__item::before {
width: 8px;
height: 8px;
margin-top: 0.3rem;
}
@media (max-width: 1280px) {
.pensamos-course-guide__layout.is-focus-mode .pensamos-course-card-grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 10px;
}
}
@media (max-width: 820px) {
.pensamos-course-guide__layout.is-focus-mode .pensamos-course-card-grid {
grid-template-columns: 1fr;
gap: 10px;
}
.pensamos-course-guide__layout.is-focus-mode .pensamos-course-block--compact-route .pensamos-route-tracker__step-meta {
padding-left: 0;
}
.pensamos-course-guide__layout.is-focus-mode .pensamos-course-walkthrough--compact-route .pensamos-course-platform-card__meta {
grid-column: 1 / -1;
grid-template-columns: auto minmax(0, 1fr);
justify-content: start;
justify-items: start;
text-align: left;
gap: 8px 10px;
}
.pensamos-course-guide__layout.is-focus-mode .pensamos-course-walkthrough--compact-route .pensamos-course-platform-card__test-cta {
min-height: 36px;
padding-inline: 14px;
font-size: 0.8rem;
box-shadow: 0 10px 20px rgba(17, 24, 39, 0.12);
}
.pensamos-course-guide__layout.is-focus-mode .pensamos-course-walkthrough--compact-route .pensamos-course-platform-card__state {
align-self: center;
min-height: 24px;
padding-inline: 0;
border: 0;
background: transparent;
}
.pensamos-course-guide__layout.is-focus-mode .pensamos-course-walkthrough--compact-route .pensamos-course-walkthrough__actions .pensamos-course-button.pensamarket-auth__button,
.pensamos-course-guide__layout.is-focus-mode .pensamos-course-walkthrough--compact-route .pensamos-course-walkthrough__actions .pensamos-course-button.pensamarket-auth__button:visited {
min-height: 36px;
padding-inline: 14px;
font-size: 0.8rem;
box-shadow: 0 10px 20px rgba(17, 24, 39, 0.12);
}
.pensamos-course-outcome-matrix {
align-items: flex-start;
flex-direction: column;
}
}
.pensamos-course-chip-group {
display: flex;
flex-wrap: wrap;
gap: 8px;
}
.pensamos-course-chip {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 36px;
padding: 0 12px;
border-radius: 999px;
border: 1px solid rgba(203, 214, 228, 0.95);
background: rgba(248, 251, 255, 0.95);
color: #334155;
font-weight: 700;
font-size: 0.84rem;
cursor: pointer;
transition: transform 160ms ease, box-shadow 160ms ease, border-color 160ms ease, background 160ms ease;
}
.pensamos-course-chip:hover,
.pensamos-course-chip:focus-visible,
.pensamos-course-chip.is-active {
border-color: rgba(35, 93, 129, 0.3);
background: rgba(35, 93, 129, 0.08);
box-shadow: 0 10px 24px rgba(13, 28, 49, 0.06);
transform: translateY(-1px);
}
.pensamos-course-builder__example {
padding: 18px;
border: 1px solid rgba(214, 224, 236, 0.92);
border-radius: 18px;
background: rgba(255, 255, 255, 0.92);
box-shadow: 0 16px 42px rgba(20, 32, 48, 0.08);
}
.pensamos-course-builder__example h3 {
margin: 0;
font-size: 1rem;
color: #172033;
}
.pensamos-course-builder__example pre {
margin: 12px 0;
padding: 14px;
overflow-x: auto;
white-space: pre-wrap;
border-radius: 14px;
background: #f8fbff;
color: #172033;
font: 0.88rem/1.5 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}
.juego-memoria-modal {
position: fixed;
inset: 0;
z-index: 100000;
display: flex;
align-items: center;
justify-content: center;
padding: 16px;
}
.juego-memoria-modal[hidden] {
display: none;
}
.juego-memoria__backdrop {
position: absolute;
inset: 0;
background: rgba(10, 20, 40, 0.55);
backdrop-filter: blur(2px);
}
.juego-memoria__dialog {
position: relative;
width: min(640px, 100%);
max-height: calc(100vh - 32px);
overflow-y: auto;
background: #ffffff;
border-radius: 18px;
box-shadow: 0 24px 60px rgba(10, 20, 40, 0.35);
padding: 26px 26px 24px;
}
.juego-memoria-modal .juego-memoria__close {
position: absolute;
top: 12px;
right: 12px;
display: flex;
align-items: center;
justify-content: center;
width: 34px;
height: 34px;
min-width: 0;
padding: 0;
margin: 0;
border: none;
background: none;
box-shadow: none;
font-size: 1.5rem;
line-height: 1;
color: var(--pensamos-ink, #1f2a44);
cursor: pointer;
border-radius: 8px;
}
.juego-memoria-modal .juego-memoria__close:hover,
.juego-memoria-modal .juego-memoria__close:focus-visible {
background: none;
color: var(--pensamos-deep, #0d1c31);
}
.juego-memoria__eyebrow {
display: inline-block;
font-size: 0.72rem;
font-weight: 800;
letter-spacing: 0.06em;
text-transform: uppercase;
color: var(--pensamos-highlight, #0f6f68);
background: color-mix(in srgb, var(--pensamos-route-soft, #e6f4f1) 80%, #ffffff);
padding: 4px 10px;
border-radius: 999px;
}
.juego-memoria__head h3 {
margin: 12px 0 4px;
font-size: 1.35rem;
color: var(--pensamos-deep, #0d1c31);
}
.juego-memoria__subtitle {
margin: 0;
color: #5a6b85;
font-size: 0.95rem;
}
.juego-memoria__body {
margin-top: 20px;
}
.juego-memoria__timer {
height: 10px;
border-radius: 999px;
background: rgba(15, 23, 42, 0.08);
overflow: hidden;
margin-bottom: 18px;
}
.juego-memoria__timer-bar {
height: 100%;
width: 100%;
border-radius: 999px;
background: linear-gradient(90deg, var(--pensamos-accent, #2f80ed), var(--pensamos-highlight, #0f6f68));
transform-origin: left center;
transition: transform linear;
}
.juego-memoria__stimulus {
display: flex;
flex-wrap: wrap;
gap: 12px;
justify-content: center;
margin: 8px 0 22px;
}
.juego-memoria__chipwrap {
display: inline-flex;
flex-direction: column;
align-items: center;
gap: 4px;
}
.juego-memoria__chip {
min-width: 64px;
min-height: 64px;
padding: 10px 14px;
display: inline-flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 4px;
border-radius: 14px;
border: 1px solid rgba(202, 215, 230, 0.9);
background: #f8fafc;
font-size: 1.5rem;
font-weight: 700;
color: var(--pensamos-ink, #1f2a44);
}
.juego-memoria__chip-pos {
font-size: 0.62rem;
font-weight: 700;
letter-spacing: 0.04em;
color: #94a3b8;
text-transform: uppercase;
}
.juego-memoria__chip--color {
color: #ffffff;
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
border: none;
}
.juego-memoria__chip--icon {
font-size: 2rem;
}
.juego-memoria__question {
margin-bottom: 18px;
}
.juego-memoria__question-text {
font-weight: 700;
color: var(--pensamos-deep, #0d1c31);
margin: 0 0 10px;
}
.juego-memoria__options {
display: grid;
gap: 8px;
}
.juego-memoria__option {
display: flex;
align-items: center;
gap: 10px;
width: 100%;
text-align: left;
padding: 12px 14px;
border-radius: 12px;
border: 1px solid rgba(202, 215, 230, 0.95);
background: #ffffff;
font: inherit;
font-weight: 600;
color: var(--pensamos-ink, #1f2a44);
cursor: pointer;
}
.juego-memoria__option:hover {
border-color: color-mix(in srgb, var(--pensamos-accent, #2f80ed) 45%, #cbd8ea);
color: var(--pensamos-deep, #0d1c31);
}
.juego-memoria__option.is-selected {
border-color: var(--pensamos-accent, #2f80ed);
background: color-mix(in srgb, var(--pensamos-accent, #2f80ed) 8%, #ffffff);
color: var(--pensamos-deep, #0d1c31);
}
.juego-memoria__option.is-correct {
border-color: #18a058;
background: rgba(24, 160, 88, 0.1);
color: #14532d;
}
.juego-memoria__option.is-incorrect {
border-color: #e03e3e;
background: rgba(224, 62, 62, 0.1);
color: #7f1d1d;
}
.juego-memoria__option[disabled] {
cursor: default;
}
.juego-memoria-modal .juego-memoria__body .juego-memoria__option {
appearance: none;
background: #ffffff;
box-shadow: none;
color: var(--pensamos-ink, #1f2a44);
line-height: 1.35;
}
.juego-memoria-modal .juego-memoria__body .juego-memoria__option:hover:not(.is-selected):not(.is-correct):not(.is-incorrect):not([disabled]),
.juego-memoria-modal .juego-memoria__body .juego-memoria__option:focus-visible:not(.is-selected):not(.is-correct):not(.is-incorrect):not([disabled]) {
border-color: color-mix(in srgb, var(--pensamos-accent, #2f80ed) 55%, #cbd8ea);
background: color-mix(in srgb, var(--pensamos-accent, #2f80ed) 6%, #ffffff);
color: var(--pensamos-deep, #0d1c31);
box-shadow: 0 0 0 3px color-mix(in srgb, var(--pensamos-accent, #2f80ed) 14%, transparent);
}
.juego-memoria-modal .juego-memoria__body .juego-memoria__option.is-selected,
.juego-memoria-modal .juego-memoria__body .juego-memoria__option.is-selected:hover,
.juego-memoria-modal .juego-memoria__body .juego-memoria__option.is-selected:focus-visible {
border-color: var(--pensamos-accent, #2f80ed);
background: color-mix(in srgb, var(--pensamos-accent, #2f80ed) 10%, #ffffff);
color: var(--pensamos-deep, #0d1c31);
box-shadow: inset 4px 0 0 var(--pensamos-accent, #2f80ed), 0 0 0 3px color-mix(in srgb, var(--pensamos-accent, #2f80ed) 16%, transparent);
}
.juego-memoria-modal .juego-memoria__body .juego-memoria__option.is-selected * {
color: inherit !important;
}
.juego-memoria-modal .juego-memoria__body .juego-memoria__option.is-correct,
.juego-memoria-modal .juego-memoria__body .juego-memoria__option.is-correct:hover,
.juego-memoria-modal .juego-memoria__body .juego-memoria__option.is-correct:focus-visible {
border-color: #18a058;
background: rgba(24, 160, 88, 0.12);
color: #14532d;
}
.juego-memoria-modal .juego-memoria__body .juego-memoria__option.is-incorrect,
.juego-memoria-modal .juego-memoria__body .juego-memoria__option.is-incorrect:hover,
.juego-memoria-modal .juego-memoria__body .juego-memoria__option.is-incorrect:focus-visible {
border-color: #e03e3e;
background: rgba(224, 62, 62, 0.11);
color: #7f1d1d;
}
.juego-memoria-modal .juego-memoria__body .juego-memoria__option.is-correct *,
.juego-memoria-modal .juego-memoria__body .juego-memoria__option.is-incorrect * {
color: inherit !important;
}
.juego-memoria__swatch {
width: 22px;
height: 22px;
border-radius: 6px;
border: 1px solid rgba(0, 0, 0, 0.1);
flex: 0 0 auto;
}
.juego-memoria__actions {
display: flex;
flex-wrap: wrap;
gap: 10px;
margin-top: 22px;
}
.juego-memoria__btn {
appearance: none;
border: none;
border-radius: 999px;
padding: 11px 20px;
font: inherit;
font-weight: 700;
cursor: pointer;
background: var(--pensamos-accent, #2f80ed);
color: #ffffff;
}
.juego-memoria__btn--ghost {
background: #ffffff;
color: var(--pensamos-deep, #0d1c31);
border: 1px solid rgba(202, 215, 230, 0.95);
}
.juego-memoria__btn:disabled {
opacity: 0.5;
cursor: not-allowed;
}
.juego-memoria__meta {
display: flex;
justify-content: space-between;
align-items: center;
gap: 10px;
font-size: 0.85rem;
color: #5a6b85;
margin-bottom: 6px;
}
.juego-memoria__level-pill {
font-weight: 800;
color: var(--pensamos-highlight, #0f6f68);
}
.juego-memoria__score {
font-size: 2.4rem;
font-weight: 800;
color: var(--pensamos-deep, #0d1c31);
text-align: center;
margin: 8px 0 4px;
}
.juego-memoria__score-caption {
text-align: center;
color: #5a6b85;
margin: 0 0 6px;
}
.juego-memoria__review {
display: grid;
gap: 8px;
margin-top: 16px;
}
.juego-memoria__review-item {
font-size: 0.9rem;
padding: 10px 12px;
border-radius: 10px;
background: #f8fafc;
border: 1px solid rgba(202, 215, 230, 0.7);
}
.juego-memoria__review-item strong {
color: var(--pensamos-deep, #0d1c31);
}
@media (max-width: 480px) {
.juego-memoria__dialog {
padding: 22px 16px 20px;
}
.juego-memoria__chip {
min-width: 54px;
min-height: 54px;
font-size: 1.25rem;
}
}
.juego-lectura-modal .juego-memoria__dialog { padding: 18px 20px; }
.juego-lectura-modal .juego-memoria__head h3 { margin: 6px 0 2px; font-size: 1.2rem; }
.juego-lectura-modal .juego-memoria__subtitle { font-size: 0.86rem; margin: 0; }
.juego-lectura-modal .juego-memoria__body { margin-top: 12px; }
.juego-lectura-modal .juego-lectura__scene { font-size: 2.6rem; margin: 0 0 6px; letter-spacing: 4px; }
.juego-lectura-modal .juego-lectura__reading { padding: 11px 16px; margin-bottom: 10px; }
.juego-lectura-modal .juego-lectura__text { font-size: 1.18rem; line-height: 1.4; }
.juego-lectura-modal .juego-lectura__listen { margin-bottom: 8px; padding: 5px 12px; }
.juego-lectura-modal .juego-lectura__question { margin: 2px 0 10px; font-size: 1.1rem; }
.juego-lectura-modal .juego-lectura__options { gap: 8px; margin-bottom: 6px; }
.juego-lectura-modal .juego-lectura__option { padding: 11px 14px; font-size: 1.05rem; border-radius: 14px; border-width: 2px; }
.juego-lectura-modal .juego-lectura__option-emoji { font-size: 1.6rem; }
.juego-lectura-modal .juego-lectura__hint-btn { margin-top: 2px; padding: 8px 16px; }
.juego-lectura-modal .juego-lectura__hints { margin-top: 10px; gap: 6px; }
.juego-lectura-modal .juego-lectura__hint { padding: 8px 12px; font-size: 0.98rem; }
.juego-lectura-modal .juego-lectura__feedback { margin: 8px 0 0; }
.juego-lectura-modal .juego-lectura__repeat { padding: 11px 16px; margin-top: 10px; }
.juego-lectura-modal .juego-lectura__repeat-word { font-size: 1.35rem; }
.juego-lectura-modal .juego-memoria__actions { margin-top: 10px; }
.juego-lectura-modal .juego-lectura__themes { gap: 10px; }
.juego-lectura-modal .juego-lectura__theme { padding: 14px 18px; font-size: 1.15rem; }
.juego-lectura-modal .juego-lectura__theme-emoji { font-size: 2rem; }
.juego-lectura__themes {
display: grid;
gap: 12px;
}
.juego-lectura__theme {
appearance: none;
display: flex;
align-items: center;
gap: 16px;
width: 100%;
text-align: left;
padding: 18px 20px;
border-radius: 18px;
border: 2px solid rgba(202, 215, 230, 0.95);
background: #ffffff;
font: inherit;
font-size: 1.25rem;
font-weight: 800;
color: var(--pensamos-deep, #0d1c31);
cursor: pointer;
}
.juego-lectura__theme:hover {
border-color: color-mix(in srgb, var(--pensamos-accent, #2f80ed) 55%, #cbd8ea);
background: color-mix(in srgb, var(--pensamos-accent, #2f80ed) 6%, #ffffff);
}
.juego-lectura__theme-emoji {
font-size: 2.4rem;
flex: 0 0 auto;
}
.juego-lectura__scene {
text-align: center;
font-size: 3.6rem;
line-height: 1.1;
letter-spacing: 6px;
margin: 4px 0 8px;
}
.juego-lectura__reading {
background: #f7fbff;
border: 1px solid rgba(202, 215, 230, 0.9);
border-radius: 16px;
padding: 16px 18px;
margin-bottom: 14px;
}
.juego-lectura__text {
font-size: 1.35rem;
line-height: 1.55;
color: var(--pensamos-deep, #0d1c31);
margin: 0;
font-weight: 700;
text-align: center;
}
.juego-lectura__repeat {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 12px;
background: #eefaf3;
border: 2px dashed #18a058;
border-radius: 16px;
padding: 14px 18px;
margin-top: 14px;
}
.juego-lectura__repeat-label {
font-weight: 700;
color: #0f6f68;
}
.juego-lectura__repeat-word {
font-size: 1.5rem;
font-weight: 800;
color: var(--pensamos-deep, #0d1c31);
}
.juego-lectura__listen {
appearance: none;
border: 1px solid rgba(202, 215, 230, 0.95);
background: #ffffff;
border-radius: 999px;
padding: 6px 14px;
font: inherit;
font-weight: 700;
font-size: 0.9rem;
cursor: pointer;
color: var(--pensamos-deep, #0d1c31);
display: inline-flex;
align-items: center;
gap: 6px;
margin-bottom: 12px;
}
.juego-lectura__listen:hover {
border-color: color-mix(in srgb, var(--pensamos-accent, #2f80ed) 45%, #cbd8ea);
}
.juego-lectura__question {
font-size: 1.2rem;
font-weight: 800;
color: var(--pensamos-deep, #0d1c31);
margin: 4px 0 14px;
}
.juego-lectura__options {
display: grid;
gap: 10px;
margin-bottom: 8px;
}
.juego-lectura__option {
display: flex;
align-items: center;
gap: 14px;
width: 100%;
text-align: left;
padding: 14px 16px;
border-radius: 16px;
border: 2px solid rgba(202, 215, 230, 0.95);
background: #ffffff;
font: inherit;
font-size: 1.15rem;
font-weight: 700;
color: var(--pensamos-ink, #1f2a44);
cursor: pointer;
}
.juego-lectura__option:hover:not([disabled]) {
border-color: color-mix(in srgb, var(--pensamos-accent, #2f80ed) 55%, #cbd8ea);
background: color-mix(in srgb, var(--pensamos-accent, #2f80ed) 6%, #ffffff);
}
.juego-lectura__option-emoji {
font-size: 1.8rem;
flex: 0 0 auto;
}
.juego-lectura-modal .juego-memoria__body .juego-lectura__option,
.juego-lectura-modal .juego-memoria__body .juego-lectura__option:hover,
.juego-lectura-modal .juego-memoria__body .juego-lectura__option:focus,
.juego-lectura-modal .juego-memoria__body .juego-lectura__option:focus-visible,
.juego-lectura-modal .juego-memoria__body .juego-lectura__option:disabled {
appearance: none;
background: #ffffff;
color: var(--pensamos-ink, #1f2a44);
box-shadow: none;
opacity: 1;
}
.juego-lectura-modal .juego-memoria__body .juego-lectura__option:hover:not([disabled]) {
border-color: color-mix(in srgb, var(--pensamos-accent, #2f80ed) 55%, #cbd8ea);
background: color-mix(in srgb, var(--pensamos-accent, #2f80ed) 6%, #ffffff);
}
.juego-lectura-modal .juego-memoria__body .juego-lectura__option.is-correct {
border-color: #18a058;
background: rgba(24, 160, 88, 0.14);
color: var(--pensamos-deep, #0d1c31);
}
.juego-lectura-modal .juego-memoria__body .juego-lectura__option.is-wrong {
border-color: #e0a800;
background: rgba(224, 168, 0, 0.16);
color: var(--pensamos-deep, #0d1c31);
}
.juego-lectura-modal .juego-memoria__body .juego-lectura__option * {
color: inherit;
}
.juego-lectura__hint-btn {
appearance: none;
border: none;
border-radius: 999px;
padding: 10px 18px;
font: inherit;
font-weight: 800;
cursor: pointer;
background: #fde68a;
color: #7c5b00;
margin-top: 6px;
}
.juego-lectura__hint-btn:disabled {
opacity: 0.5;
cursor: default;
}
.juego-lectura__hints {
list-style: none;
margin: 14px 0 0;
padding: 0;
display: grid;
gap: 8px;
}
.juego-lectura__hint {
background: #fffaf0;
border: 1px solid #fde68a;
border-radius: 12px;
padding: 10px 14px;
font-size: 1.05rem;
color: #5a4a00;
display: flex;
gap: 8px;
align-items: flex-start;
}
.juego-lectura__feedback {
font-size: 1.1rem;
font-weight: 800;
margin: 12px 0 0;
min-height: 1.4em;
}
.juego-lectura__feedback.is-good { color: #18a058; }
.juego-lectura__feedback.is-soft { color: #b07a00; }
@media (max-width: 480px) {
.juego-lectura__text { font-size: 1.1rem; }
.juego-lectura__emoji { font-size: 2.4rem; }
.juego-lectura__option { font-size: 1.05rem; }
}
.juego-lectura-modal .juego-lectura__theme {
transition: border-color .12s ease, background-color .12s ease, box-shadow .12s ease;
}
.juego-lectura-modal .juego-lectura__theme:hover,
.juego-lectura-modal .juego-lectura__theme:focus-visible {
border-color: var(--pensamos-accent, #2f80ed);
background: #f3f8ff;
box-shadow: 0 3px 12px rgba(47, 128, 237, 0.12);
outline: none;
}
.juego-lectura-modal .juego-memoria__body .juego-lectura__option {
transition: border-color .12s ease, background-color .12s ease, box-shadow .12s ease;
}
.juego-lectura-modal .juego-memoria__body .juego-lectura__option:hover:not([disabled]),
.juego-lectura-modal .juego-memoria__body .juego-lectura__option:focus-visible:not([disabled]) {
border-color: var(--pensamos-accent, #2f80ed);
background: #f3f8ff;
box-shadow: 0 2px 10px rgba(47, 128, 237, 0.10);
outline: none;
}
.juego-lectura-modal .juego-lectura__listen:hover,
.juego-lectura-modal .juego-lectura__listen:focus-visible {
border-color: var(--pensamos-accent, #2f80ed);
background: #f3f8ff;
outline: none;
}
.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;
}
}