body { font-family: 'JetBrains Mono', monospace; background-color: #fdf9f4; color: #1a1a1a; line-height: 1.6; }
a { text-decoration: none; }
.highlight { background-color: #fff689; padding: 0.2rem 0.4rem; font-weight: 700; display: inline-block; }
.btn-custom { position: relative; background-color: #e0d2f7; color: #000; font-weight: bold; border: 2px solid #000; box-shadow: 5px 5px 0 #000; transition: transform 0.2s ease, box-shadow 0.2s ease; }
.btn-custom .arrow { display: inline-block; margin-left: 8px; transform: translateX(-8px); opacity: 0; transition: transform 0.3s ease, opacity 0.3s ease; }
.btn-custom:hover .arrow { transform: translateX(0); opacity: 1; }
.btn-custom:hover, .section-box:hover, .chat-section:hover { transform: translateY(-2px); box-shadow: 7px 7px 0 #000; }
.subtitle { font-style: italic; font-size: 1.5rem; margin-bottom: 2rem; }
.section-box { background-color: #fffef9; border: 2px solid #000; padding: 2rem; margin-bottom: 2rem; box-shadow: 5px 5px 0 #000; transition: transform 0.2s ease, box-shadow 0.2s ease; }
.form-control, .form-select { background-color: #fff; border: 2px solid #000; font-family: 'JetBrains Mono', monospace; }
.form-control:focus, .form-select:focus { box-shadow: none; border-color: #000; }
.chat-section { background-color: #f9f6ff; padding: 3rem 2rem; border: 2px solid #000; box-shadow: 5px 5px 0 #000; margin-top: 4rem; margin-bottom: 4rem; transition: transform 0.2s ease, box-shadow 0.2s ease; }
.chat-bubble { border: 2px solid #000; background-color: #fff; display: inline-block; padding: 1rem; margin-bottom: 1rem; max-width: 75%; box-shadow: 3px 3px 0 #000; border-radius: 1pc; text-align: left; }
.chat-bubble:hover { transform: translateY(-2px); box-shadow: 5px 5px 0 #000; }
.chat-left .chat-bubble { background-color: #fffcf2; transition: transform 0.2s ease, box-shadow 0.2s ease; }
.chat-left .chat-username, .chat-right .chat-username { width: 30px; height: 30px; background-repeat: no-repeat; background-size: contain; background-position: center; display: inline-block; vertical-align: middle; }
.chat-left .chat-username { background-image: url("images/avatar-icon.svg"); }
.chat-right .chat-username { background-image: url("images/lightning-icon"); }
.chat-left { text-align: left; }
.chat-right { text-align: right; }
.chat-username { font-weight: bold; }
.chat-item { opacity: 0; transform: translateY(30px); transition: all 0.6s ease-out; }
.chat-item.visible { opacity: 1; transform: translateY(0); }
.whatsapp-float { position: fixed; bottom: 10px; right: 10px; width: 40px; height: 40px; z-index: 999; cursor: pointer; transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.4s ease-in-out; will-change: transform; }
.whatsapp-float:hover { transform: scale(1.15) translateY(-4px); }
.whatsapp-float img { width: 100%; height: 100%; transition: border-radius 0.4s ease-in-out; }
.footer-icons { width: 15px; height : 15px; }
@media screen and (max-width: 991px) { .section-box { padding: 1rem; } }