: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: 50%;
bottom: 12px;
width: calc(100vw - 20px);
}
.pensamos-cookies__inner {
flex-direction: column;
align-items: stretch;
}
.pensamos-cookies__actions {
display: grid;
grid-template-columns: 1fr;
}
.pensamos-cookies-modal__actions {
display: grid;
grid-template-columns: 1fr;
}
}
.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: calc(100vw - 16px);
}
.pensamos-cookies__inner {
padding: 14px;
}
}
body.pensamos-register-page .site-header,
body.pensamos-register-page .ast-mobile-header-wrap,
body.pensamos-register-page .main-header-bar-wrap,
body.pensamos-register-page .main-navigation,
body.pensamos-register-page .pensamarket-topbar,
body.pensamos-register-page .pensamos-experience-strip,
body.pensamos-profile-page .site-header,
body.pensamos-profile-page .ast-mobile-header-wrap,
body.pensamos-profile-page .main-navigation,
body.pensamos-profile-page .pensamarket-topbar { display: none !important; }
.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-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-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%;
}
}
@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-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-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 {
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;
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);
}
.juego-memoria__option.is-selected {
border-color: var(--pensamos-accent, #2f80ed);
background: color-mix(in srgb, var(--pensamos-accent, #2f80ed) 8%, #ffffff);
}
.juego-memoria__option.is-correct {
border-color: #18a058;
background: rgba(24, 160, 88, 0.1);
}
.juego-memoria__option.is-incorrect {
border-color: #e03e3e;
background: rgba(224, 62, 62, 0.1);
}
.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__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-modal .juego-memoria__btn:hover,
.juego-memoria-modal .juego-memoria__btn:focus-visible { color: #ffffff; }
.juego-memoria-modal .juego-memoria__btn--ghost:hover,
.juego-memoria-modal .juego-memoria__btn--ghost:focus-visible { color: var(--pensamos-deep, #0d1c31); background: #f3f7ff; }
.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-modal .juego-lectura__hint-btn:hover,
.juego-lectura-modal .juego-lectura__hint-btn:focus-visible { background: #fcd34d; color: #7c5b00; }
.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;
}
.tb { display: flex; flex-direction: column; gap: 16px; }
.tb__bar {
position: sticky; top: 8px; z-index: 5;
background: #ffffff; border: 2px solid #e7eefb; border-radius: 18px;
padding: 12px; display: flex; flex-direction: column; gap: 10px;
}
.tb__strip {
min-height: 56px; display: flex; flex-wrap: wrap; gap: 8px; align-items: center;
background: #f6f9ff; border: 2px dashed #cdd9f5; border-radius: 12px; padding: 8px 10px;
}
.tb-strip__hint { color: #8aa0c6; font-size: 0.98rem; }
.tb-chip {
display: inline-flex; align-items: center; gap: 6px;
background: #eaf1ff; border: 2px solid #c7d6f7; border-radius: 12px;
padding: 4px 10px; font-weight: 800; color: var(--pensamos-deep, #0d1c31); font-size: 1.05rem;
}
.tb-chip span { font-size: 1.3rem; line-height: 1; }
.tb__actions { display: flex; gap: 8px; flex-wrap: wrap; }
.tb__btn {
flex: 1; min-width: 96px;
border: 2px solid #dbe6fb; border-radius: 12px; background: #fff;
padding: 10px 12px; font-weight: 800; color: #51618a; cursor: pointer; font-size: 1rem;
}
.tb__btn:hover,
.tb__btn:focus-visible { border-color: #c7d6f7; color: #51618a; }
.tb__btn--say,
.tb__btn--say:hover,
.tb__btn--say:focus-visible { background: var(--pensamos-highlight, #4f7cff); color: #fff; border-color: var(--pensamos-highlight, #4f7cff); box-shadow: 0 4px 0 #3257c9; }
.tb__btn--say:active { transform: translateY(4px); box-shadow: none; }
.tb__tabs { display: flex; flex-wrap: wrap; gap: 8px; }
.tb-tab {
display: inline-flex; align-items: center; gap: 6px;
border: 2px solid #e7eefb; border-radius: 999px; background: #fff;
padding: 8px 14px; font-weight: 800; color: #51618a; cursor: pointer; font-size: 0.95rem;
}
.tb-tab span:first-child { font-size: 1.2rem; }
.tb-tab:hover,
.tb-tab:focus-visible { color: var(--pensamos-deep, #0d1c31); border-color: #c7d6f7; }
.tb-tab.is-active { background: #eaf1ff; color: var(--pensamos-deep, #0d1c31); border-color: #c7d6f7; }
.tb__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(116px, 1fr)); gap: 12px; }
.tb-cell {
display: flex; flex-direction: column; align-items: center; gap: 6px;
background: #fff; border: 2px solid #e7eefb; border-radius: 18px;
padding: 16px 8px; cursor: pointer; box-shadow: 0 4px 0 #e2e9f5;
transition: transform 0.08s ease, box-shadow 0.08s ease, border-color 0.12s ease;
}
.tb-cell:hover { border-color: #c7d6f7; transform: translateY(-2px); }
.tb-cell:active, .tb-cell.is-tapped { transform: translateY(4px); box-shadow: 0 0 0 #e2e9f5; border-color: var(--pensamos-highlight, #4f7cff); }
.tb-cell__emoji { font-size: 2.6rem; line-height: 1; }
.tb-cell__word { font-weight: 800; color: var(--pensamos-deep, #0d1c31); font-size: 1.05rem; }
@media (max-width: 560px) {
.tb__grid { grid-template-columns: repeat(auto-fill, minmax(92px, 1fr)); gap: 8px; }
.tb-cell__emoji { font-size: 2.1rem; }
.tb-cell__word { font-size: 0.92rem; }
}
.respira { display: flex; flex-direction: column; align-items: center; gap: 14px; padding: 8px 0; }
.respira__modes { display: flex; gap: 8px; }
.respira__mode {
border: 2px solid #e7eefb; border-radius: 999px; background: #fff;
padding: 8px 16px; font-weight: 800; color: #51618a; cursor: pointer; font-size: 0.95rem;
}
.respira__mode:hover,
.respira__mode:focus-visible { color: var(--pensamos-deep, #0d1c31); border-color: #c7d6f7; }
.respira__mode.is-active { background: #eaf1ff; color: var(--pensamos-deep, #0d1c31); border-color: #c7d6f7; }
.respira__stage {
width: 100%; min-height: 280px; display: flex; align-items: center; justify-content: center;
margin: 6px 0;
}
.respira__circle {
width: 150px; height: 150px; border-radius: 50%;
background: #cfe0ff; display: grid; place-items: center;
transform: scale(1); box-shadow: 0 0 0 12px rgba(79, 124, 255, 0.10);
}
.respira__circle.is-big {
transform: scale(1.7);
background: #b9d2ff; box-shadow: 0 0 0 18px rgba(79, 124, 255, 0.14);
}
.respira__circle-emoji { font-size: 3rem; line-height: 1; }
.respira__cue { margin: 0; font-size: 1.5rem; font-weight: 800; color: var(--pensamos-deep, #0d1c31); text-align: center; min-height: 1.6em; }
.respira__sub { margin: 0; color: #51618a; font-size: 1rem; text-align: center; }
.respira__bottom { display: flex; flex-direction: column; align-items: center; gap: 10px; margin-top: 4px; }
.respira__btn--go {
border: 0; border-radius: 16px; background: var(--pensamos-highlight, #4f7cff); color: #fff;
font-weight: 800; font-size: 1.15rem; padding: 14px 30px; cursor: pointer;
box-shadow: 0 5px 0 #3257c9;
}
.respira__btn--go:active { transform: translateY(5px); box-shadow: none; }
.respira__btn--go.is-running { background: #51618a; box-shadow: 0 5px 0 #3a4763; }
.respira__count { color: #7a4e00; background: #fff7e6; border: 2px solid #ffe3a6; border-radius: 999px; padding: 5px 14px; font-weight: 800; font-size: 0.95rem; }
@media (prefers-reduced-motion: reduce) {
.respira__circle, .respira__circle.is-big { transition: none !important; transform: scale(1.25); }
}
.sug { max-width: 560px; display: flex; flex-direction: column; gap: 12px; }
.sug__label { font-weight: 800; color: var(--pensamos-deep, #0d1c31); font-size: 1.05rem; }
.sug__textarea {
width: 100%; border: 2px solid #dbe6fb; border-radius: 16px; background: #fff;
padding: 14px 16px; font: inherit; color: var(--pensamos-ink, #1f2a44);
resize: vertical; min-height: 120px;
}
.sug__textarea:focus { outline: none; border-color: var(--pensamos-highlight, #4f7cff); }
.sug__hp { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.sug__btn {
align-self: flex-start; border: 0; border-radius: 16px;
background: var(--pensamos-highlight, #4f7cff); color: #fff;
font-weight: 800; font-size: 1.1rem; padding: 12px 28px; cursor: pointer;
box-shadow: 0 5px 0 #3257c9;
}
.sug__btn:hover, .sug__btn:focus-visible { color: #fff; filter: brightness(1.05); }
.sug__btn:active { transform: translateY(5px); box-shadow: none; }
.sug__btn:disabled { opacity: 0.6; cursor: default; box-shadow: none; }
.sug__msg { margin: 2px 0 0; font-weight: 800; min-height: 1.4em; }
.sug__msg.is-ok { color: #18794e; }
.sug__msg.is-err { color: #c0392b; }
body.pensamos-kids-hub .pensamos-course-guide { display: none !important; }
body.pensamos-kids-hub .site-footer,
body.pensamos-kids-hub .ast-above-footer-wrap { display: none !important; }
body.pensamos-kids-hub #main,
body.pensamos-kids-hub #primary,
body.pensamos-kids-hub .site-content .ast-container { max-width: none; width: 100%; padding: 0; margin: 0; }
body.pensamos-kids-hub #content { padding: 0; }
.kids-app {
--kids-blue: #4f7cff;
display: flex;
align-items: stretch;
min-height: 86vh;
background:
radial-gradient(circle at 18% -8%, rgba(79, 124, 255, 0.14), transparent 40%),
linear-gradient(180deg, #eef4ff 0%, #f8fbff 50%, #ffffff 100%);
font-family: inherit;
color: var(--pensamos-ink, #1f2a44);
}
.kids-app *, .kids-app *::before, .kids-app *::after { box-sizing: border-box; }
.kids-app__sidebar {
flex: 0 0 232px;
width: 232px;
background: #ffffff;
border-right: 2px solid #e7eefb;
padding: 20px 14px;
position: sticky;
top: 0;
align-self: flex-start;
min-height: 86vh;
}
.kids-app__brand {
display: flex; align-items: center; gap: 8px;
font-size: 1.15rem; font-weight: 800;
color: var(--pensamos-deep, #0d1c31);
padding: 4px 8px 18px;
}
.kids-app__nav-list { display: flex; flex-direction: column; gap: 8px; }
.kids-app__nav {
display: flex; align-items: center; gap: 12px;
padding: 12px 14px;
border: 2px solid transparent;
border-radius: 16px;
background: transparent;
font-size: 1.02rem; font-weight: 800; color: #51618a;
cursor: pointer; text-align: left; width: 100%;
transition: background 0.15s ease;
}
.kids-app__nav:hover,
.kids-app__nav:focus-visible { background: #f3f7ff; color: var(--pensamos-deep, #0d1c31); }
.kids-app__nav.is-active { background: #eaf1ff; color: var(--pensamos-deep, #0d1c31); border-color: #c7d6f7; }
.kids-app__nav[disabled] { opacity: 0.45; cursor: default; }
.kids-app__nav-icon { font-size: 1.5rem; line-height: 1; width: 30px; text-align: center; }
.kids-app__nav-short { display: none; }
.kids-app__main { flex: 1; padding: 22px 18px 90px; max-width: 720px; margin: 0 auto; width: 100%; }
.kids-app__stars-total {
display: inline-flex; align-items: center; gap: 6px;
background: #fff7e6; color: #7a4e00; border: 2px solid #ffe3a6;
font-weight: 800; padding: 6px 14px; border-radius: 999px; font-size: 1rem;
}
.kids-app__head {
display: flex; align-items: center; gap: 16px;
margin: 18px 0 4px; padding: 18px 20px;
background: #ffffff; border: 2px solid #e7eefb; border-radius: 22px;
}
.kids-app__head-emoji { font-size: 2.6rem; line-height: 1; }
.kids-app__head-title { margin: 0; font-size: 1.5rem; font-weight: 800; color: var(--pensamos-deep, #0d1c31); }
.kids-app__head-sub { margin: 2px 0 0; color: #51618a; font-size: 0.98rem; }
.kids-app__path { list-style: none; margin: 26px 0 0; padding: 0; display: flex; flex-direction: column; align-items: center; gap: 26px; }
.kids-app__node-wrap { display: flex; flex-direction: column; align-items: center; gap: 8px; transform: translateX(calc((var(--i) - 0.5) * 96px)); }
.kids-app__node {
width: 92px; height: 92px; border-radius: 50%;
border: 0; cursor: pointer;
display: grid; place-items: center;
background: #c7d6f7; box-shadow: 0 6px 0 #a9c0f0;
transition: transform 0.08s ease, box-shadow 0.08s ease;
}
.kids-app__node:hover { transform: translateY(-2px); box-shadow: 0 8px 0 #a9c0f0; }
.kids-app__node:active { transform: translateY(6px); box-shadow: 0 0 0 #a9c0f0; }
.kids-app__node-icon { font-size: 2.7rem; line-height: 1; }
.kids-app__node-meta { display: flex; flex-direction: column; align-items: center; gap: 2px; }
.kids-app__node-label { font-weight: 800; color: var(--pensamos-deep, #0d1c31); font-size: 1rem; }
.kids-app__node-stars { font-size: 1.05rem; letter-spacing: 1px; }
.kids-app__star { color: #cdd5e3; }
.kids-app__star.is-on { color: #ffb020; }
.kids-app__empty { text-align: center; color: #51618a; font-size: 1.1rem; padding: 40px 0; }
.kids-app__nav[data-tone="mates"].is-active { border-color: #c7d6f7; }
.kids-app__node[data-tone="mates"] { background: #dbe6ff; box-shadow: 0 6px 0 #b4caf6; }
.kids-app__node[data-tone="mates"]:hover { box-shadow: 0 8px 0 #b4caf6; }
.kids-app__node[data-tone="lectura"] { background: #d8f3e3; box-shadow: 0 6px 0 #a6dcbb; }
.kids-app__node[data-tone="lectura"]:hover { box-shadow: 0 8px 0 #a6dcbb; }
.kids-app__node[data-tone="logica"] { background: #ece2ff; box-shadow: 0 6px 0 #cdbcf6; }
.kids-app__node[data-tone="logica"]:hover { box-shadow: 0 8px 0 #cdbcf6; }
.kids-app__node[data-tone="comunicacion"] { background: #ffe6d6; box-shadow: 0 6px 0 #ffc4a3; }
.kids-app__node[data-tone="comunicacion"]:hover { box-shadow: 0 8px 0 #ffc4a3; }
.kids-app__node[data-tone="ingles"] { background: #d6f3ef; box-shadow: 0 6px 0 #a6e0d8; }
.kids-app__node[data-tone="ingles"]:hover { box-shadow: 0 8px 0 #a6e0d8; }
.kids-app__node[data-tone="cocina"] { background: #ffe3b0; box-shadow: 0 6px 0 #f3c970; }
.kids-app__node[data-tone="cocina"]:hover { box-shadow: 0 8px 0 #f3c970; }
.kids-app__node[data-tone="vida"] { background: #ffd9ec; box-shadow: 0 6px 0 #f3b3d6; }
.kids-app__node[data-tone="vida"]:hover { box-shadow: 0 8px 0 #f3b3d6; }
.kids-app__profile {
display: flex; align-items: center; gap: 10px; width: 100%;
border: 2px solid #e7eefb; border-radius: 16px; background: #fff;
padding: 8px 10px; margin: 0 0 14px; cursor: pointer;
font-weight: 800; color: var(--pensamos-deep, #0d1c31); text-align: left;
}
.kids-app__profile:hover,
.kids-app__profile:focus-visible { background: #f3f7ff; color: var(--pensamos-deep, #0d1c31); }
.kids-app__profile.is-active { border-color: #c7d6f7; background: #eaf1ff; }
.kids-app__avatar {
width: 34px; height: 34px; border-radius: 50%; flex: 0 0 auto;
background: var(--pensamos-highlight, #4f7cff); color: #fff;
display: grid; place-items: center; font-weight: 800; font-size: 1rem;
}
.kids-app__profile-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kids-app__profile-fab { display: none; }
.kids-app__profile-card {
background: #fff; border: 2px solid #e7eefb; border-radius: 22px;
padding: 26px 20px; margin-top: 18px; text-align: center;
display: flex; flex-direction: column; align-items: center; gap: 10px;
}
.kids-app__avatar--big { width: 84px; height: 84px; font-size: 2.4rem; }
.kids-app__profile-greet { font-size: 1.3rem; font-weight: 800; color: var(--pensamos-deep, #0d1c31); margin: 4px 0 0; }
.kids-app__profile-stars { background: #fff7e6; color: #7a4e00; border: 2px solid #ffe3a6; border-radius: 999px; padding: 6px 16px; font-weight: 800; }
.kids-app__profile-actions { display: flex; flex-direction: column; gap: 10px; width: 100%; max-width: 280px; margin-top: 8px; }
.kids-app__salir {
display: inline-flex; align-items: center; justify-content: center;
padding: 12px 18px; border-radius: 14px; border: 2px solid #dbe6fb;
background: #fff; font-weight: 800; color: #51618a; text-decoration: none;
}
.kids-app__salir:hover,
.kids-app__salir:focus-visible { border-color: #c7d6f7; color: #51618a; }
.kids-app__salir--primary,
.kids-app__salir--primary:hover,
.kids-app__salir--primary:focus-visible { background: var(--pensamos-highlight, #4f7cff); color: #fff; border-color: var(--pensamos-highlight, #4f7cff); box-shadow: 0 4px 0 #3257c9; }
.kids-app__node.is-locked { background: #e9edf4; box-shadow: 0 6px 0 #d4dbe7; cursor: default; }
.kids-app__node.is-locked .kids-app__node-icon { filter: grayscale(1); opacity: 0.7; font-size: 2rem; }
.kids-app__node.is-locked:hover { transform: none; box-shadow: 0 6px 0 #d4dbe7; }
.kids-app__node { position: relative; }
.kids-app__node.is-current::after {
content: ''; position: absolute; inset: -6px; border-radius: 50%;
border: 3px solid rgba(79, 124, 255, 0.55); pointer-events: none;
animation: kids-ring 1.5s ease-out infinite;
}
@keyframes kids-ring {
0% { transform: scale(1); opacity: 0.85; }
100% { transform: scale(1.35); opacity: 0; }
}
.kids-app__node-wrap { animation: kids-pop 0.32s ease both; }
@keyframes kids-pop {
from { opacity: 0; transform: translateX(calc((var(--i) - 0.5) * 96px)) scale(0.8); }
to { opacity: 1; transform: translateX(calc((var(--i) - 0.5) * 96px)) scale(1); }
}
.kids-app__node.is-shake { animation: kids-shake 0.4s; }
@keyframes kids-shake {
0%, 100% { transform: translateX(0); }
20%, 60% { transform: translateX(-7px); }
40%, 80% { transform: translateX(7px); }
}
@media (prefers-reduced-motion: reduce) {
.kids-app__node.is-current::after, .kids-app__node-wrap, .kids-app__node.is-shake { animation: none; }
}
@media (max-width: 820px) {
.kids-app { flex-direction: column; }
.kids-app__sidebar {
position: fixed; left: 0; right: 0; bottom: 0; top: auto;
width: auto; flex: none; min-height: 0;
border-right: 0; border-top: 2px solid #e7eefb;
padding: 6px 6px calc(6px + env(safe-area-inset-bottom, 0px));
z-index: 60; box-shadow: 0 -6px 18px rgba(13, 28, 49, 0.08);
}
.kids-app__brand { display: none; }
.kids-app__profile { display: none; }
.kids-app__profile-fab {
display: flex; position: fixed; top: 10px; right: 10px; z-index: 61;
width: 44px; height: 44px; border-radius: 50%; border: 2px solid #e7eefb;
background: #fff; align-items: center; justify-content: center; cursor: pointer;
box-shadow: 0 4px 12px rgba(13, 28, 49, 0.12);
}
.kids-app__nav-list { flex-direction: row; justify-content: flex-start; gap: 4px; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
.kids-app__nav-list::-webkit-scrollbar { display: none; }
.kids-app__nav { flex: 0 0 auto; width: 62px; min-width: 62px; flex-direction: column; gap: 2px; padding: 6px 2px; font-size: 0.7rem; border-radius: 12px; align-items: center; text-align: center; }
.kids-app__nav-icon { font-size: 1.4rem; width: auto; }
.kids-app__nav-label { font-size: 0.66rem; line-height: 1.1; max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
}
@media (max-width: 520px) {
.kids-app__nav-label { display: none; }
.kids-app__nav-short { display: block; font-size: 0.6rem; line-height: 1.05; white-space: nowrap; font-weight: 800; }
.kids-app__nav-icon { font-size: 1.35rem; }
.kids-app__main { padding: 16px 14px 96px; }
.kids-app__node-wrap { transform: translateX(calc((var(--i) - 0.5) * 64px)); }
.kids-app__node { width: 80px; height: 80px; }
.kids-app__node-icon { font-size: 2.3rem; }
}
.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;
}
}