:root{--coffee-dark: #2c1810;--coffee-medium: #4e342e;--coffee-light: #8d6e63;--gold: #d4a373;--cream: #faedcd;--bg-dark: #1a1a1a;--text-light: #f5f5f5;--text-muted: #a0a0a0}.app{background-color:var(--bg-dark)}.container{max-width:1100px;margin:0 auto;padding:0 2rem}.navbar{padding:2rem 0;position:absolute;top:0;width:100%;z-index:100}.navbar .container{display:flex;justify-content:space-between;align-items:center}.logo{font-size:1.5rem;font-weight:800;letter-spacing:3px;color:var(--text-light)}.logo span{color:var(--gold)}.nav-links{display:flex;align-items:center;gap:3rem}.nav-links a{text-decoration:none;color:var(--text-light);font-size:.8rem;text-transform:uppercase;letter-spacing:2px;transition:color .3s}.nav-links a:hover{color:var(--gold)}.nav-btn{background:var(--gold);color:var(--coffee-dark)!important;padding:.8rem 1.5rem;border-radius:4px;font-weight:700}.hero{height:100vh;background:url(https://images.unsplash.com/photo-1447933601403-0c6688de566e?w=1600&auto=format&fit=crop);background-size:cover;background-position:center;position:relative;display:flex;align-items:center}.hero-overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(to bottom,rgba(0,0,0,.7),rgba(0,0,0,.4))}.hero-content{position:relative;z-index:10}.hero-subtitle{color:var(--gold);text-transform:uppercase;letter-spacing:5px;font-size:1rem;margin-bottom:1.5rem}.hero-title{font-size:5rem;font-weight:800;line-height:1.1;margin-bottom:2rem;font-family:Playfair Display,serif}.hero-title span{color:var(--gold)}.hero-desc{max-width:500px;font-size:1.1rem;color:var(--text-muted);line-height:1.6;margin-bottom:3rem}.hero-actions{display:flex;gap:1.5rem}.btn-gold{background:var(--gold);color:var(--coffee-dark);border:none;padding:1.2rem 2.5rem;font-weight:700;cursor:pointer;text-transform:uppercase;letter-spacing:1px}.btn-outline{background:transparent;color:var(--white);border:1px solid var(--gold);padding:1.2rem 2.5rem;font-weight:700;cursor:pointer;text-transform:uppercase;letter-spacing:1px}.hero-scroll{position:absolute;bottom:40px;left:50%;transform:translate(-50%);color:var(--gold);animation:bounce 2s infinite}@keyframes bounce{0%,20%,50%,80%,to{transform:translateY(0) translate(-50%)}40%{transform:translateY(-10px) translate(-50%)}60%{transform:translateY(-5px) translate(-50%)}}.features{padding:5rem 0;background:var(--coffee-dark)}.features-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:4rem}.feature-item{text-align:center}.feature-icon{color:var(--gold);margin-bottom:1.5rem}.feature-item h3{margin-bottom:1rem;letter-spacing:1px}.feature-item p{color:var(--text-muted);font-size:.9rem;line-height:1.5}.about{padding:10rem 0}.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:6rem;align-items:center}.about-img img{width:100%;border-radius:8px;filter:grayscale(20%)}.accent-text{color:var(--gold);text-transform:uppercase;letter-spacing:3px;font-size:.9rem;display:block;margin-bottom:1rem}.about-text h2{font-size:3rem;font-family:Playfair Display,serif;margin-bottom:2rem}.about-text p{color:var(--text-muted);line-height:1.8;margin-bottom:2rem}.about-list{list-style:none}.about-list li{margin-bottom:1rem;display:flex;align-items:center;gap:1rem}.about-list li:before{content:"✓";color:var(--gold);font-weight:900}.menu{padding:8rem 0;background:#111}.section-header{text-align:center;margin-bottom:5rem}.section-header h2{font-size:3rem;font-family:Playfair Display,serif;margin-bottom:1rem}.section-header p{color:var(--text-muted)}.menu-tabs{display:flex;justify-content:center;gap:2rem;margin-bottom:5rem}.menu-tabs button{background:none;border:none;color:var(--text-muted);font-size:1rem;text-transform:uppercase;letter-spacing:2px;cursor:pointer;padding-bottom:10px;border-bottom:2px solid transparent;transition:all .3s}.menu-tabs button.active{color:var(--gold);border-bottom:2px solid var(--gold)}.menu-grid{display:grid;grid-template-columns:1fr 1fr;gap:4rem}.menu-item{margin-bottom:2rem}.menu-item-header{display:flex;justify-content:space-between;margin-bottom:.5rem}.menu-item-header h3{font-size:1.2rem;letter-spacing:1px}.price{color:var(--gold);font-weight:700}.menu-item p{color:var(--text-muted);font-size:.9rem;margin-bottom:1rem}.menu-item-border{height:1px;background:linear-gradient(to right,var(--coffee-medium),transparent)}.reservation{padding:10rem 0}.reservation-card{background:var(--coffee-dark);display:grid;grid-template-columns:1fr 1.2fr;border-radius:12px;overflow:hidden;box-shadow:0 50px 100px -20px #00000080}.reservation-info{padding:4rem;background:var(--gold);color:var(--coffee-dark)}.reservation-info h2{font-size:2.5rem;margin-bottom:1.5rem;font-family:Playfair Display,serif}.info-list{margin-top:3rem;display:flex;flex-direction:column;gap:1.5rem}.info-item{display:flex;align-items:center;gap:1rem;font-weight:600}.reservation-form{padding:4rem;position:relative}.form-row{display:flex;gap:1.5rem;margin-bottom:1.5rem}.reservation-form input,.reservation-form select{flex:1;background:transparent;border:none;border-bottom:1px solid var(--coffee-light);padding:1rem 0;color:var(--text-light);outline:none}.btn-submit{width:100%;margin-top:3rem;background:var(--gold);color:var(--coffee-dark);border:none;padding:1.2rem;font-weight:700;cursor:pointer;text-transform:uppercase}.success-overlay{text-align:center;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center}.heart-icon{color:var(--gold);margin-bottom:2rem}.footer{padding:5rem 0 3rem;border-top:1px solid #333}.footer-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:3rem}.footer-logo{font-size:1.5rem;font-weight:800;letter-spacing:3px}.footer-social{display:flex;gap:2rem;color:var(--gold)}.footer-bottom{border-top:1px solid #333;padding-top:2rem;display:flex;justify-content:space-between;font-size:.8rem;color:var(--text-muted)}.developed-by a{color:var(--gold);text-decoration:none;font-weight:700}@media (max-width: 992px){.hero-title{font-size:3.5rem}.features-grid,.about-grid,.menu-grid,.reservation-card{grid-template-columns:1fr}.nav-links{display:none}.about-text h2{font-size:2.5rem}}@media (max-width: 600px){.hero-title{font-size:2.5rem}.hero-actions{flex-direction:column}.reservation-info,.reservation-form{padding:2rem}}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Montserrat,sans-serif;background-color:#1a1a1a;color:#f5f5f5;overflow-x:hidden}html{scroll-behavior:smooth}
