diff --git a/index.html b/index.html
index 0757f6e..47ea1bf 100644
--- a/index.html
+++ b/index.html
@@ -11,11 +11,19 @@
/>
-
-
+
Winbit
diff --git a/public/fonts/IBMPlexSans-Bold.otf b/public/fonts/IBMPlexSans-Bold.otf
new file mode 100644
index 0000000..5ae5057
Binary files /dev/null and b/public/fonts/IBMPlexSans-Bold.otf differ
diff --git a/public/fonts/IBMPlexSans-Medium.otf b/public/fonts/IBMPlexSans-Medium.otf
new file mode 100644
index 0000000..02bb792
Binary files /dev/null and b/public/fonts/IBMPlexSans-Medium.otf differ
diff --git a/public/fonts/IBMPlexSans-Regular.otf b/public/fonts/IBMPlexSans-Regular.otf
new file mode 100644
index 0000000..51b38a2
Binary files /dev/null and b/public/fonts/IBMPlexSans-Regular.otf differ
diff --git a/public/fonts/IBMPlexSans-SemiBold.otf b/public/fonts/IBMPlexSans-SemiBold.otf
new file mode 100644
index 0000000..23e9734
Binary files /dev/null and b/public/fonts/IBMPlexSans-SemiBold.otf differ
diff --git a/public/fonts/IBMPlexSansCondensed-Bold.otf b/public/fonts/IBMPlexSansCondensed-Bold.otf
new file mode 100644
index 0000000..340f2c2
Binary files /dev/null and b/public/fonts/IBMPlexSansCondensed-Bold.otf differ
diff --git a/public/fonts/IBMPlexSansCondensed-Medium.otf b/public/fonts/IBMPlexSansCondensed-Medium.otf
new file mode 100644
index 0000000..1b3f78d
Binary files /dev/null and b/public/fonts/IBMPlexSansCondensed-Medium.otf differ
diff --git a/public/fonts/IBMPlexSansCondensed-SemiBold.otf b/public/fonts/IBMPlexSansCondensed-SemiBold.otf
new file mode 100644
index 0000000..afb39f3
Binary files /dev/null and b/public/fonts/IBMPlexSansCondensed-SemiBold.otf differ
diff --git a/public/images/login/logo-winbit-wordmark-ink.png b/public/images/login/logo-winbit-wordmark-ink.png
new file mode 100644
index 0000000..998d75d
Binary files /dev/null and b/public/images/login/logo-winbit-wordmark-ink.png differ
diff --git a/src/index.css b/src/index.css
index a3ed357..b162075 100644
--- a/src/index.css
+++ b/src/index.css
@@ -723,14 +723,9 @@
}
.login-brand__name {
- margin: 0;
- font-family: var(--wb-font);
- font-size: 1.35rem;
- font-weight: 700;
- letter-spacing: 0.14em;
- line-height: 1;
- color: var(--login-ink);
- text-transform: uppercase;
+ display: block;
+ height: 1.65rem;
+ width: auto;
}
.login-brand__tagline {
@@ -740,7 +735,7 @@
font-weight: 600;
letter-spacing: 0.2em;
text-transform: uppercase;
- color: var(--login-green);
+ color: var(--login-green-deep);
}
/* Bloque de login desplazado a la derecha (como el mock) */
@@ -769,18 +764,18 @@
.login-panel__accent {
display: block;
- width: 1.85rem;
- height: 2px;
+ width: 3.75rem;
+ height: 1px;
margin: 0 auto 0.85rem;
- background: var(--login-green-mid);
+ background: linear-gradient(90deg, transparent, var(--login-green-mid), transparent);
}
.login-panel__title {
margin: 0;
font-family: var(--wb-font-display);
font-size: clamp(1.4rem, 5.2vw, 1.9rem);
- font-weight: 600;
- letter-spacing: 0.09em;
+ font-weight: 700;
+ letter-spacing: 0.01em;
line-height: 1.15;
text-transform: uppercase;
color: #f7f3ea;
@@ -864,6 +859,14 @@
.login-cta__shape--stroke .login-cta__inner {
background: #121412;
min-height: calc(var(--login-cta-h) - 3px);
+ clip-path: polygon(
+ var(--login-chamfer) 0,
+ 100% 0,
+ 100% calc(100% - var(--login-chamfer)),
+ calc(100% - var(--login-chamfer)) 100%,
+ 0 100%,
+ 0 var(--login-chamfer)
+ );
}
.login-cta--outline:hover:not(:disabled) .login-cta__shape--stroke .login-cta__inner {
@@ -885,6 +888,7 @@
/* Costura diagonal 45° (paralela al chaflán) */
clip-path: polygon(0 0, 100% 0, calc(100% - var(--login-cta-h)) 100%, 0 100%);
margin-right: calc(var(--login-cta-h) * -0.42);
+ padding-right: 1.5rem;
}
.login-cta-google__mark {
diff --git a/src/pages/LoginPage.jsx b/src/pages/LoginPage.jsx
index 730bc69..67f7f21 100644
--- a/src/pages/LoginPage.jsx
+++ b/src/pages/LoginPage.jsx
@@ -9,6 +9,9 @@ import { useTranslation } from 'react-i18next';
/** Mark Winbit W con fondo transparente (para zona crema). */
const WINBIT_MARK_SRC = '/images/login/logo-winbit-w-clear.png';
+/** Wordmark "WINBIT" oficial, recortado del logo institucional y recoloreado a tinta (para zona crema). */
+const WINBIT_WORDMARK_SRC = '/images/login/logo-winbit-wordmark-ink.png';
+
/** G monocromo (blanco sobre verde), como en el mock. */
const GoogleMark = () => (