diff --git a/public/index.css b/public/index.css index 27a6eb1..a4d863e 100644 --- a/public/index.css +++ b/public/index.css @@ -71,10 +71,13 @@ html { scroll-behavior: smooth; } body { font-family: 'Italiana', 'Georgia', serif; + font-size: 1.08rem; + font-weight: 400; background: var(--bg); color: var(--text); line-height: 1.65; - -webkit-font-smoothing: antialiased; + -webkit-font-smoothing: subpixel-antialiased; + -moz-osx-font-smoothing: auto; } /* ── Títulos con Recion ── */ @@ -594,7 +597,7 @@ a:hover { color: var(--caoba-mid); text-decoration: underline; } HERO LANDING — título + lema + nav buttons ═══════════════════════════════════════════ */ .hero-landing { - padding: 3.5rem 0 2.5rem; + padding: 1.8rem 0 2.2rem; background: var(--bg); text-align: center; } @@ -635,31 +638,37 @@ a:hover { color: var(--caoba-mid); text-decoration: underline; } .landing-nav-btn { display: inline-flex; align-items: center; - padding: 0.6rem 1.2rem; - border-radius: 10px; - font-size: 0.88rem; - font-weight: 600; - letter-spacing: 0.02em; + justify-content: center; + padding: 0.8rem 1.8rem; + border-radius: 12px; + font-family: 'Italiana', 'Georgia', serif; + font-size: 1.15rem; + letter-spacing: 0.04em; color: var(--text); background: var(--surface); - border: 1px solid var(--border); - box-shadow: var(--btn-shadow); + border: 1.5px solid var(--border); + box-shadow: 0 4px 0 0 var(--border-dark), 0 6px 14px rgba(26,23,20,0.08); text-decoration: none; - transition: transform 120ms ease, box-shadow 120ms ease, background 120ms ease, border-color 120ms ease; + transition: + transform 140ms cubic-bezier(.2,.8,.4,1), + box-shadow 140ms ease, + background 140ms ease, + border-color 140ms ease, + color 140ms ease; user-select: none; } .landing-nav-btn:hover { - background: var(--acid-lt); - border-color: var(--acid); - box-shadow: 0 4px 0 0 #9dcc00, 0 8px 20px rgba(200,255,0,0.18); - transform: translateY(-2px); + background: #ede0cf; + border-color: #c4a07a; + box-shadow: 0 6px 0 0 #b8906a, 0 10px 24px rgba(139,94,60,0.18); + transform: translateY(-3px); text-decoration: none; - color: var(--acid-dark); + color: var(--caoba); } .landing-nav-btn:active { - box-shadow: 0 1px 0 0 #9dcc00; + box-shadow: 0 1px 0 0 #b8906a; transform: translateY(2px); } @@ -667,14 +676,15 @@ a:hover { color: var(--caoba-mid); text-decoration: underline; } background: var(--acid); color: var(--text); border-color: #9dcc00; - box-shadow: 0 4px 0 0 #7aaa00, 0 6px 16px rgba(200,255,0,0.25); + box-shadow: 0 4px 0 0 #7aaa00, 0 6px 16px rgba(200,255,0,0.28); font-weight: 700; } .landing-nav-btn--highlight:hover { background: #d4ff1a; border-color: var(--acid-dark); - box-shadow: 0 6px 0 0 #6a9800, 0 10px 24px rgba(200,255,0,0.35); + box-shadow: 0 6px 0 0 #6a9800, 0 10px 24px rgba(200,255,0,0.38); color: var(--text); + transform: translateY(-3px); } /* ═══════════════════════════════════════════ @@ -696,8 +706,8 @@ a:hover { color: var(--caoba-mid); text-decoration: underline; } text-align: center; margin-bottom: 1.8rem; } -.form-header h2 { margin-bottom: 0.4rem; } -.form-header p { color: var(--muted); font-size: 0.95rem; } +.form-header h2 { margin-bottom: 0.4rem; font-size: clamp(1.4rem, 3vw, 1.9rem); } +.form-header p { color: var(--muted); font-size: 1.05rem; } .email-row { display: flex; @@ -727,23 +737,25 @@ a:hover { color: var(--caoba-mid); text-decoration: underline; } .email-input::placeholder { color: var(--subtle); } .networks-label { - font-size: 0.9rem; - font-weight: 700; + font-family: 'Recion', 'Georgia', serif; + font-size: 1.5rem; color: var(--text); - margin-bottom: 0.9rem; - letter-spacing: 0.02em; + margin-bottom: 1.2rem; + letter-spacing: 0.03em; + text-align: center; } .networks-section { margin-bottom: 2rem; } .networks-sublabel { - font-size: 0.75rem; - font-weight: 700; - letter-spacing: 0.06em; + font-family: 'Italiana', 'Georgia', serif; + font-size: 0.88rem; + letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); - margin-bottom: 0.55rem; - margin-top: 1.2rem; + margin-bottom: 0.7rem; + margin-top: 1.4rem; + text-align: center; } .networks-sublabel:first-child { margin-top: 0; } .networks-sublabel--manual { color: var(--text); } @@ -751,17 +763,18 @@ a:hover { color: var(--caoba-mid); text-decoration: underline; } .networks-grid { display: flex; flex-wrap: wrap; - gap: 0.45rem; + gap: 0.55rem; margin-bottom: 0.25rem; + justify-content: center; } -/* Chip base — estilo botón con Italiana */ +/* Chip base — fuente de título, grande */ .net-chip { - font-family: 'Italiana', 'Georgia', serif; - font-size: 1.08rem; - letter-spacing: 0.05em; - padding: 0.6rem 1.2rem; - border-radius: 10px; + font-family: 'Recion', 'Georgia', serif; + font-size: 1.1rem; + letter-spacing: 0.04em; + padding: 0.7rem 1.45rem; + border-radius: 12px; cursor: pointer; background: var(--surface); color: var(--text);