.com-esploresimuladores { --es-primary: #087d8b; --es-primary-dark: #075966; --es-navy: #12345b; --es-bg: #f4f8fb; --es-text: #23313f; --es-muted: #607183; --es-line: #dbe7ed; color: var(--es-text); padding: clamp(.8rem, 2vw, 1.5rem) 0 2.5rem; }
.com-esploresimuladores .es-page-head { margin: .35rem 0 1.75rem; max-width: 760px; }.com-esploresimuladores .es-page-head h1 { margin: 0; color: var(--es-navy); font-size: clamp(2rem, 4vw, 2.75rem); font-weight: 700; letter-spacing: -.035em; line-height: 1.08; }.com-esploresimuladores .es-page-head p { margin: .65rem 0 0; color: var(--es-muted); font-size: 1.02rem; line-height: 1.55; }.com-esploresimuladores .es-page-head--root { margin-top: 0; }
.com-esploresimuladores .es-breadcrumb { display: flex; flex-wrap: wrap; align-items: center; gap: .45rem; margin: 0 0 .8rem; color: #64748b; font-size: .86rem; }.com-esploresimuladores .es-breadcrumb a { color: var(--es-primary-dark); text-decoration: none; }.com-esploresimuladores .es-breadcrumb a:hover, .com-esploresimuladores .es-breadcrumb a:focus { color: var(--es-primary); text-decoration: underline; }.com-esploresimuladores .es-breadcrumb strong { color: #475569; font-weight: 600; }
.com-esploresimuladores .es-category-grid, .com-esploresimuladores .es-simulator-grid { display: grid; gap: clamp(1rem, 2.5vw, 1.5rem); justify-content: start; }.com-esploresimuladores .es-category-grid { grid-template-columns: repeat(auto-fill, minmax(245px, 330px)); }.com-esploresimuladores .es-simulator-grid { grid-template-columns: repeat(auto-fill, minmax(245px, 350px)); }.com-esploresimuladores .es-category-card { display: block; position: relative; overflow: hidden; border-radius: 16px; color: #fff; text-decoration: none; isolation: isolate; box-shadow: 0 10px 24px rgba(18, 52, 91, .14); transition: transform .22s ease, box-shadow .22s ease; }.com-esploresimuladores .es-category-card:hover, .com-esploresimuladores .es-category-card:focus { color: #fff; transform: translateY(-5px); box-shadow: 0 18px 34px rgba(18, 52, 91, .22); }.com-esploresimuladores .es-category-card:focus-visible, .com-esploresimuladores .es-simulator-card a:focus-visible, .com-esploresimuladores .es-button:focus-visible { outline: 3px solid #f2b84b; outline-offset: 4px; }
.com-esploresimuladores .es-category-card__image { display: block; position: relative; aspect-ratio: 16 / 10; overflow: hidden; background: linear-gradient(135deg, #173f66, #087d8b); }.com-esploresimuladores .es-category-card__image img { width: 100%; height: 100%; display: block; object-fit: cover; transition: transform .45s ease, filter .3s ease; }.com-esploresimuladores .es-category-card:hover img { transform: scale(1.06); filter: brightness(.82); }.com-esploresimuladores .es-category-card__placeholder { display: block; width: 100%; height: 100%; background: radial-gradient(circle at 72% 18%, rgba(255,255,255,.28), transparent 30%), linear-gradient(145deg, #12345b, #087d8b); }.com-esploresimuladores .es-category-card__overlay { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; padding: 1.5rem; text-align: center; background: linear-gradient(180deg, rgba(6, 26, 46, .12), rgba(6, 26, 46, .74)); }.com-esploresimuladores .es-category-card__title { max-width: 100%; color: #fff; font-size: clamp(1.35rem, 3vw, 1.85rem); font-weight: 700; line-height: 1.15; letter-spacing: -.02em; text-shadow: 0 2px 14px rgba(0,0,0,.45); }
.com-esploresimuladores .es-simulator-card { display: flex; flex-direction: column; overflow: hidden; min-width: 0; border: 1px solid var(--es-line); border-radius: 16px; background: #fff; box-shadow: 0 4px 14px rgba(18, 52, 91, .08); transition: transform .2s ease, box-shadow .2s ease; }.com-esploresimuladores .es-simulator-card:hover { transform: translateY(-4px); box-shadow: 0 14px 28px rgba(18, 52, 91, .15); }.com-esploresimuladores .es-simulator-card__image { display: block; overflow: hidden; aspect-ratio: 16 / 9; background: linear-gradient(135deg, #dbeaf0, #7eb6c1); }.com-esploresimuladores .es-simulator-card__image img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }.com-esploresimuladores .es-simulator-card:hover .es-simulator-card__image img { transform: scale(1.04); }.com-esploresimuladores .es-simulator-card__placeholder { display: block; width: 100%; height: 100%; background: linear-gradient(145deg, #12345b, #128d9c); }.com-esploresimuladores .es-simulator-card__body { display: flex; flex: 1; flex-direction: column; padding: 1.25rem; }.com-esploresimuladores .es-simulator-card h2 { margin: 0; color: var(--es-navy); font-size: 1.3rem; line-height: 1.23; }.com-esploresimuladores .es-simulator-card h2 a { color: inherit; text-decoration: none; }.com-esploresimuladores .es-simulator-card h2 a:hover { color: var(--es-primary); }.com-esploresimuladores .es-simulator-card__description { min-height: 4.65em; margin: .7rem 0 1.15rem; color: var(--es-muted); font-size: .95rem; line-height: 1.55; }.com-esploresimuladores .es-button { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; width: fit-content; margin-top: auto; padding: .7rem 1rem; border-radius: 999px; background: var(--es-primary); color: #fff; font-size: .92rem; font-weight: 700; text-decoration: none; transition: background .2s ease, transform .2s ease; }.com-esploresimuladores .es-button:hover { background: var(--es-primary-dark); color: #fff; transform: translateX(2px); }
.com-esploresimuladores .es-empty-state { grid-column: 1 / -1; margin: 0; padding: 1.5rem; border: 1px dashed #b9ccd7; border-radius: 12px; color: var(--es-muted); text-align: center; }.com-esploresimuladores .es-simulator { max-width: 760px; padding: clamp(1rem, 4vw, 2rem); background: var(--es-bg); border: 1px solid var(--es-line); border-radius: 16px; }
@media (max-width: 560px) { .com-esploresimuladores { padding-top: .5rem; }.com-esploresimuladores .es-page-head { margin-bottom: 1.3rem; }.com-esploresimuladores .es-category-grid { grid-template-columns: minmax(0, 330px); }.com-esploresimuladores .es-simulator-grid { grid-template-columns: minmax(0, 350px); }.com-esploresimuladores .es-category-card__image { aspect-ratio: 16 / 9; } }
