body.crear-espacio-page { display: block; min-height: 100vh; background: #f4f7fb; color: #172235; }
.crear-espacio-shell { width: min(100% - 40px, 1040px); margin: 0 auto; padding: 42px 0 48px; }
.crear-espacio-brand { display: inline-flex; align-items: center; gap: 10px; color: #172235; font-size: 19px; font-weight: 850; }
.crear-espacio-brand img { width: 36px; height: 36px; }
.crear-espacio-hero { max-width: 650px; margin: 66px auto 36px; text-align: center; }
.crear-espacio-hero p { margin: 0 0 13px; color: #178b70; font-size: 12px; font-weight: 850; letter-spacing: .14em; }
.crear-espacio-hero h1 { margin: 0; color: #172235; font-size: clamp(34px, 5vw, 52px); line-height: 1.04; letter-spacing: -.055em; }
.crear-espacio-hero span { display: block; margin: 16px auto 0; color: #62748c; font-size: 16px; line-height: 1.55; }
.crear-espacio-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.crear-espacio-card { position: relative; min-height: 208px; display: flex; flex-direction: column; padding: 23px; border: 1px solid #dfe8f2; border-radius: 18px; background: #fff; color: #172235; box-shadow: 0 10px 24px rgba(29, 49, 76, .05); transition: transform .18s, border-color .18s, box-shadow .18s; }
.crear-espacio-card:hover { color: #172235; border-color: #8dcab9; box-shadow: 0 15px 28px rgba(20, 97, 81, .11); transform: translateY(-3px); }
.crear-espacio-card--casa { border: 2px solid #31c886; background: linear-gradient(145deg, #effcf5, #fff); box-shadow: 0 14px 28px rgba(29, 152, 96, .13); }
.crear-espacio-card--casa:hover { border-color: #15955a; }
.crear-espacio-card__badge { position: absolute; top: 15px; right: 15px; padding: 5px 8px; border-radius: 999px; color: #fff; background: #118552; font-size: 10px; font-weight: 900; letter-spacing: .07em; }
.crear-espacio-card__emoji { font-size: 29px; line-height: 1; }
.crear-espacio-card strong { margin-top: 19px; font-size: 17px; letter-spacing: -.02em; }
.crear-espacio-card small { margin-top: 8px; color: #647791; font-size: 13px; line-height: 1.48; }
.crear-espacio-card b { margin-top: auto; padding-top: 18px; color: #167b64; font-size: 13px; }
.crear-espacio-compare { margin-top: 54px; padding: 34px; border: 1px solid #dfe8f2; border-radius: 22px; background: #fff; box-shadow: 0 12px 26px rgba(29, 49, 76, .05); }
.crear-espacio-compare__heading { max-width: 640px; }
.crear-espacio-compare__heading p { margin: 0 0 9px; color: #178b70; font-size: 11px; font-weight: 900; letter-spacing: .12em; }
.crear-espacio-compare__heading h2 { margin: 0; font-size: 27px; letter-spacing: -.04em; }
.crear-espacio-compare__heading span { display: block; margin-top: 10px; color: #62748c; font-size: 14px; line-height: 1.5; }
.crear-espacio-table-wrap { margin-top: 24px; overflow-x: auto; border: 1px solid #e2eaf3; border-radius: 14px; }
.crear-espacio-table { width: 100%; min-width: 720px; border-collapse: collapse; font-size: 13px; }
.crear-espacio-table th, .crear-espacio-table td { padding: 13px 14px; border-bottom: 1px solid #e7eef5; text-align: center; }
.crear-espacio-table thead th { color: #364c68; background: #f4f8fc; font-size: 12px; font-weight: 850; }
.crear-espacio-table th:first-child { text-align: left; }
.crear-espacio-table tbody th { color: #50637d; font-weight: 700; }
.crear-espacio-table tbody td { color: #198456; font-size: 16px; font-weight: 850; }
.crear-espacio-table tbody td[colspan] { color: #5c708a; font-size: 13px; font-weight: 650; }
.crear-espacio-table tbody tr:last-child th, .crear-espacio-table tbody tr:last-child td { border-bottom: 0; }
.crear-espacio-login, .crear-espacio-origin { margin: 30px 0 0; color: #6b7c92; text-align: center; font-size: 14px; }
.crear-espacio-login a { color: #167b64; font-weight: 800; }
.crear-espacio-origin { margin-top: 15px; font-size: 12px; }
@media (max-width: 760px) { .crear-espacio-shell { width: min(100% - 30px, 600px); padding-top: 26px; } .crear-espacio-hero { margin: 48px auto 28px; } .crear-espacio-grid { grid-template-columns: 1fr; } .crear-espacio-card { min-height: 178px; } .crear-espacio-compare { margin-top: 32px; padding: 24px 18px; } .crear-espacio-compare__heading h2 { font-size: 24px; } }
