diff --git a/index.html b/index.html index 2266d85..9141e86 100644 --- a/index.html +++ b/index.html @@ -54,20 +54,20 @@ /* ── Design Tokens ── */ :root { - --bg: #3a2416; - --surf1: #44301a; - --card: #50381e; - --lift: #5e4426; - --bg-deep: #241810; - --border: rgba(210, 140, 60, 0.28); - --grey: #9e8060; - --silver: #c8a882; - --light: #e4cca4; - --gold: #d88c3c; - --gold-hi: #f0a850; - --gold-lo: #8a5422; - --gold-glow: rgba(210, 140, 60, 0.22); - --white: #f8e8c8; + --bg: #efebe9; + --surf1: #e8e0da; + --card: #fff3e0; + --lift: #f5ece4; + --bg-deep: #3e2723; + --border: rgba(93, 64, 55, 0.25); + --grey: #a1887f; + --silver: #6d4c41; + --light: #5d4037; + --gold: #e65100; + --gold-hi: #fb8c00; + --gold-lo: #bf360c; + --gold-glow: rgba(230, 81, 0, 0.18); + --white: #3e2723; } /* ── Base ── */ @@ -96,7 +96,7 @@ top: 0; z-index: 500; height: 62px; - background: rgba(48, 30, 16, 0.97); + background: rgba(62, 39, 35, 0.97); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); border-bottom: 1px solid var(--border); @@ -250,9 +250,9 @@ inset: 0; background: linear-gradient( 160deg, - rgba(58, 36, 20, 0.7) 0%, - rgba(44, 26, 12, 0.48) 50%, - rgba(58, 36, 20, 0.8) 100% + rgba(239, 235, 233, 0.72) 0%, + rgba(239, 235, 233, 0.52) 50%, + rgba(239, 235, 233, 0.8) 100% ); } .hero > *:not(.hero-bg-wrap) { @@ -269,6 +269,7 @@ border-radius: 4px; height: 34px; width: 440px; + overflow: hidden; transition: border-color 0.25s, box-shadow 0.25s; @@ -285,13 +286,14 @@ padding: 0 10px; font-size: 0.78rem; font-family: "Segoe UI", system-ui, sans-serif; - color: var(--white); + color: var(--card); min-width: 0; height: 100%; } .nav-chat-input::placeholder { color: var(--grey); font-style: italic; + opacity: 0.8; } .nav-chat-send { background: none; @@ -400,9 +402,9 @@ /* ── NAV BOOK MEETING CTA ── */ .nav-cta-book { - border: 1px solid rgba(210, 140, 60, 0.38); - color: var(--silver); - -webkit-text-fill-color: var(--silver); + border: 1px solid rgba(161, 136, 127, 0.55); + color: var(--grey); + -webkit-text-fill-color: var(--grey); padding: 7px 18px; border-radius: 2px; font-size: 0.8rem; @@ -414,9 +416,9 @@ -webkit-text-fill-color 0.2s; } .nav-cta-book:hover { - border-color: var(--gold); - color: var(--gold); - -webkit-text-fill-color: var(--gold); + border-color: var(--gold-hi); + color: var(--gold-hi); + -webkit-text-fill-color: var(--gold-hi); } /* ── CHAT PANEL ── */ @@ -526,8 +528,8 @@ border-radius: 0 6px 6px 6px; } .chat-msg.user .chat-bubble { - background: var(--gold-lo); - color: var(--white); + background: var(--gold); + color: var(--card); border-radius: 6px 0 6px 6px; } .chat-thinking .chat-bubble { @@ -1091,7 +1093,7 @@ position: fixed; inset: 0; z-index: 9000; - background: rgba(14, 14, 20, 0.88); + background: rgba(62, 39, 35, 0.85); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); display: none; @@ -1102,7 +1104,7 @@ #modal-box { background: var(--card); - border: 1px solid rgba(212, 170, 80, 0.35); + border: 1px solid rgba(230, 81, 0, 0.25); border-top: 3px solid var(--gold); max-width: 480px; width: 100%; @@ -1168,8 +1170,8 @@ .modal-field { width: 100%; padding: 13px 16px; - background: rgba(10, 10, 16, 0.7); - border: 1px solid rgba(212, 170, 80, 0.25); + background: rgba(62, 39, 35, 0.07); + border: 1px solid rgba(230, 81, 0, 0.28); color: var(--white); font-size: 0.9rem; border-radius: 2px; @@ -1184,7 +1186,7 @@ } select.modal-field { - background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='8'%3E%3Cpath d='M1 1l6 6 6-6' stroke='%23D6AF52' stroke-width='1.8' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='8'%3E%3Cpath d='M1 1l6 6 6-6' stroke='%23E65100' stroke-width='1.8' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 14px center; padding-right: 40px;