chore: wipe legacy codebase for complete project restart

This commit is contained in:
leonardo committed 2026-09-16 21:50:39 +00:00
1 parent a90af21a8c
commit e94410f388
11161 files changed
+1628844 -2097

No files matched your search

+122
View File
@@ -0,0 +1,122 @@
<!DOCTYPE html><html lang="de" class="scroll-smooth bg-[#1A1816] text-[#E6D5C3]"> <head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><link rel="icon" type="image/svg+xml" href="/favicon.svg"><meta name="generator" content="Astro v4.16.19"><!-- SEO Meta Tags --><title>Boutique Apartments &amp; Suiten in Goslar | Casa da Enzo</title><meta name="description" content="Alle 7 Ferienwohnungen &#38; Suiten der Casa da Enzo in Goslar: Von der Luxus-Komfortsuite mit Balkon bis zum romantischen Altstadt-Studio. Jetzt direkt 15% günstiger buchen."><meta name="robots" content="index, follow"><!-- Open Graph / Facebook / WhatsApp --><meta property="og:type" content="website"><meta property="og:url" content="https://casa-daenzo.de/apartments/"><meta property="og:title" content="Boutique Apartments &#38; Suiten in Goslar | Casa da Enzo"><meta property="og:description" content="Alle 7 Ferienwohnungen &#38; Suiten der Casa da Enzo in Goslar: Von der Luxus-Komfortsuite mit Balkon bis zum romantischen Altstadt-Studio. Jetzt direkt 15% günstiger buchen."><meta property="og:image" content="https://casa-daenzo.de/og-image.jpg"><!-- Twitter --><meta property="twitter:card" content="summary_large_image"><meta property="twitter:title" content="Boutique Apartments &#38; Suiten in Goslar | Casa da Enzo"><meta property="twitter:description" content="Alle 7 Ferienwohnungen &#38; Suiten der Casa da Enzo in Goslar: Von der Luxus-Komfortsuite mit Balkon bis zum romantischen Altstadt-Studio. Jetzt direkt 15% günstiger buchen."><meta property="twitter:image" content="https://casa-daenzo.de/og-image.jpg"><!-- Schema.org JSON-LD --><script type="application/ld+json">{"@context":"https://schema.org","@graph":[{"@type":"LodgingBusiness","@id":"https://casa-daenzo.de/#lodging","name":"Casa da Enzo Boutique Apartments","url":"https://casa-daenzo.de","telephone":"+4915207483196","email":"booking@casa-daenzo.de","address":{"@type":"PostalAddress","streetAddress":"Bäckerstraße 18","addressLocality":"Goslar","postalCode":"38640","addressCountry":"DE"},"geo":{"@type":"GeoCoordinates","latitude":51.906,"longitude":10.428},"checkinTime":"15:00","checkoutTime":"11:00","numberOfRooms":7},{"@type":"Restaurant","@id":"https://casa-daenzo.de/#restaurant","name":"Trattoria da Enzo","url":"https://casa-daenzo.de/#trattoria","telephone":"+49532123456","servesCuisine":"Italian","address":{"@type":"PostalAddress","streetAddress":"Bäckerstraße 18","addressLocality":"Goslar","postalCode":"38640","addressCountry":"DE"}}]}</script><!-- Google Analytics (GA4) Snippet --><script async src="https://www.googletagmanager.com/gtag/js?id=G-CASADAENZO1"></script><script>(function(){const GA_MEASUREMENT_ID = "G-CASADAENZO1";
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', GA_MEASUREMENT_ID, {
anonymize_ip: true,
cookie_flags: 'SameSite=None;Secure'
});
})();</script><link rel="stylesheet" href="/_astro/_slug_.B_TTBYoh.css"><script type="module" src="/_astro/hoisted.DhmFiA3z.js"></script></head> <body class="bg-[#1A1816] text-[#E6D5C3] antialiased min-h-screen flex flex-col selection:bg-[#D4A373] selection:text-[#1A1816]"> <header class="sticky top-0 z-40 w-full bg-stone-900/95 backdrop-blur-md border-b border-stone-800 transition-all"> <!-- Top Utility Contact Bar --> <div class="bg-stone-950 border-b border-stone-800/80 py-1.5 px-4 text-[11px] sm:text-xs"> <div class="max-w-7xl mx-auto flex flex-wrap items-center justify-between gap-2 text-stone-400"> <!-- Dual Contacts --> <div class="flex flex-wrap items-center gap-4 sm:gap-6"> <!-- Apartments Phone --> <a href="https://wa.me/4915207483196" target="_blank" rel="noopener noreferrer" class="inline-flex items-center gap-1.5 text-emerald-400 hover:text-emerald-300 font-medium transition-colors" title="Apartment Anfragen & Concierge Alja"> <span class="w-2 h-2 rounded-full bg-emerald-500"></span> <span class="text-stone-300">Apartments (WhatsApp):</span> <span class="underline font-semibold">+49 1520 7483196</span> </a> <!-- Trattoria Phone --> <a href="tel:+4915207483196" class="inline-flex items-center gap-1.5 text-[#C85A32] hover:text-[#e2724a] font-medium transition-colors" title="Trattoria Tischreservierung"> <span class="w-2 h-2 rounded-full bg-[#C85A32]"></span> <span class="text-stone-300">Trattoria:</span> <span class="underline font-semibold">+49 1520 7483196</span> </a> </div> <!-- Right Utility Links: Eviivo & Language Switch --> <div class="flex items-center gap-4"> <a href="https://guest.eviivo.com/casa-daenzo" target="_blank" rel="noopener noreferrer" class="inline-flex items-center gap-1 text-amber-400 hover:text-white transition-colors font-medium cursor-pointer" title="Digital Guest Directory"> <span>📖</span> <span class="underline">Eviivo Guest Directory</span> </a> <div class="flex items-center bg-stone-900 border border-stone-800 rounded-full px-2 py-0.5 text-[11px] font-bold"> <span class="px-1.5 py-0.5 rounded-full bg-amber-500 text-stone-950">DE</span> </div> </div> </div> </div> <!-- Main Navigation Bar --> <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 h-20 flex items-center justify-between"> <!-- Brand Logo --> <a href="/" class="flex items-center gap-3 group"> <div class="w-11 h-11 rounded-2xl bg-gradient-to-br from-[#2D5A43] via-[#D4A373] to-[#C85A32] p-0.5 shadow-lg group-hover:scale-105 transition-transform"> <div class="w-full h-full bg-stone-950 rounded-[14px] flex items-center justify-center font-serif text-xl font-bold text-amber-400">
E
</div> </div> <div class="flex flex-col"> <span class="font-serif text-xl tracking-wide font-bold text-white group-hover:text-amber-400 transition-colors">
Casa da Enzo
</span> <div class="flex items-center gap-1.5 text-[10px] tracking-widest uppercase font-sans -mt-0.5"> <span class="text-emerald-400 font-semibold">Apartments</span> <span class="text-stone-400">•</span> <span class="text-[#C85A32] font-semibold">Trattoria</span> </div> </div> </a> <!-- Desktop Navigation --> <nav class="hidden md:flex items-center gap-6 lg:gap-8 text-sm font-medium"> <a href="/apartments" class="text-stone-200 hover:text-emerald-400 transition-colors flex items-center gap-1.5"> <span class="w-1.5 h-1.5 rounded-full bg-emerald-500"></span> <span>Apartments & Suiten</span> </a> <a href="/trattoria" class="text-stone-200 hover:text-[#C85A32] transition-colors flex items-center gap-1.5"> <span class="w-1.5 h-1.5 rounded-full bg-[#C85A32]"></span> <span>Trattoria da Enzo</span> </a> <a href="/blog" class="text-stone-200 hover:text-amber-400 transition-colors">
Blog & Magazin
</a> <a href="/#geschichte" class="text-stone-200 hover:text-amber-400 transition-colors">
Unsere Geschichte
</a> <a href="/#faq" class="text-stone-200 hover:text-amber-400 transition-colors">
FAQ
</a> </nav> <!-- CTAs --> <div class="flex items-center gap-3"> <a href="/apartments#booking" class="hidden sm:inline-flex items-center gap-2 px-5 py-2.5 rounded-full bg-[#C85A32] text-white font-medium text-xs lg:text-sm hover:bg-[#b04d2a] shadow-md transition-all hover:scale-105"> <span>Direkt buchen (Bestpreis)</span> </a> <!-- Mobile Menu Button --> <button id="mobile-menu-btn" class="md:hidden p-2 text-stone-200 hover:text-amber-400 rounded-xl bg-stone-800 border border-stone-700" aria-label="Menü öffnen"> <svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16"></path> </svg> </button> </div> </div> <!-- Mobile Navigation Dropdown --> <div id="mobile-menu" class="hidden md:hidden bg-stone-950 border-b border-stone-800 px-4 py-6 space-y-4"> <a href="/apartments" class="block py-2 text-stone-200 font-medium hover:text-emerald-400 flex items-center gap-2"> <span class="w-2 h-2 rounded-full bg-emerald-500"></span> <span>Apartments & Suiten</span> </a> <a href="/trattoria" class="block py-2 text-stone-200 font-medium hover:text-[#C85A32] flex items-center gap-2"> <span class="w-2 h-2 rounded-full bg-[#C85A32]"></span> <span>Trattoria da Enzo</span> </a> <a href="/blog" class="block py-2 text-stone-200 font-medium hover:text-amber-400">
Blog & Magazin
</a> <a href="/#geschichte" class="block py-2 text-stone-200 font-medium hover:text-amber-400">
Unsere Geschichte
</a> <a href="/#faq" class="block py-2 text-stone-200 font-medium hover:text-amber-400">
FAQ
</a> <div class="pt-2 border-t border-stone-800 space-y-2"> <a href="https://wa.me/4915207483196" target="_blank" class="block py-1.5 text-xs text-emerald-400 font-semibold">
💬 Apartments WhatsApp: +49 1520 7483196
</a> <a href="https://guest.eviivo.com/casa-daenzo" target="_blank" class="block py-1.5 text-xs text-amber-400 font-semibold">
📖 Eviivo Guest Directory
</a> </div> <a href="/apartments#booking" class="block text-center py-3 rounded-2xl bg-[#C85A32] text-white font-bold text-sm">
Jetzt Direkt buchen
</a> </div> </header> <main class="flex-1"> <section class="bg-stone-900 text-white py-16 sm:py-20 border-b border-stone-800"> <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8"> <div class="text-center max-w-3xl mx-auto space-y-4"> <span class="px-4 py-1.5 rounded-full bg-amber-500/20 text-amber-400 text-xs font-semibold uppercase tracking-wider border border-amber-500/30">
Übersicht aller Wohneinheiten
</span> <h1 class="font-serif text-4xl sm:text-5xl font-bold tracking-tight text-stone-100">
Unsere 7 Boutique-Apartments in Goslar
</h1> <p class="text-stone-300 text-base sm:text-lg leading-relaxed">
Historisches Fachwerk aus dem 16. Jahrhundert, nachhaltiger Wohnkomfort mit Lehmputz, modernste Küchen und smarte Nuki-Keyless-Anreise.
</p> <!-- Ratings & Guest Directory Badges --> <div class="pt-6 flex flex-wrap items-center justify-center gap-4 text-xs font-medium text-stone-200"> <!-- Airbnb Superhost --> <div class="flex items-center gap-2 px-4 py-2 rounded-xl bg-stone-800/80 border border-stone-700 shadow-sm"> <span class="text-rose-400 text-base">★</span> <span class="font-bold">4.98</span> <span class="text-stone-400">|</span> <span class="text-amber-300 font-semibold">Airbnb Superhost</span> </div> <!-- Booking.com Top Rating --> <div class="flex items-center gap-2 px-4 py-2 rounded-xl bg-stone-800/80 border border-stone-700 shadow-sm"> <span class="px-2 py-0.5 rounded bg-blue-600 text-white font-bold text-xs">9.4</span> <span class="font-semibold text-stone-200">Booking.com Hervorragend</span> </div> <!-- Eviivo Digital Guest Directory Link --> <a href="https://guest.eviivo.com/casa-daenzo" target="_blank" rel="noopener noreferrer" class="flex items-center gap-2 px-4 py-2 rounded-xl bg-emerald-900/60 border border-emerald-600/50 text-emerald-300 hover:bg-emerald-900/90 transition-all"> <span class="text-base">📱</span> <span class="font-semibold">Eviivo Digital Guest Directory</span> <span class="text-xs text-emerald-400">↗</span> </a> </div> </div> </div> </section> <section class="py-16 bg-[#FAF6F0]"> <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8"> <!-- Category Filter Tabs --> <div class="flex flex-wrap items-center justify-center gap-2 sm:gap-3 mb-12"> <button class="filter-btn active px-6 py-2.5 rounded-full text-sm font-semibold transition-all shadow-sm bg-[#C85A32] text-white" data-category="all">
Alle Apartments (7)
</button> <button class="filter-btn px-6 py-2.5 rounded-full text-sm font-semibold transition-all shadow-sm bg-white text-stone-700 hover:bg-stone-100 border border-stone-200" data-category="suite">
Komfort-Suiten (4)
</button> <button class="filter-btn px-6 py-2.5 rounded-full text-sm font-semibold transition-all shadow-sm bg-white text-stone-700 hover:bg-stone-100 border border-stone-200" data-category="romantik">
Romantik-Apartments (2)
</button> <button class="filter-btn px-6 py-2.5 rounded-full text-sm font-semibold transition-all shadow-sm bg-white text-stone-700 hover:bg-stone-100 border border-stone-200" data-category="studio">
Boutique Studio (1)
</button> </div> <!-- Apartments Grid --> <div id="apartments-grid" class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8"> <div class="apartment-item" data-type="suite"> <div class="group stone-card stone-card-hover rounded-3xl overflow-hidden flex flex-col h-full font-sans"> <!-- Image Header --> <div class="relative aspect-[16/10] bg-[#1A1816] overflow-hidden border-b border-[#D4A373]/15"> <div class="absolute top-4 left-4 z-10 flex gap-2"> <span class="px-3 py-1 rounded-full text-xs font-bold uppercase tracking-wider shadow-md bg-[#2D5A43] text-emerald-100 border border-emerald-500/40"> Premium-Komfort </span> <span class="px-2.5 py-1 rounded-full text-xs font-bold bg-[#1A1816]/80 backdrop-blur-md text-emerald-400 border border-emerald-500/30">
🌿 Balkon/Terrasse
</span> </div> <!-- Image Placeholder / Visual Container --> <div class="w-full h-full bg-gradient-to-br from-[#2E2A25] to-[#1A1816] flex items-center justify-center text-[#D4A373] font-serif group-hover:scale-105 transition-transform duration-500 p-6 text-center"> <div class="space-y-1"> <span class="text-3xl block">🏛️</span> <span class="text-sm font-semibold text-[#E6D5C3]">Komfort-Suite 1 mit Balkon</span> </div> </div> </div> <!-- Content --> <div class="p-6 flex-1 flex flex-col justify-between space-y-6"> <div class="space-y-3"> <div class="flex items-center gap-3 text-xs font-medium text-[#A3978B]"> <span class="text-[#E6D5C3]">👤 Bis zu 4 Gäste</span> <span>•</span> <span class="text-[#E6D5C3]">📐 58 m²</span> <span>•</span> <span class="text-emerald-400 font-semibold">💻 Workstation</span> </div> <h3 class="font-serif text-2xl font-bold text-[#E6D5C3] group-hover:text-emerald-400 transition-colors"> Komfort-Suite 1 mit Balkon </h3> <p class="text-[#A3978B] text-xs leading-relaxed line-clamp-2"> Lichtdurchflutete Premium-Suite mit historischem Altstadt-Balkon und Bosch-Küche </p> <!-- Highlights list --> <ul class="space-y-1.5 text-xs text-[#E6D5C3] pt-2 border-t border-[#D4A373]/10"> <li class="flex items-center gap-2"> <span class="text-emerald-400 font-bold">✓</span> <span class="text-[#E6D5C3]">Privater Balkon zur ruhigen Bäckerstraße</span> </li><li class="flex items-center gap-2"> <span class="text-emerald-400 font-bold">✓</span> <span class="text-[#E6D5C3]">Ergonomischer Dedicated Workspace mit Highspeed-WLAN</span> </li><li class="flex items-center gap-2"> <span class="text-emerald-400 font-bold">✓</span> <span class="text-[#E6D5C3]">Nuki Keyless Smart Lock Check-in</span> </li> </ul> </div> <!-- Actions --> <div class="pt-4 border-t border-[#D4A373]/15 flex items-center justify-between gap-3"> <a href="/apartments/suite-1-balkon" class="text-xs font-semibold text-[#D4A373] hover:text-white transition-colors">
Details ansehen →
</a> <a href="#booking" class="px-4 py-2 rounded-xl bg-[#2D5A43] hover:bg-[#386d52] text-white text-xs font-bold transition-all shadow-md">
Buchen
</a> </div> </div> </div> </div><div class="apartment-item" data-type="suite"> <div class="group stone-card stone-card-hover rounded-3xl overflow-hidden flex flex-col h-full font-sans"> <!-- Image Header --> <div class="relative aspect-[16/10] bg-[#1A1816] overflow-hidden border-b border-[#D4A373]/15"> <div class="absolute top-4 left-4 z-10 flex gap-2"> <span class="px-3 py-1 rounded-full text-xs font-bold uppercase tracking-wider shadow-md bg-[#2D5A43] text-emerald-100 border border-emerald-500/40"> Premium-Komfort </span> <span class="px-2.5 py-1 rounded-full text-xs font-bold bg-[#1A1816]/80 backdrop-blur-md text-emerald-400 border border-emerald-500/30">
🌿 Balkon/Terrasse
</span> </div> <!-- Image Placeholder / Visual Container --> <div class="w-full h-full bg-gradient-to-br from-[#2E2A25] to-[#1A1816] flex items-center justify-center text-[#D4A373] font-serif group-hover:scale-105 transition-transform duration-500 p-6 text-center"> <div class="space-y-1"> <span class="text-3xl block">🏛️</span> <span class="text-sm font-semibold text-[#E6D5C3]">Komfort-Suite 2 mit Terrasse</span> </div> </div> </div> <!-- Content --> <div class="p-6 flex-1 flex flex-col justify-between space-y-6"> <div class="space-y-3"> <div class="flex items-center gap-3 text-xs font-medium text-[#A3978B]"> <span class="text-[#E6D5C3]">👤 Bis zu 4 Gäste</span> <span>•</span> <span class="text-[#E6D5C3]">📐 62 m²</span> <span>•</span> <span class="text-emerald-400 font-semibold">💻 Workstation</span> </div> <h3 class="font-serif text-2xl font-bold text-[#E6D5C3] group-hover:text-emerald-400 transition-colors"> Komfort-Suite 2 mit Terrasse </h3> <p class="text-[#A3978B] text-xs leading-relaxed line-clamp-2"> Großzügige 62m² Suite mit privatem Innenhof-Balkon und ruhiger Lage </p> <!-- Highlights list --> <ul class="space-y-1.5 text-xs text-[#E6D5C3] pt-2 border-t border-[#D4A373]/10"> <li class="flex items-center gap-2"> <span class="text-emerald-400 font-bold">✓</span> <span class="text-[#E6D5C3]">Ruhiger Balkon/Terrasse zum geschützten Innenhof</span> </li><li class="flex items-center gap-2"> <span class="text-emerald-400 font-bold">✓</span> <span class="text-[#E6D5C3]">Separates Schlafzimmer mit Boxspringbett</span> </li><li class="flex items-center gap-2"> <span class="text-emerald-400 font-bold">✓</span> <span class="text-[#E6D5C3]">Kontaktloser 24/7 Check-in via Nuki Code</span> </li> </ul> </div> <!-- Actions --> <div class="pt-4 border-t border-[#D4A373]/15 flex items-center justify-between gap-3"> <a href="/apartments/suite-2-terrasse" class="text-xs font-semibold text-[#D4A373] hover:text-white transition-colors">
Details ansehen →
</a> <a href="#booking" class="px-4 py-2 rounded-xl bg-[#2D5A43] hover:bg-[#386d52] text-white text-xs font-bold transition-all shadow-md">
Buchen
</a> </div> </div> </div> </div><div class="apartment-item" data-type="suite"> <div class="group stone-card stone-card-hover rounded-3xl overflow-hidden flex flex-col h-full font-sans"> <!-- Image Header --> <div class="relative aspect-[16/10] bg-[#1A1816] overflow-hidden border-b border-[#D4A373]/15"> <div class="absolute top-4 left-4 z-10 flex gap-2"> <span class="px-3 py-1 rounded-full text-xs font-bold uppercase tracking-wider shadow-md bg-[#2D5A43] text-emerald-100 border border-emerald-500/40"> Premium-Komfort </span> </div> <!-- Image Placeholder / Visual Container --> <div class="w-full h-full bg-gradient-to-br from-[#2E2A25] to-[#1A1816] flex items-center justify-center text-[#D4A373] font-serif group-hover:scale-105 transition-transform duration-500 p-6 text-center"> <div class="space-y-1"> <span class="text-3xl block">🏛️</span> <span class="text-sm font-semibold text-[#E6D5C3]">Komfort-Suite 3 Design</span> </div> </div> </div> <!-- Content --> <div class="p-6 flex-1 flex flex-col justify-between space-y-6"> <div class="space-y-3"> <div class="flex items-center gap-3 text-xs font-medium text-[#A3978B]"> <span class="text-[#E6D5C3]">👤 Bis zu 3 Gäste</span> <span>•</span> <span class="text-[#E6D5C3]">📐 52 m²</span> <span>•</span> <span class="text-emerald-400 font-semibold">💻 Workstation</span> </div> <h3 class="font-serif text-2xl font-bold text-[#E6D5C3] group-hover:text-emerald-400 transition-colors"> Komfort-Suite 3 Design </h3> <p class="text-[#A3978B] text-xs leading-relaxed line-clamp-2"> Elegante Altstadt-Suite mit sichtbaren Balken und edler Einrichtung </p> <!-- Highlights list --> <ul class="space-y-1.5 text-xs text-[#E6D5C3] pt-2 border-t border-[#D4A373]/10"> <li class="flex items-center gap-2"> <span class="text-emerald-400 font-bold">✓</span> <span class="text-[#E6D5C3]">Sichtbares historisches Fachwerkelement</span> </li><li class="flex items-center gap-2"> <span class="text-emerald-400 font-bold">✓</span> <span class="text-[#E6D5C3]">Highspeed Wi-Fi 6 für Remote Work</span> </li><li class="flex items-center gap-2"> <span class="text-emerald-400 font-bold">✓</span> <span class="text-[#E6D5C3]">Kontaktlose Anreise &amp; Nuki Smart Lock</span> </li> </ul> </div> <!-- Actions --> <div class="pt-4 border-t border-[#D4A373]/15 flex items-center justify-between gap-3"> <a href="/apartments/suite-3-komfort" class="text-xs font-semibold text-[#D4A373] hover:text-white transition-colors">
Details ansehen →
</a> <a href="#booking" class="px-4 py-2 rounded-xl bg-[#2D5A43] hover:bg-[#386d52] text-white text-xs font-bold transition-all shadow-md">
Buchen
</a> </div> </div> </div> </div><div class="apartment-item" data-type="suite"> <div class="group stone-card stone-card-hover rounded-3xl overflow-hidden flex flex-col h-full font-sans"> <!-- Image Header --> <div class="relative aspect-[16/10] bg-[#1A1816] overflow-hidden border-b border-[#D4A373]/15"> <div class="absolute top-4 left-4 z-10 flex gap-2"> <span class="px-3 py-1 rounded-full text-xs font-bold uppercase tracking-wider shadow-md bg-[#2D5A43] text-emerald-100 border border-emerald-500/40"> Premium-Komfort </span> </div> <!-- Image Placeholder / Visual Container --> <div class="w-full h-full bg-gradient-to-br from-[#2E2A25] to-[#1A1816] flex items-center justify-center text-[#D4A373] font-serif group-hover:scale-105 transition-transform duration-500 p-6 text-center"> <div class="space-y-1"> <span class="text-3xl block">🏛️</span> <span class="text-sm font-semibold text-[#E6D5C3]">Komfort-Suite 4 Workation</span> </div> </div> </div> <!-- Content --> <div class="p-6 flex-1 flex flex-col justify-between space-y-6"> <div class="space-y-3"> <div class="flex items-center gap-3 text-xs font-medium text-[#A3978B]"> <span class="text-[#E6D5C3]">👤 Bis zu 2 Gäste</span> <span>•</span> <span class="text-[#E6D5C3]">📐 50 m²</span> <span>•</span> <span class="text-emerald-400 font-semibold">💻 Workstation</span> </div> <h3 class="font-serif text-2xl font-bold text-[#E6D5C3] group-hover:text-emerald-400 transition-colors"> Komfort-Suite 4 Workation </h3> <p class="text-[#A3978B] text-xs leading-relaxed line-clamp-2"> Optimiert für Remote Worker, Geschäftsreisende und Long-Stays </p> <!-- Highlights list --> <ul class="space-y-1.5 text-xs text-[#E6D5C3] pt-2 border-t border-[#D4A373]/10"> <li class="flex items-center gap-2"> <span class="text-emerald-400 font-bold">✓</span> <span class="text-[#E6D5C3]">Professioneller Workstation-Schreibtisch &amp; Monitor</span> </li><li class="flex items-center gap-2"> <span class="text-emerald-400 font-bold">✓</span> <span class="text-[#E6D5C3]">100 Mbit/s Glasfaser WLAN</span> </li><li class="flex items-center gap-2"> <span class="text-emerald-400 font-bold">✓</span> <span class="text-[#E6D5C3]">Flüsterleise Lage &amp; Verdunkelungsrollos</span> </li> </ul> </div> <!-- Actions --> <div class="pt-4 border-t border-[#D4A373]/15 flex items-center justify-between gap-3"> <a href="/apartments/suite-4-workspace" class="text-xs font-semibold text-[#D4A373] hover:text-white transition-colors">
Details ansehen →
</a> <a href="#booking" class="px-4 py-2 rounded-xl bg-[#2D5A43] hover:bg-[#386d52] text-white text-xs font-bold transition-all shadow-md">
Buchen
</a> </div> </div> </div> </div><div class="apartment-item" data-type="romantik"> <div class="group stone-card stone-card-hover rounded-3xl overflow-hidden flex flex-col h-full font-sans"> <!-- Image Header --> <div class="relative aspect-[16/10] bg-[#1A1816] overflow-hidden border-b border-[#D4A373]/15"> <div class="absolute top-4 left-4 z-10 flex gap-2"> <span class="px-3 py-1 rounded-full text-xs font-bold uppercase tracking-wider shadow-md bg-[#2E2A25] text-[#D4A373] border border-[#D4A373]/30"> Klassik </span> </div> <!-- Image Placeholder / Visual Container --> <div class="w-full h-full bg-gradient-to-br from-[#2E2A25] to-[#1A1816] flex items-center justify-center text-[#D4A373] font-serif group-hover:scale-105 transition-transform duration-500 p-6 text-center"> <div class="space-y-1"> <span class="text-3xl block">🏛️</span> <span class="text-sm font-semibold text-[#E6D5C3]">Romantik-Apartment Altstadt 1</span> </div> </div> </div> <!-- Content --> <div class="p-6 flex-1 flex flex-col justify-between space-y-6"> <div class="space-y-3"> <div class="flex items-center gap-3 text-xs font-medium text-[#A3978B]"> <span class="text-[#E6D5C3]">👤 Bis zu 2 Gäste</span> <span>•</span> <span class="text-[#E6D5C3]">📐 42 m²</span> </div> <h3 class="font-serif text-2xl font-bold text-[#E6D5C3] group-hover:text-emerald-400 transition-colors"> Romantik-Apartment Altstadt 1 </h3> <p class="text-[#A3978B] text-xs leading-relaxed line-clamp-2"> Gemütliches Nest für Paare im charmanten Klassik-Stil </p> <!-- Highlights list --> <ul class="space-y-1.5 text-xs text-[#E6D5C3] pt-2 border-t border-[#D4A373]/10"> <li class="flex items-center gap-2"> <span class="text-emerald-400 font-bold">✓</span> <span class="text-[#E6D5C3]">Gemütliche Dachschrägen &amp; Fachwerk-Atmosphäre</span> </li><li class="flex items-center gap-2"> <span class="text-emerald-400 font-bold">✓</span> <span class="text-[#E6D5C3]">Kontaktloser Code-Check-in</span> </li><li class="flex items-center gap-2"> <span class="text-emerald-400 font-bold">✓</span> <span class="text-[#E6D5C3]">Ideal für Kurztrips &amp; Harz-Wochenenden</span> </li> </ul> </div> <!-- Actions --> <div class="pt-4 border-t border-[#D4A373]/15 flex items-center justify-between gap-3"> <a href="/apartments/romantik-1" class="text-xs font-semibold text-[#D4A373] hover:text-white transition-colors">
Details ansehen →
</a> <a href="#booking" class="px-4 py-2 rounded-xl bg-[#2D5A43] hover:bg-[#386d52] text-white text-xs font-bold transition-all shadow-md">
Buchen
</a> </div> </div> </div> </div><div class="apartment-item" data-type="romantik"> <div class="group stone-card stone-card-hover rounded-3xl overflow-hidden flex flex-col h-full font-sans"> <!-- Image Header --> <div class="relative aspect-[16/10] bg-[#1A1816] overflow-hidden border-b border-[#D4A373]/15"> <div class="absolute top-4 left-4 z-10 flex gap-2"> <span class="px-3 py-1 rounded-full text-xs font-bold uppercase tracking-wider shadow-md bg-[#2E2A25] text-[#D4A373] border border-[#D4A373]/30"> Klassik </span> </div> <!-- Image Placeholder / Visual Container --> <div class="w-full h-full bg-gradient-to-br from-[#2E2A25] to-[#1A1816] flex items-center justify-center text-[#D4A373] font-serif group-hover:scale-105 transition-transform duration-500 p-6 text-center"> <div class="space-y-1"> <span class="text-3xl block">🏛️</span> <span class="text-sm font-semibold text-[#E6D5C3]">Romantik-Apartment Altstadt 2</span> </div> </div> </div> <!-- Content --> <div class="p-6 flex-1 flex flex-col justify-between space-y-6"> <div class="space-y-3"> <div class="flex items-center gap-3 text-xs font-medium text-[#A3978B]"> <span class="text-[#E6D5C3]">👤 Bis zu 2 Gäste</span> <span>•</span> <span class="text-[#E6D5C3]">📐 40 m²</span> </div> <h3 class="font-serif text-2xl font-bold text-[#E6D5C3] group-hover:text-emerald-400 transition-colors"> Romantik-Apartment Altstadt 2 </h3> <p class="text-[#A3978B] text-xs leading-relaxed line-clamp-2"> Charmantes Klassik-Apartment mit italienischen Akzenten </p> <!-- Highlights list --> <ul class="space-y-1.5 text-xs text-[#E6D5C3] pt-2 border-t border-[#D4A373]/10"> <li class="flex items-center gap-2"> <span class="text-emerald-400 font-bold">✓</span> <span class="text-[#E6D5C3]">Ruhige Ausrichtung zum Innenhof</span> </li><li class="flex items-center gap-2"> <span class="text-emerald-400 font-bold">✓</span> <span class="text-[#E6D5C3]">Bequemes Doppelbett &amp; gemütliche Sitzecke</span> </li><li class="flex items-center gap-2"> <span class="text-emerald-400 font-bold">✓</span> <span class="text-[#E6D5C3]">Inklusive Tee- &amp; Kaffeeset</span> </li> </ul> </div> <!-- Actions --> <div class="pt-4 border-t border-[#D4A373]/15 flex items-center justify-between gap-3"> <a href="/apartments/romantik-2" class="text-xs font-semibold text-[#D4A373] hover:text-white transition-colors">
Details ansehen →
</a> <a href="#booking" class="px-4 py-2 rounded-xl bg-[#2D5A43] hover:bg-[#386d52] text-white text-xs font-bold transition-all shadow-md">
Buchen
</a> </div> </div> </div> </div><div class="apartment-item" data-type="studio"> <div class="group stone-card stone-card-hover rounded-3xl overflow-hidden flex flex-col h-full font-sans"> <!-- Image Header --> <div class="relative aspect-[16/10] bg-[#1A1816] overflow-hidden border-b border-[#D4A373]/15"> <div class="absolute top-4 left-4 z-10 flex gap-2"> <span class="px-3 py-1 rounded-full text-xs font-bold uppercase tracking-wider shadow-md bg-[#2E2A25] text-[#D4A373] border border-[#D4A373]/30"> Klassik </span> </div> <!-- Image Placeholder / Visual Container --> <div class="w-full h-full bg-gradient-to-br from-[#2E2A25] to-[#1A1816] flex items-center justify-center text-[#D4A373] font-serif group-hover:scale-105 transition-transform duration-500 p-6 text-center"> <div class="space-y-1"> <span class="text-3xl block">🏛️</span> <span class="text-sm font-semibold text-[#E6D5C3]">Boutique Studio Bäckerstraße</span> </div> </div> </div> <!-- Content --> <div class="p-6 flex-1 flex flex-col justify-between space-y-6"> <div class="space-y-3"> <div class="flex items-center gap-3 text-xs font-medium text-[#A3978B]"> <span class="text-[#E6D5C3]">👤 Bis zu 2 Gäste</span> <span>•</span> <span class="text-[#E6D5C3]">📐 32 m²</span> </div> <h3 class="font-serif text-2xl font-bold text-[#E6D5C3] group-hover:text-emerald-400 transition-colors"> Boutique Studio Bäckerstraße </h3> <p class="text-[#A3978B] text-xs leading-relaxed line-clamp-2"> Kompaktes, stilvolles Studio für Individualreisende &amp; Städtetrips </p> <!-- Highlights list --> <ul class="space-y-1.5 text-xs text-[#E6D5C3] pt-2 border-t border-[#D4A373]/10"> <li class="flex items-center gap-2"> <span class="text-emerald-400 font-bold">✓</span> <span class="text-[#E6D5C3]">Optimales Preis-Leistungs-Verhältnis</span> </li><li class="flex items-center gap-2"> <span class="text-emerald-400 font-bold">✓</span> <span class="text-[#E6D5C3]">Zentrale Lage in der Bäckerstraße 18</span> </li><li class="flex items-center gap-2"> <span class="text-emerald-400 font-bold">✓</span> <span class="text-[#E6D5C3]">Kontaktlose Anreise rund um die Uhr</span> </li> </ul> </div> <!-- Actions --> <div class="pt-4 border-t border-[#D4A373]/15 flex items-center justify-between gap-3"> <a href="/apartments/studio" class="text-xs font-semibold text-[#D4A373] hover:text-white transition-colors">
Details ansehen →
</a> <a href="#booking" class="px-4 py-2 rounded-xl bg-[#2D5A43] hover:bg-[#386d52] text-white text-xs font-bold transition-all shadow-md">
Buchen
</a> </div> </div> </div> </div> </div> <!-- Guest Directory Callout Banner --> <div class="mt-16 p-8 rounded-3xl bg-amber-50 border border-amber-200/80 shadow-sm flex flex-col md:flex-row items-center justify-between gap-6"> <div class="space-y-2 text-center md:text-left"> <span class="px-3 py-1 rounded-full bg-amber-200 text-[#C85A32] text-xs font-bold uppercase tracking-wider">
Eviivo Gästemappe
</span> <h3 class="font-serif text-2xl font-bold text-stone-900">
Digitaler Gästeführer & Hausordnung
</h3> <p class="text-stone-600 text-sm max-w-2xl">
Über den Eviivo Guest Directory Link findest du jederzeit alle Details zu deinem Aufenthalt, WLAN-Zugangsdaten, Empfehlungen für Restaurants und Harzer Ausflugsziele.
</p> </div> <a href="https://guest.eviivo.com/casa-daenzo" target="_blank" rel="noopener noreferrer" class="shrink-0 px-6 py-3.5 rounded-2xl bg-[#C85A32] text-white font-bold text-sm hover:bg-[#b04d2a] shadow-md transition-all flex items-center gap-2"> <span>📱 Gästemappe öffnen</span> <span>↗</span> </a> </div> </div> </section> <section id="booking" class="py-12 bg-stone-100 border-t border-stone-200 px-4"> <div class="stone-card rounded-3xl p-6 sm:p-10 max-w-4xl mx-auto my-8 font-sans border border-[#D4A373]/30 shadow-2xl"> <div class="text-center mb-8 space-y-2"> <div class="inline-flex items-center gap-2 px-3.5 py-1 rounded-full bg-[#2D5A43]/20 border border-emerald-500/40 text-emerald-400 text-xs font-bold uppercase tracking-wider"> <span>🔒 Direktbucher Bestpreis-Garantie</span> </div> <h3 class="font-serif text-2xl sm:text-3xl font-bold text-[#E6D5C3]">
Verfügbarkeit & Bestpreis prüfen
</h3> <p class="text-[#A3978B] text-xs sm:text-sm max-w-xl mx-auto">
Buche direkt über unsere Eviivo-Schnittstelle – 15% günstiger als auf Booking.com oder Airbnb. Bestpreis garantiert!
</p> </div> <!-- Booking Mask Interface --> <form action="https://onlinereservation.eviivo.com" method="GET" target="_blank" class="grid grid-cols-1 sm:grid-cols-3 gap-4"> <div class="space-y-1"> <label class="text-xs font-semibold text-[#D4A373] uppercase tracking-wider">Anreise</label> <input type="date" name="startDate" class="w-full px-4 py-3 rounded-xl bg-[#1A1816] border border-[#D4A373]/30 text-[#E6D5C3] text-xs focus:border-[#D4A373] focus:outline-none" required> </div> <div class="space-y-1"> <label class="text-xs font-semibold text-[#D4A373] uppercase tracking-wider">Abreise</label> <input type="date" name="endDate" class="w-full px-4 py-3 rounded-xl bg-[#1A1816] border border-[#D4A373]/30 text-[#E6D5C3] text-xs focus:border-[#D4A373] focus:outline-none" required> </div> <div class="space-y-1"> <label class="text-xs font-semibold text-[#D4A373] uppercase tracking-wider">Gäste</label> <select name="adults" class="w-full px-4 py-3 rounded-xl bg-[#1A1816] border border-[#D4A373]/30 text-[#E6D5C3] text-xs focus:border-[#D4A373] focus:outline-none"> <option value="1">1 Person</option> <option value="2" selected>2 Personen</option> <option value="3">3 Personen</option> <option value="4">4 Personen</option> </select> </div> <div class="sm:col-span-3 pt-2"> <button type="submit" class="w-full py-4 rounded-xl bg-gradient-to-r from-[#2D5A43] to-[#C85A32] text-white font-bold text-sm hover:opacity-95 shadow-xl transition-all">
Jetzt Verfügbarkeit & Bestpreis abrufen ➔
</button> </div> </form> <div class="mt-6 text-center text-[11px] text-[#A3978B] flex flex-wrap items-center justify-center gap-4 border-t border-[#D4A373]/10 pt-4"> <span>🔒 Sichere SSL-Schnittstelle</span> <span>•</span> <span>💳 Keine versteckten Gebühren</span> <span>•</span> <span>⚡ Sofortige Reservierungsbestätigung</span> </div> </div> </section> </main> <footer class="bg-stone-950 text-stone-400 pt-16 pb-12 border-t border-stone-800 font-sans"> <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8"> <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-12 mb-12"> <!-- Col 1: Brand & Heritage --> <div class="space-y-4"> <div class="flex items-center gap-3"> <div class="w-10 h-10 rounded-xl bg-gradient-to-br from-[#2D5A43] via-[#D4A373] to-[#C85A32] p-0.5"> <div class="w-full h-full bg-stone-950 rounded-[10px] flex items-center justify-center font-serif text-lg font-bold text-amber-400">
E
</div> </div> <div> <h3 class="font-serif text-xl font-bold text-stone-100">Casa da Enzo</h3> <p class="text-[10px] uppercase tracking-widest text-amber-400">Sizilien trifft Goslar • Seit 1980</p> </div> </div> <p class="text-xs leading-relaxed text-stone-400">
7 individuelle Boutique-Apartments über unserer traditionsreichen Trattoria im UNESCO-Weltkulturerbe Goslar. 100% digitaler Check-in trifft auf authentische italienische Gastfreundschaft.
</p> <p class="text-xs text-amber-400 font-medium">
📍 Bäckerstraße 18 • 38640 Goslar, Harz
</p> </div> <!-- Col 2: Navigation --> <div class="space-y-3"> <h4 class="font-serif text-base font-semibold text-stone-100 border-b border-stone-800 pb-2">Navigation</h4> <ul class="space-y-2 text-xs"> <li> <a href="/apartments" class="hover:text-emerald-400 transition-colors flex items-center gap-2"> <span class="w-1.5 h-1.5 rounded-full bg-emerald-500"></span> <span>Apartments & Suiten (7 Einheiten)</span> </a> </li> <li> <a href="/trattoria" class="hover:text-[#C85A32] transition-colors flex items-center gap-2"> <span class="w-1.5 h-1.5 rounded-full bg-[#C85A32]"></span> <span>Trattoria da Enzo (Speisekarte & Tisch)</span> </a> </li> <li> <a href="/trattoria#gutscheine" class="hover:text-amber-400 transition-colors flex items-center gap-2"> <span class="w-1.5 h-1.5 rounded-full bg-amber-400"></span> <span>Gutschein-Shop</span> </a> </li> <li> <a href="/blog" class="hover:text-amber-400 transition-colors">
Blog & Magazin
</a> </li> <li> <a href="/#geschichte" class="hover:text-amber-400 transition-colors">
Unsere Geschichte
</a> </li> </ul> </div> <!-- Col 3: Contacts --> <div class="space-y-3"> <h4 class="font-serif text-base font-semibold text-stone-100 border-b border-stone-800 pb-2">
Kontakt & Service
</h4> <div class="space-y-3 text-xs"> <!-- Apartments Contact --> <div class="p-3 rounded-xl bg-stone-900 border border-emerald-500/30 space-y-1"> <div class="text-[10px] uppercase font-bold text-emerald-400 flex items-center gap-1.5"> <span class="w-2 h-2 rounded-full bg-emerald-500"></span> <span>Apartments & Buchungen</span> </div> <a href="https://wa.me/4915207483196" target="_blank" class="block text-emerald-400 hover:underline font-bold">
WhatsApp: +49 1520 7483196
</a> <p class="text-[10px] text-stone-400">E-Mail: booking@casa-daenzo.de</p> </div> <!-- Trattoria Contact --> <div class="p-3 rounded-xl bg-stone-900 border border-[#C85A32]/30 space-y-1"> <div class="text-[10px] uppercase font-bold text-[#C85A32] flex items-center gap-1.5"> <span class="w-2 h-2 rounded-full bg-[#C85A32]"></span> <span>Trattoria Reservierung</span> </div> <a href="tel:+4915207483196" class="block text-[#C85A32] hover:underline font-bold">
Telefon: +49 1520 7483196
</a> <p class="text-[10px] text-stone-400">Öffnungszeiten: Di–So 17:00–22:30 Uhr</p> </div> </div> </div> <!-- Col 4: Direct Booking Advantages --> <div class="p-6 rounded-3xl bg-stone-900 border border-stone-800 space-y-4 shadow-xl"> <h4 class="font-serif text-base font-semibold text-amber-400">
Direktbucher-Vorteile
</h4> <ul class="space-y-2.5 text-xs text-stone-300"> <li class="flex items-start gap-2"> <span class="text-amber-400 font-bold">✓</span> <span>Bestpreis-Garantie (15% günstiger als Booking.com)</span> </li> <li class="flex items-start gap-2"> <span class="text-amber-400 font-bold">✓</span> <span>Bevorzugte Tischreservierung in der Trattoria</span> </li> <li class="flex items-start gap-2"> <span class="text-amber-400 font-bold">✓</span> <span>Kontaktloser Nuki Smart-Lock Check-in</span> </li> </ul> <a href="/apartments#booking" class="block text-center py-2.5 rounded-xl bg-[#C85A32] text-white font-bold text-xs hover:bg-[#b04d2a] transition-colors">
Verfügbarkeit prüfen
</a> </div> </div> <!-- Bottom line --> <div class="pt-8 border-t border-stone-900 flex flex-col sm:flex-row items-center justify-between text-xs text-stone-500 gap-4"> <p>© 2026 Casa da Enzo Goslar. Alle Rechte vorbehalten.</p> <div class="flex items-center gap-6"> <a href="https://guest.eviivo.com/casa-daenzo" target="_blank" class="hover:text-stone-300 transition-colors">Eviivo Guest Directory</a> </div> </div> </div> </footer> <div id="enzino-widget" class="fixed bottom-6 right-6 z-50 font-sans" data-lang="de"> <!-- Floating Launcher Button --> <button id="enzino-launcher" class="relative group flex items-center gap-3 bg-[#24211D] border border-[#D4A373]/30 hover:border-[#D4A373] text-[#E6D5C3] px-4 py-3 rounded-full shadow-2xl transition-all duration-300 hover:scale-105" aria-label="Enzino Concierge Chat öffnen"> <div class="relative w-10 h-10 rounded-full bg-gradient-to-br from-[#C85A32] to-[#D4A373] p-0.5 flex items-center justify-center shadow-inner"> <div class="w-full h-full rounded-full bg-[#1A1816] flex items-center justify-center text-lg font-serif font-bold text-[#D4A373]">
🇮🇹
</div> <span class="absolute -top-0.5 -right-0.5 w-3 h-3 bg-emerald-500 rounded-full border-2 border-[#1A1816] animate-pulse"></span> </div> <div class="text-left hidden sm:block"> <div class="text-xs font-serif font-bold text-[#D4A373] tracking-wide">Enzino Concierge</div> <div class="text-[10px] text-[#A3978B]">Online • Frag mich was!</div> </div> </button> <!-- Chat Dialog Window --> <div id="enzino-chat-window" class="hidden fixed bottom-6 right-6 w-[calc(100vw-3rem)] sm:w-[380px] max-h-[580px] h-[85vh] bg-[#24211D] border border-[#D4A373]/30 rounded-3xl shadow-2xl flex-col overflow-hidden transition-all duration-300 z-50"> <!-- Header --> <div class="bg-[#1A1816] border-b border-[#D4A373]/20 p-4 flex items-center justify-between"> <div class="flex items-center gap-3"> <div class="relative w-10 h-10 rounded-full bg-gradient-to-br from-[#C85A32] to-[#D4A373] p-0.5 flex items-center justify-center"> <div class="w-full h-full rounded-full bg-[#24211D] flex items-center justify-center text-lg">
👨‍🍳
</div> <span class="absolute bottom-0 right-0 w-2.5 h-2.5 bg-emerald-500 rounded-full border border-[#1A1816]"></span> </div> <div> <h3 class="font-serif text-sm font-bold text-[#E6D5C3]">Enzino da Enzo</h3> <p class="text-[10px] text-[#D4A373]">Digitaler Host & Concierge</p> </div> </div> <div class="flex items-center gap-2"> <!-- Session Disable Button --> <button id="enzino-disable-btn" title="Enzino für diese Session deaktivieren" class="p-1.5 text-[#A3978B] hover:text-amber-400 rounded-lg hover:bg-[#2A2622] text-xs transition-colors">
🚫
</button> <!-- Close Button --> <button id="enzino-close-btn" class="p-1.5 text-[#A3978B] hover:text-white rounded-lg hover:bg-[#2A2622] transition-colors" aria-label="Chat schließen">
✕
</button> </div> </div> <!-- Messages Body --> <div id="enzino-messages" class="flex-1 p-4 overflow-y-auto space-y-3.5 text-xs text-[#E6D5C3]"> <!-- Initial Bot Message --> <div class="flex gap-2.5 items-start"> <div class="w-7 h-7 rounded-full bg-[#C85A32]/20 border border-[#C85A32]/40 flex items-center justify-center text-xs shrink-0">
🇮🇹
</div> <div class="bg-[#2E2A25] border border-[#D4A373]/15 p-3 rounded-2xl rounded-tl-none max-w-[85%] leading-relaxed shadow-sm"> Ciao! I&#39;m Enzino, dein italienischer Digital Concierge 🇮🇹 Wie kann ich dir heute helfen? Frag mich nach unseren Apartments, der Trattoria oder dem digitalen Check-in! </div> </div> <!-- Quick Chips --> <div id="enzino-chips" class="flex flex-wrap gap-1.5 pt-2 pl-9"> <button class="enzino-chip text-[11px] bg-[#1A1816] hover:bg-[#C85A32]/20 text-[#D4A373] border border-[#D4A373]/30 hover:border-[#D4A373] px-3 py-1.5 rounded-full transition-all text-left" data-question="Wie funktioniert der Check-in?"> Wie funktioniert der Check-in? </button><button class="enzino-chip text-[11px] bg-[#1A1816] hover:bg-[#C85A32]/20 text-[#D4A373] border border-[#D4A373]/30 hover:border-[#D4A373] px-3 py-1.5 rounded-full transition-all text-left" data-question="Tisch in der Trattoria reservieren"> Tisch in der Trattoria reservieren </button><button class="enzino-chip text-[11px] bg-[#1A1816] hover:bg-[#C85A32]/20 text-[#D4A373] border border-[#D4A373]/30 hover:border-[#D4A373] px-3 py-1.5 rounded-full transition-all text-left" data-question="Direktbucher Bestpreis"> Direktbucher Bestpreis </button><button class="enzino-chip text-[11px] bg-[#1A1816] hover:bg-[#C85A32]/20 text-[#D4A373] border border-[#D4A373]/30 hover:border-[#D4A373] px-3 py-1.5 rounded-full transition-all text-left" data-question="Digitales Gästebuch (Eviivo)"> Digitales Gästebuch (Eviivo) </button> </div> </div> <!-- Typing Indicator (hidden by default) --> <div id="enzino-typing" class="hidden px-4 py-2 text-[11px] text-[#D4A373] italic flex items-center gap-2 bg-[#1A1816]/50"> <span class="w-2 h-2 bg-[#D4A373] rounded-full animate-ping"></span> <span>Enzino tippt...</span> </div> <!-- Input Footer --> <form id="enzino-form" class="bg-[#1A1816] border-t border-[#D4A373]/20 p-3 flex gap-2"> <input type="text" id="enzino-input" placeholder="Stelle Enzino eine Frage..." class="flex-1 bg-[#24211D] border border-[#D4A373]/20 focus:border-[#D4A373] text-[#E6D5C3] placeholder-[#A3978B] text-xs rounded-xl px-3 py-2.5 outline-none transition-all" autocomplete="off"> <button type="submit" class="bg-[#C85A32] hover:bg-[#b04d2a] text-white px-3.5 py-2.5 rounded-xl text-xs font-bold transition-all shrink-0">
➔
</button> </form> </div> </div> </body></html>
+83
View File
@@ -0,0 +1,83 @@
<!DOCTYPE html><html lang="de" class="scroll-smooth bg-[#1A1816] text-[#E6D5C3]"> <head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><link rel="icon" type="image/svg+xml" href="/favicon.svg"><meta name="generator" content="Astro v4.16.19"><!-- SEO Meta Tags --><title>Romantik-Apartment Altstadt 1 | Casa da Enzo Goslar</title><meta name="description" content="Gemütliches Nest für Paare im charmanten Klassik-Stil"><meta name="robots" content="index, follow"><!-- Open Graph / Facebook / WhatsApp --><meta property="og:type" content="website"><meta property="og:url" content="https://casa-daenzo.de/apartments/romantik-1/"><meta property="og:title" content="Romantik-Apartment Altstadt 1 | Casa da Enzo Goslar"><meta property="og:description" content="Gemütliches Nest für Paare im charmanten Klassik-Stil"><meta property="og:image" content="https://casa-daenzo.de/og-image.jpg"><!-- Twitter --><meta property="twitter:card" content="summary_large_image"><meta property="twitter:title" content="Romantik-Apartment Altstadt 1 | Casa da Enzo Goslar"><meta property="twitter:description" content="Gemütliches Nest für Paare im charmanten Klassik-Stil"><meta property="twitter:image" content="https://casa-daenzo.de/og-image.jpg"><!-- Schema.org JSON-LD --><script type="application/ld+json">{"@context":"https://schema.org","@graph":[{"@type":"LodgingBusiness","@id":"https://casa-daenzo.de/#lodging","name":"Casa da Enzo Boutique Apartments","url":"https://casa-daenzo.de","telephone":"+4915207483196","email":"booking@casa-daenzo.de","address":{"@type":"PostalAddress","streetAddress":"Bäckerstraße 18","addressLocality":"Goslar","postalCode":"38640","addressCountry":"DE"},"geo":{"@type":"GeoCoordinates","latitude":51.906,"longitude":10.428},"checkinTime":"15:00","checkoutTime":"11:00","numberOfRooms":7},{"@type":"Restaurant","@id":"https://casa-daenzo.de/#restaurant","name":"Trattoria da Enzo","url":"https://casa-daenzo.de/#trattoria","telephone":"+49532123456","servesCuisine":"Italian","address":{"@type":"PostalAddress","streetAddress":"Bäckerstraße 18","addressLocality":"Goslar","postalCode":"38640","addressCountry":"DE"}}]}</script><!-- Google Analytics (GA4) Snippet --><script async src="https://www.googletagmanager.com/gtag/js?id=G-CASADAENZO1"></script><script>(function(){const GA_MEASUREMENT_ID = "G-CASADAENZO1";
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', GA_MEASUREMENT_ID, {
anonymize_ip: true,
cookie_flags: 'SameSite=None;Secure'
});
})();</script><link rel="stylesheet" href="/_astro/_slug_.B_TTBYoh.css"><script type="module" src="/_astro/hoisted.jAcVTPu2.js"></script></head> <body class="bg-[#1A1816] text-[#E6D5C3] antialiased min-h-screen flex flex-col selection:bg-[#D4A373] selection:text-[#1A1816]"> <header class="sticky top-0 z-40 w-full bg-stone-900/95 backdrop-blur-md border-b border-stone-800 transition-all"> <!-- Top Utility Contact Bar --> <div class="bg-stone-950 border-b border-stone-800/80 py-1.5 px-4 text-[11px] sm:text-xs"> <div class="max-w-7xl mx-auto flex flex-wrap items-center justify-between gap-2 text-stone-400"> <!-- Dual Contacts --> <div class="flex flex-wrap items-center gap-4 sm:gap-6"> <!-- Apartments Phone --> <a href="https://wa.me/4915207483196" target="_blank" rel="noopener noreferrer" class="inline-flex items-center gap-1.5 text-emerald-400 hover:text-emerald-300 font-medium transition-colors" title="Apartment Anfragen & Concierge Alja"> <span class="w-2 h-2 rounded-full bg-emerald-500"></span> <span class="text-stone-300">Apartments (WhatsApp):</span> <span class="underline font-semibold">+49 1520 7483196</span> </a> <!-- Trattoria Phone --> <a href="tel:+4915207483196" class="inline-flex items-center gap-1.5 text-[#C85A32] hover:text-[#e2724a] font-medium transition-colors" title="Trattoria Tischreservierung"> <span class="w-2 h-2 rounded-full bg-[#C85A32]"></span> <span class="text-stone-300">Trattoria:</span> <span class="underline font-semibold">+49 1520 7483196</span> </a> </div> <!-- Right Utility Links: Eviivo & Language Switch --> <div class="flex items-center gap-4"> <a href="https://guest.eviivo.com/casa-daenzo" target="_blank" rel="noopener noreferrer" class="inline-flex items-center gap-1 text-amber-400 hover:text-white transition-colors font-medium cursor-pointer" title="Digital Guest Directory"> <span>📖</span> <span class="underline">Eviivo Guest Directory</span> </a> <div class="flex items-center bg-stone-900 border border-stone-800 rounded-full px-2 py-0.5 text-[11px] font-bold"> <span class="px-1.5 py-0.5 rounded-full bg-amber-500 text-stone-950">DE</span> </div> </div> </div> </div> <!-- Main Navigation Bar --> <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 h-20 flex items-center justify-between"> <!-- Brand Logo --> <a href="/" class="flex items-center gap-3 group"> <div class="w-11 h-11 rounded-2xl bg-gradient-to-br from-[#2D5A43] via-[#D4A373] to-[#C85A32] p-0.5 shadow-lg group-hover:scale-105 transition-transform"> <div class="w-full h-full bg-stone-950 rounded-[14px] flex items-center justify-center font-serif text-xl font-bold text-amber-400">
E
</div> </div> <div class="flex flex-col"> <span class="font-serif text-xl tracking-wide font-bold text-white group-hover:text-amber-400 transition-colors">
Casa da Enzo
</span> <div class="flex items-center gap-1.5 text-[10px] tracking-widest uppercase font-sans -mt-0.5"> <span class="text-emerald-400 font-semibold">Apartments</span> <span class="text-stone-400">•</span> <span class="text-[#C85A32] font-semibold">Trattoria</span> </div> </div> </a> <!-- Desktop Navigation --> <nav class="hidden md:flex items-center gap-6 lg:gap-8 text-sm font-medium"> <a href="/apartments" class="text-stone-200 hover:text-emerald-400 transition-colors flex items-center gap-1.5"> <span class="w-1.5 h-1.5 rounded-full bg-emerald-500"></span> <span>Apartments & Suiten</span> </a> <a href="/trattoria" class="text-stone-200 hover:text-[#C85A32] transition-colors flex items-center gap-1.5"> <span class="w-1.5 h-1.5 rounded-full bg-[#C85A32]"></span> <span>Trattoria da Enzo</span> </a> <a href="/blog" class="text-stone-200 hover:text-amber-400 transition-colors">
Blog & Magazin
</a> <a href="/#geschichte" class="text-stone-200 hover:text-amber-400 transition-colors">
Unsere Geschichte
</a> <a href="/#faq" class="text-stone-200 hover:text-amber-400 transition-colors">
FAQ
</a> </nav> <!-- CTAs --> <div class="flex items-center gap-3"> <a href="/apartments#booking" class="hidden sm:inline-flex items-center gap-2 px-5 py-2.5 rounded-full bg-[#C85A32] text-white font-medium text-xs lg:text-sm hover:bg-[#b04d2a] shadow-md transition-all hover:scale-105"> <span>Direkt buchen (Bestpreis)</span> </a> <!-- Mobile Menu Button --> <button id="mobile-menu-btn" class="md:hidden p-2 text-stone-200 hover:text-amber-400 rounded-xl bg-stone-800 border border-stone-700" aria-label="Menü öffnen"> <svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16"></path> </svg> </button> </div> </div> <!-- Mobile Navigation Dropdown --> <div id="mobile-menu" class="hidden md:hidden bg-stone-950 border-b border-stone-800 px-4 py-6 space-y-4"> <a href="/apartments" class="block py-2 text-stone-200 font-medium hover:text-emerald-400 flex items-center gap-2"> <span class="w-2 h-2 rounded-full bg-emerald-500"></span> <span>Apartments & Suiten</span> </a> <a href="/trattoria" class="block py-2 text-stone-200 font-medium hover:text-[#C85A32] flex items-center gap-2"> <span class="w-2 h-2 rounded-full bg-[#C85A32]"></span> <span>Trattoria da Enzo</span> </a> <a href="/blog" class="block py-2 text-stone-200 font-medium hover:text-amber-400">
Blog & Magazin
</a> <a href="/#geschichte" class="block py-2 text-stone-200 font-medium hover:text-amber-400">
Unsere Geschichte
</a> <a href="/#faq" class="block py-2 text-stone-200 font-medium hover:text-amber-400">
FAQ
</a> <div class="pt-2 border-t border-stone-800 space-y-2"> <a href="https://wa.me/4915207483196" target="_blank" class="block py-1.5 text-xs text-emerald-400 font-semibold">
💬 Apartments WhatsApp: +49 1520 7483196
</a> <a href="https://guest.eviivo.com/casa-daenzo" target="_blank" class="block py-1.5 text-xs text-amber-400 font-semibold">
📖 Eviivo Guest Directory
</a> </div> <a href="/apartments#booking" class="block text-center py-3 rounded-2xl bg-[#C85A32] text-white font-bold text-sm">
Jetzt Direkt buchen
</a> </div> </header> <main class="flex-1"> <div class="py-12 bg-[#1A1816]"> <div class="max-w-5xl mx-auto px-4 sm:px-6 lg:px-8 space-y-8"> <!-- Back Link & Top Badges Bar --> <div class="flex flex-col sm:flex-row sm:items-center justify-between gap-4"> <a href="/#apartments" class="inline-flex items-center gap-2 text-xs font-bold text-emerald-400 hover:underline">
← Zurück zu allen Apartments
</a> <!-- Airbnb & Booking Badges + Eviivo Guest Directory --> <div class="flex flex-wrap items-center gap-3 text-xs font-medium"> <span class="px-3 py-1 rounded-full bg-[#24211D] border border-[#D4A373]/20 text-[#E6D5C3]">
★ <strong class="text-[#D4A373]">4.98</strong> Superhost
</span> <span class="px-3 py-1 rounded-full bg-[#24211D] border border-[#D4A373]/20 text-[#E6D5C3]">
Booking.com <strong class="text-blue-400">9.8</strong> </span> <button onclick="document.getElementById('eviivo-link-btn')?.click()" class="px-3 py-1 rounded-full bg-[#2D5A43]/30 border border-emerald-500/40 text-emerald-400 hover:bg-[#2D5A43]/50 transition-colors flex items-center gap-1 font-semibold"> <span>📖 Eviivo Gästemappe</span> </button> </div> </div> <!-- Title & Header --> <div class="space-y-3"> <span class="inline-block px-3 py-1 rounded-full text-xs font-bold uppercase tracking-wider bg-[#24211D] text-[#D4A373] border border-[#D4A373]/30"> Klassik </span> <h1 class="font-serif text-4xl sm:text-5xl font-bold text-[#E6D5C3]">Romantik-Apartment Altstadt 1</h1> <p class="text-[#A3978B] text-base sm:text-lg leading-relaxed">Gemütliches Nest für Paare im charmanten Klassik-Stil</p> </div> <!-- Quick Specs Bar --> <div class="grid grid-cols-2 sm:grid-cols-4 gap-4 p-6 rounded-3xl stone-card border border-[#D4A373]/20 text-center"> <div> <span class="block text-[10px] uppercase tracking-wider text-[#D4A373] font-bold">Kapazität</span> <span class="font-serif text-lg font-bold text-[#E6D5C3] mt-1 block">👥 Bis 2 Gäste</span> </div> <div> <span class="block text-[10px] uppercase tracking-wider text-[#D4A373] font-bold">Größe</span> <span class="font-serif text-lg font-bold text-[#E6D5C3] mt-1 block">📐 42 m²</span> </div> <div> <span class="block text-[10px] uppercase tracking-wider text-[#D4A373] font-bold">Aussicht</span> <span class="font-serif text-lg font-bold text-[#E6D5C3] mt-1 block">Altstadtblick</span> </div> <div> <span class="block text-[10px] uppercase tracking-wider text-[#D4A373] font-bold">Workspace</span> <span class="font-serif text-lg font-bold text-[#E6D5C3] mt-1 block">⚡ Wi-Fi 6</span> </div> </div> <!-- Visual Gallery Placeholder Banner --> <div class="aspect-[21/9] rounded-3xl bg-gradient-to-br from-[#2E2A25] to-[#1A1816] text-[#E6D5C3] flex flex-col items-center justify-center p-6 text-center border border-[#D4A373]/20 relative overflow-hidden shadow-2xl"> <div class="relative z-10 space-y-2"> <span class="px-3.5 py-1 rounded-full bg-[#2D5A43]/30 text-emerald-400 text-xs font-bold uppercase tracking-widest border border-emerald-500/30">
Saniert 2025 • UNESCO Altstadt Goslar
</span> <h2 class="font-serif text-2xl sm:text-3xl font-bold">Romantik-Apartment Altstadt 1</h2> <p class="text-[#A3978B] text-xs sm:text-sm max-w-md mx-auto">
Restauriertes Fachwerk aus dem 16. Jahrhundert kombiniert mit italienischem Design & smartem Nuki Keyless Check-in.
</p> </div> </div> <!-- Highlights & Details --> <div class="grid grid-cols-1 md:grid-cols-3 gap-8 pt-4"> <div class="md:col-span-2 space-y-6 stone-card p-8 rounded-3xl border border-[#D4A373]/20"> <h2 class="font-serif text-2xl font-bold text-[#E6D5C3]">Beschreibung & Ausstattung</h2> <div class="prose prose-invert max-w-none text-[#E6D5C3] text-sm leading-relaxed"> <p>Klassischer Charme und behagliche Wärme: Unser Romantik-Apartment 1 ist die ideale Basis für romantische Harz-Wochenenden und Entdeckungstouren durch Goslar.</p> </div> <div class="pt-6 border-t border-[#D4A373]/15"> <h3 class="font-serif text-lg font-bold text-[#D4A373] mb-2">Küche & Verpflegung</h3> <p class="text-[#A3978B] text-xs leading-relaxed">Voll ausgestattete Küchenzeile</p> </div> <div class="pt-4 border-t border-[#D4A373]/15 flex flex-wrap items-center justify-between gap-4 text-xs text-[#A3978B]"> <span>🔑 Nuki Smart Lock PIN Check-in ab 15:00 Uhr</span> <span>🌿 Nachhaltige Lehmdämmung für gesunden Schlaf</span> </div> </div> <!-- Sidebar / Highlights --> <div class="space-y-6"> <div class="stone-card p-6 rounded-3xl space-y-4 border border-[#D4A373]/30 shadow-xl"> <h3 class="font-serif text-xl font-bold text-[#D4A373]">Ausstattungs-Highlights</h3> <ul class="space-y-3 text-xs text-[#E6D5C3]"> <li class="flex items-start gap-3"> <span class="text-emerald-400 font-bold">✓</span> <span>Gemütliche Dachschrägen &amp; Fachwerk-Atmosphäre</span> </li><li class="flex items-start gap-3"> <span class="text-emerald-400 font-bold">✓</span> <span>Kontaktloser Code-Check-in</span> </li><li class="flex items-start gap-3"> <span class="text-emerald-400 font-bold">✓</span> <span>Ideal für Kurztrips &amp; Harz-Wochenenden</span> </li> </ul> </div> <!-- Trattoria Info Card --> <div class="stone-card border border-[#C85A32]/40 p-6 rounded-3xl space-y-3"> <span class="text-xs font-bold uppercase tracking-wider text-[#C85A32]">Hauseigene Gastronomie</span> <h4 class="font-serif text-lg font-bold text-[#E6D5C3]">Trattoria da Enzo im Erdgeschoss</h4> <p class="text-xs text-[#A3978B] leading-relaxed">
Als Hotelgast genießt du eine bevorzugte Tischreservierung bei Alessandra. Genieße hausgemachte Pasta und sizilianische Weine direkt im Haus!
</p> <a href="tel:+49532123456" class="inline-block text-xs font-bold text-[#C85A32] hover:underline">
📞 Tisch reservieren: +49 5321 23456 →
</a> </div> </div> </div> <!-- Eviivo Booking Widget --> <section id="booking" class="pt-6"> <div class="stone-card rounded-3xl p-6 sm:p-10 max-w-4xl mx-auto my-8 font-sans border border-[#D4A373]/30 shadow-2xl"> <div class="text-center mb-8 space-y-2"> <div class="inline-flex items-center gap-2 px-3.5 py-1 rounded-full bg-[#2D5A43]/20 border border-emerald-500/40 text-emerald-400 text-xs font-bold uppercase tracking-wider"> <span>🔒 Direktbucher Bestpreis-Garantie</span> </div> <h3 class="font-serif text-2xl sm:text-3xl font-bold text-[#E6D5C3]">
Verfügbarkeit & Bestpreis prüfen
</h3> <p class="text-[#A3978B] text-xs sm:text-sm max-w-xl mx-auto">
Buche direkt über unsere Eviivo-Schnittstelle – 15% günstiger als auf Booking.com oder Airbnb. Bestpreis garantiert!
</p> </div> <!-- Booking Mask Interface --> <form action="https://onlinereservation.eviivo.com" method="GET" target="_blank" class="grid grid-cols-1 sm:grid-cols-3 gap-4"> <div class="space-y-1"> <label class="text-xs font-semibold text-[#D4A373] uppercase tracking-wider">Anreise</label> <input type="date" name="startDate" class="w-full px-4 py-3 rounded-xl bg-[#1A1816] border border-[#D4A373]/30 text-[#E6D5C3] text-xs focus:border-[#D4A373] focus:outline-none" required> </div> <div class="space-y-1"> <label class="text-xs font-semibold text-[#D4A373] uppercase tracking-wider">Abreise</label> <input type="date" name="endDate" class="w-full px-4 py-3 rounded-xl bg-[#1A1816] border border-[#D4A373]/30 text-[#E6D5C3] text-xs focus:border-[#D4A373] focus:outline-none" required> </div> <div class="space-y-1"> <label class="text-xs font-semibold text-[#D4A373] uppercase tracking-wider">Gäste</label> <select name="adults" class="w-full px-4 py-3 rounded-xl bg-[#1A1816] border border-[#D4A373]/30 text-[#E6D5C3] text-xs focus:border-[#D4A373] focus:outline-none"> <option value="1">1 Person</option> <option value="2" selected>2 Personen</option> <option value="3">3 Personen</option> <option value="4">4 Personen</option> </select> </div> <div class="sm:col-span-3 pt-2"> <button type="submit" class="w-full py-4 rounded-xl bg-gradient-to-r from-[#2D5A43] to-[#C85A32] text-white font-bold text-sm hover:opacity-95 shadow-xl transition-all">
Jetzt Verfügbarkeit & Bestpreis abrufen ➔
</button> </div> </form> <div class="mt-6 text-center text-[11px] text-[#A3978B] flex flex-wrap items-center justify-center gap-4 border-t border-[#D4A373]/10 pt-4"> <span>🔒 Sichere SSL-Schnittstelle</span> <span>•</span> <span>💳 Keine versteckten Gebühren</span> <span>•</span> <span>⚡ Sofortige Reservierungsbestätigung</span> </div> </div> </section> </div> </div> </main> <footer class="bg-stone-950 text-stone-400 pt-16 pb-12 border-t border-stone-800 font-sans"> <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8"> <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-12 mb-12"> <!-- Col 1: Brand & Heritage --> <div class="space-y-4"> <div class="flex items-center gap-3"> <div class="w-10 h-10 rounded-xl bg-gradient-to-br from-[#2D5A43] via-[#D4A373] to-[#C85A32] p-0.5"> <div class="w-full h-full bg-stone-950 rounded-[10px] flex items-center justify-center font-serif text-lg font-bold text-amber-400">
E
</div> </div> <div> <h3 class="font-serif text-xl font-bold text-stone-100">Casa da Enzo</h3> <p class="text-[10px] uppercase tracking-widest text-amber-400">Sizilien trifft Goslar • Seit 1980</p> </div> </div> <p class="text-xs leading-relaxed text-stone-400">
7 individuelle Boutique-Apartments über unserer traditionsreichen Trattoria im UNESCO-Weltkulturerbe Goslar. 100% digitaler Check-in trifft auf authentische italienische Gastfreundschaft.
</p> <p class="text-xs text-amber-400 font-medium">
📍 Bäckerstraße 18 • 38640 Goslar, Harz
</p> </div> <!-- Col 2: Navigation --> <div class="space-y-3"> <h4 class="font-serif text-base font-semibold text-stone-100 border-b border-stone-800 pb-2">Navigation</h4> <ul class="space-y-2 text-xs"> <li> <a href="/apartments" class="hover:text-emerald-400 transition-colors flex items-center gap-2"> <span class="w-1.5 h-1.5 rounded-full bg-emerald-500"></span> <span>Apartments & Suiten (7 Einheiten)</span> </a> </li> <li> <a href="/trattoria" class="hover:text-[#C85A32] transition-colors flex items-center gap-2"> <span class="w-1.5 h-1.5 rounded-full bg-[#C85A32]"></span> <span>Trattoria da Enzo (Speisekarte & Tisch)</span> </a> </li> <li> <a href="/trattoria#gutscheine" class="hover:text-amber-400 transition-colors flex items-center gap-2"> <span class="w-1.5 h-1.5 rounded-full bg-amber-400"></span> <span>Gutschein-Shop</span> </a> </li> <li> <a href="/blog" class="hover:text-amber-400 transition-colors">
Blog & Magazin
</a> </li> <li> <a href="/#geschichte" class="hover:text-amber-400 transition-colors">
Unsere Geschichte
</a> </li> </ul> </div> <!-- Col 3: Contacts --> <div class="space-y-3"> <h4 class="font-serif text-base font-semibold text-stone-100 border-b border-stone-800 pb-2">
Kontakt & Service
</h4> <div class="space-y-3 text-xs"> <!-- Apartments Contact --> <div class="p-3 rounded-xl bg-stone-900 border border-emerald-500/30 space-y-1"> <div class="text-[10px] uppercase font-bold text-emerald-400 flex items-center gap-1.5"> <span class="w-2 h-2 rounded-full bg-emerald-500"></span> <span>Apartments & Buchungen</span> </div> <a href="https://wa.me/4915207483196" target="_blank" class="block text-emerald-400 hover:underline font-bold">
WhatsApp: +49 1520 7483196
</a> <p class="text-[10px] text-stone-400">E-Mail: booking@casa-daenzo.de</p> </div> <!-- Trattoria Contact --> <div class="p-3 rounded-xl bg-stone-900 border border-[#C85A32]/30 space-y-1"> <div class="text-[10px] uppercase font-bold text-[#C85A32] flex items-center gap-1.5"> <span class="w-2 h-2 rounded-full bg-[#C85A32]"></span> <span>Trattoria Reservierung</span> </div> <a href="tel:+4915207483196" class="block text-[#C85A32] hover:underline font-bold">
Telefon: +49 1520 7483196
</a> <p class="text-[10px] text-stone-400">Öffnungszeiten: Di–So 17:00–22:30 Uhr</p> </div> </div> </div> <!-- Col 4: Direct Booking Advantages --> <div class="p-6 rounded-3xl bg-stone-900 border border-stone-800 space-y-4 shadow-xl"> <h4 class="font-serif text-base font-semibold text-amber-400">
Direktbucher-Vorteile
</h4> <ul class="space-y-2.5 text-xs text-stone-300"> <li class="flex items-start gap-2"> <span class="text-amber-400 font-bold">✓</span> <span>Bestpreis-Garantie (15% günstiger als Booking.com)</span> </li> <li class="flex items-start gap-2"> <span class="text-amber-400 font-bold">✓</span> <span>Bevorzugte Tischreservierung in der Trattoria</span> </li> <li class="flex items-start gap-2"> <span class="text-amber-400 font-bold">✓</span> <span>Kontaktloser Nuki Smart-Lock Check-in</span> </li> </ul> <a href="/apartments#booking" class="block text-center py-2.5 rounded-xl bg-[#C85A32] text-white font-bold text-xs hover:bg-[#b04d2a] transition-colors">
Verfügbarkeit prüfen
</a> </div> </div> <!-- Bottom line --> <div class="pt-8 border-t border-stone-900 flex flex-col sm:flex-row items-center justify-between text-xs text-stone-500 gap-4"> <p>© 2026 Casa da Enzo Goslar. Alle Rechte vorbehalten.</p> <div class="flex items-center gap-6"> <a href="https://guest.eviivo.com/casa-daenzo" target="_blank" class="hover:text-stone-300 transition-colors">Eviivo Guest Directory</a> </div> </div> </div> </footer> <div id="enzino-widget" class="fixed bottom-6 right-6 z-50 font-sans" data-lang="de"> <!-- Floating Launcher Button --> <button id="enzino-launcher" class="relative group flex items-center gap-3 bg-[#24211D] border border-[#D4A373]/30 hover:border-[#D4A373] text-[#E6D5C3] px-4 py-3 rounded-full shadow-2xl transition-all duration-300 hover:scale-105" aria-label="Enzino Concierge Chat öffnen"> <div class="relative w-10 h-10 rounded-full bg-gradient-to-br from-[#C85A32] to-[#D4A373] p-0.5 flex items-center justify-center shadow-inner"> <div class="w-full h-full rounded-full bg-[#1A1816] flex items-center justify-center text-lg font-serif font-bold text-[#D4A373]">
🇮🇹
</div> <span class="absolute -top-0.5 -right-0.5 w-3 h-3 bg-emerald-500 rounded-full border-2 border-[#1A1816] animate-pulse"></span> </div> <div class="text-left hidden sm:block"> <div class="text-xs font-serif font-bold text-[#D4A373] tracking-wide">Enzino Concierge</div> <div class="text-[10px] text-[#A3978B]">Online • Frag mich was!</div> </div> </button> <!-- Chat Dialog Window --> <div id="enzino-chat-window" class="hidden fixed bottom-6 right-6 w-[calc(100vw-3rem)] sm:w-[380px] max-h-[580px] h-[85vh] bg-[#24211D] border border-[#D4A373]/30 rounded-3xl shadow-2xl flex-col overflow-hidden transition-all duration-300 z-50"> <!-- Header --> <div class="bg-[#1A1816] border-b border-[#D4A373]/20 p-4 flex items-center justify-between"> <div class="flex items-center gap-3"> <div class="relative w-10 h-10 rounded-full bg-gradient-to-br from-[#C85A32] to-[#D4A373] p-0.5 flex items-center justify-center"> <div class="w-full h-full rounded-full bg-[#24211D] flex items-center justify-center text-lg">
👨‍🍳
</div> <span class="absolute bottom-0 right-0 w-2.5 h-2.5 bg-emerald-500 rounded-full border border-[#1A1816]"></span> </div> <div> <h3 class="font-serif text-sm font-bold text-[#E6D5C3]">Enzino da Enzo</h3> <p class="text-[10px] text-[#D4A373]">Digitaler Host & Concierge</p> </div> </div> <div class="flex items-center gap-2"> <!-- Session Disable Button --> <button id="enzino-disable-btn" title="Enzino für diese Session deaktivieren" class="p-1.5 text-[#A3978B] hover:text-amber-400 rounded-lg hover:bg-[#2A2622] text-xs transition-colors">
🚫
</button> <!-- Close Button --> <button id="enzino-close-btn" class="p-1.5 text-[#A3978B] hover:text-white rounded-lg hover:bg-[#2A2622] transition-colors" aria-label="Chat schließen">
✕
</button> </div> </div> <!-- Messages Body --> <div id="enzino-messages" class="flex-1 p-4 overflow-y-auto space-y-3.5 text-xs text-[#E6D5C3]"> <!-- Initial Bot Message --> <div class="flex gap-2.5 items-start"> <div class="w-7 h-7 rounded-full bg-[#C85A32]/20 border border-[#C85A32]/40 flex items-center justify-center text-xs shrink-0">
🇮🇹
</div> <div class="bg-[#2E2A25] border border-[#D4A373]/15 p-3 rounded-2xl rounded-tl-none max-w-[85%] leading-relaxed shadow-sm"> Ciao! I&#39;m Enzino, dein italienischer Digital Concierge 🇮🇹 Wie kann ich dir heute helfen? Frag mich nach unseren Apartments, der Trattoria oder dem digitalen Check-in! </div> </div> <!-- Quick Chips --> <div id="enzino-chips" class="flex flex-wrap gap-1.5 pt-2 pl-9"> <button class="enzino-chip text-[11px] bg-[#1A1816] hover:bg-[#C85A32]/20 text-[#D4A373] border border-[#D4A373]/30 hover:border-[#D4A373] px-3 py-1.5 rounded-full transition-all text-left" data-question="Wie funktioniert der Check-in?"> Wie funktioniert der Check-in? </button><button class="enzino-chip text-[11px] bg-[#1A1816] hover:bg-[#C85A32]/20 text-[#D4A373] border border-[#D4A373]/30 hover:border-[#D4A373] px-3 py-1.5 rounded-full transition-all text-left" data-question="Tisch in der Trattoria reservieren"> Tisch in der Trattoria reservieren </button><button class="enzino-chip text-[11px] bg-[#1A1816] hover:bg-[#C85A32]/20 text-[#D4A373] border border-[#D4A373]/30 hover:border-[#D4A373] px-3 py-1.5 rounded-full transition-all text-left" data-question="Direktbucher Bestpreis"> Direktbucher Bestpreis </button><button class="enzino-chip text-[11px] bg-[#1A1816] hover:bg-[#C85A32]/20 text-[#D4A373] border border-[#D4A373]/30 hover:border-[#D4A373] px-3 py-1.5 rounded-full transition-all text-left" data-question="Digitales Gästebuch (Eviivo)"> Digitales Gästebuch (Eviivo) </button> </div> </div> <!-- Typing Indicator (hidden by default) --> <div id="enzino-typing" class="hidden px-4 py-2 text-[11px] text-[#D4A373] italic flex items-center gap-2 bg-[#1A1816]/50"> <span class="w-2 h-2 bg-[#D4A373] rounded-full animate-ping"></span> <span>Enzino tippt...</span> </div> <!-- Input Footer --> <form id="enzino-form" class="bg-[#1A1816] border-t border-[#D4A373]/20 p-3 flex gap-2"> <input type="text" id="enzino-input" placeholder="Stelle Enzino eine Frage..." class="flex-1 bg-[#24211D] border border-[#D4A373]/20 focus:border-[#D4A373] text-[#E6D5C3] placeholder-[#A3978B] text-xs rounded-xl px-3 py-2.5 outline-none transition-all" autocomplete="off"> <button type="submit" class="bg-[#C85A32] hover:bg-[#b04d2a] text-white px-3.5 py-2.5 rounded-xl text-xs font-bold transition-all shrink-0">
➔
</button> </form> </div> </div> </body></html>
+83
View File
@@ -0,0 +1,83 @@
<!DOCTYPE html><html lang="de" class="scroll-smooth bg-[#1A1816] text-[#E6D5C3]"> <head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><link rel="icon" type="image/svg+xml" href="/favicon.svg"><meta name="generator" content="Astro v4.16.19"><!-- SEO Meta Tags --><title>Romantik-Apartment Altstadt 2 | Casa da Enzo Goslar</title><meta name="description" content="Charmantes Klassik-Apartment mit italienischen Akzenten"><meta name="robots" content="index, follow"><!-- Open Graph / Facebook / WhatsApp --><meta property="og:type" content="website"><meta property="og:url" content="https://casa-daenzo.de/apartments/romantik-2/"><meta property="og:title" content="Romantik-Apartment Altstadt 2 | Casa da Enzo Goslar"><meta property="og:description" content="Charmantes Klassik-Apartment mit italienischen Akzenten"><meta property="og:image" content="https://casa-daenzo.de/og-image.jpg"><!-- Twitter --><meta property="twitter:card" content="summary_large_image"><meta property="twitter:title" content="Romantik-Apartment Altstadt 2 | Casa da Enzo Goslar"><meta property="twitter:description" content="Charmantes Klassik-Apartment mit italienischen Akzenten"><meta property="twitter:image" content="https://casa-daenzo.de/og-image.jpg"><!-- Schema.org JSON-LD --><script type="application/ld+json">{"@context":"https://schema.org","@graph":[{"@type":"LodgingBusiness","@id":"https://casa-daenzo.de/#lodging","name":"Casa da Enzo Boutique Apartments","url":"https://casa-daenzo.de","telephone":"+4915207483196","email":"booking@casa-daenzo.de","address":{"@type":"PostalAddress","streetAddress":"Bäckerstraße 18","addressLocality":"Goslar","postalCode":"38640","addressCountry":"DE"},"geo":{"@type":"GeoCoordinates","latitude":51.906,"longitude":10.428},"checkinTime":"15:00","checkoutTime":"11:00","numberOfRooms":7},{"@type":"Restaurant","@id":"https://casa-daenzo.de/#restaurant","name":"Trattoria da Enzo","url":"https://casa-daenzo.de/#trattoria","telephone":"+49532123456","servesCuisine":"Italian","address":{"@type":"PostalAddress","streetAddress":"Bäckerstraße 18","addressLocality":"Goslar","postalCode":"38640","addressCountry":"DE"}}]}</script><!-- Google Analytics (GA4) Snippet --><script async src="https://www.googletagmanager.com/gtag/js?id=G-CASADAENZO1"></script><script>(function(){const GA_MEASUREMENT_ID = "G-CASADAENZO1";
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', GA_MEASUREMENT_ID, {
anonymize_ip: true,
cookie_flags: 'SameSite=None;Secure'
});
})();</script><link rel="stylesheet" href="/_astro/_slug_.B_TTBYoh.css"><script type="module" src="/_astro/hoisted.jAcVTPu2.js"></script></head> <body class="bg-[#1A1816] text-[#E6D5C3] antialiased min-h-screen flex flex-col selection:bg-[#D4A373] selection:text-[#1A1816]"> <header class="sticky top-0 z-40 w-full bg-stone-900/95 backdrop-blur-md border-b border-stone-800 transition-all"> <!-- Top Utility Contact Bar --> <div class="bg-stone-950 border-b border-stone-800/80 py-1.5 px-4 text-[11px] sm:text-xs"> <div class="max-w-7xl mx-auto flex flex-wrap items-center justify-between gap-2 text-stone-400"> <!-- Dual Contacts --> <div class="flex flex-wrap items-center gap-4 sm:gap-6"> <!-- Apartments Phone --> <a href="https://wa.me/4915207483196" target="_blank" rel="noopener noreferrer" class="inline-flex items-center gap-1.5 text-emerald-400 hover:text-emerald-300 font-medium transition-colors" title="Apartment Anfragen & Concierge Alja"> <span class="w-2 h-2 rounded-full bg-emerald-500"></span> <span class="text-stone-300">Apartments (WhatsApp):</span> <span class="underline font-semibold">+49 1520 7483196</span> </a> <!-- Trattoria Phone --> <a href="tel:+4915207483196" class="inline-flex items-center gap-1.5 text-[#C85A32] hover:text-[#e2724a] font-medium transition-colors" title="Trattoria Tischreservierung"> <span class="w-2 h-2 rounded-full bg-[#C85A32]"></span> <span class="text-stone-300">Trattoria:</span> <span class="underline font-semibold">+49 1520 7483196</span> </a> </div> <!-- Right Utility Links: Eviivo & Language Switch --> <div class="flex items-center gap-4"> <a href="https://guest.eviivo.com/casa-daenzo" target="_blank" rel="noopener noreferrer" class="inline-flex items-center gap-1 text-amber-400 hover:text-white transition-colors font-medium cursor-pointer" title="Digital Guest Directory"> <span>📖</span> <span class="underline">Eviivo Guest Directory</span> </a> <div class="flex items-center bg-stone-900 border border-stone-800 rounded-full px-2 py-0.5 text-[11px] font-bold"> <span class="px-1.5 py-0.5 rounded-full bg-amber-500 text-stone-950">DE</span> </div> </div> </div> </div> <!-- Main Navigation Bar --> <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 h-20 flex items-center justify-between"> <!-- Brand Logo --> <a href="/" class="flex items-center gap-3 group"> <div class="w-11 h-11 rounded-2xl bg-gradient-to-br from-[#2D5A43] via-[#D4A373] to-[#C85A32] p-0.5 shadow-lg group-hover:scale-105 transition-transform"> <div class="w-full h-full bg-stone-950 rounded-[14px] flex items-center justify-center font-serif text-xl font-bold text-amber-400">
E
</div> </div> <div class="flex flex-col"> <span class="font-serif text-xl tracking-wide font-bold text-white group-hover:text-amber-400 transition-colors">
Casa da Enzo
</span> <div class="flex items-center gap-1.5 text-[10px] tracking-widest uppercase font-sans -mt-0.5"> <span class="text-emerald-400 font-semibold">Apartments</span> <span class="text-stone-400">•</span> <span class="text-[#C85A32] font-semibold">Trattoria</span> </div> </div> </a> <!-- Desktop Navigation --> <nav class="hidden md:flex items-center gap-6 lg:gap-8 text-sm font-medium"> <a href="/apartments" class="text-stone-200 hover:text-emerald-400 transition-colors flex items-center gap-1.5"> <span class="w-1.5 h-1.5 rounded-full bg-emerald-500"></span> <span>Apartments & Suiten</span> </a> <a href="/trattoria" class="text-stone-200 hover:text-[#C85A32] transition-colors flex items-center gap-1.5"> <span class="w-1.5 h-1.5 rounded-full bg-[#C85A32]"></span> <span>Trattoria da Enzo</span> </a> <a href="/blog" class="text-stone-200 hover:text-amber-400 transition-colors">
Blog & Magazin
</a> <a href="/#geschichte" class="text-stone-200 hover:text-amber-400 transition-colors">
Unsere Geschichte
</a> <a href="/#faq" class="text-stone-200 hover:text-amber-400 transition-colors">
FAQ
</a> </nav> <!-- CTAs --> <div class="flex items-center gap-3"> <a href="/apartments#booking" class="hidden sm:inline-flex items-center gap-2 px-5 py-2.5 rounded-full bg-[#C85A32] text-white font-medium text-xs lg:text-sm hover:bg-[#b04d2a] shadow-md transition-all hover:scale-105"> <span>Direkt buchen (Bestpreis)</span> </a> <!-- Mobile Menu Button --> <button id="mobile-menu-btn" class="md:hidden p-2 text-stone-200 hover:text-amber-400 rounded-xl bg-stone-800 border border-stone-700" aria-label="Menü öffnen"> <svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16"></path> </svg> </button> </div> </div> <!-- Mobile Navigation Dropdown --> <div id="mobile-menu" class="hidden md:hidden bg-stone-950 border-b border-stone-800 px-4 py-6 space-y-4"> <a href="/apartments" class="block py-2 text-stone-200 font-medium hover:text-emerald-400 flex items-center gap-2"> <span class="w-2 h-2 rounded-full bg-emerald-500"></span> <span>Apartments & Suiten</span> </a> <a href="/trattoria" class="block py-2 text-stone-200 font-medium hover:text-[#C85A32] flex items-center gap-2"> <span class="w-2 h-2 rounded-full bg-[#C85A32]"></span> <span>Trattoria da Enzo</span> </a> <a href="/blog" class="block py-2 text-stone-200 font-medium hover:text-amber-400">
Blog & Magazin
</a> <a href="/#geschichte" class="block py-2 text-stone-200 font-medium hover:text-amber-400">
Unsere Geschichte
</a> <a href="/#faq" class="block py-2 text-stone-200 font-medium hover:text-amber-400">
FAQ
</a> <div class="pt-2 border-t border-stone-800 space-y-2"> <a href="https://wa.me/4915207483196" target="_blank" class="block py-1.5 text-xs text-emerald-400 font-semibold">
💬 Apartments WhatsApp: +49 1520 7483196
</a> <a href="https://guest.eviivo.com/casa-daenzo" target="_blank" class="block py-1.5 text-xs text-amber-400 font-semibold">
📖 Eviivo Guest Directory
</a> </div> <a href="/apartments#booking" class="block text-center py-3 rounded-2xl bg-[#C85A32] text-white font-bold text-sm">
Jetzt Direkt buchen
</a> </div> </header> <main class="flex-1"> <div class="py-12 bg-[#1A1816]"> <div class="max-w-5xl mx-auto px-4 sm:px-6 lg:px-8 space-y-8"> <!-- Back Link & Top Badges Bar --> <div class="flex flex-col sm:flex-row sm:items-center justify-between gap-4"> <a href="/#apartments" class="inline-flex items-center gap-2 text-xs font-bold text-emerald-400 hover:underline">
← Zurück zu allen Apartments
</a> <!-- Airbnb & Booking Badges + Eviivo Guest Directory --> <div class="flex flex-wrap items-center gap-3 text-xs font-medium"> <span class="px-3 py-1 rounded-full bg-[#24211D] border border-[#D4A373]/20 text-[#E6D5C3]">
★ <strong class="text-[#D4A373]">4.98</strong> Superhost
</span> <span class="px-3 py-1 rounded-full bg-[#24211D] border border-[#D4A373]/20 text-[#E6D5C3]">
Booking.com <strong class="text-blue-400">9.8</strong> </span> <button onclick="document.getElementById('eviivo-link-btn')?.click()" class="px-3 py-1 rounded-full bg-[#2D5A43]/30 border border-emerald-500/40 text-emerald-400 hover:bg-[#2D5A43]/50 transition-colors flex items-center gap-1 font-semibold"> <span>📖 Eviivo Gästemappe</span> </button> </div> </div> <!-- Title & Header --> <div class="space-y-3"> <span class="inline-block px-3 py-1 rounded-full text-xs font-bold uppercase tracking-wider bg-[#24211D] text-[#D4A373] border border-[#D4A373]/30"> Klassik </span> <h1 class="font-serif text-4xl sm:text-5xl font-bold text-[#E6D5C3]">Romantik-Apartment Altstadt 2</h1> <p class="text-[#A3978B] text-base sm:text-lg leading-relaxed">Charmantes Klassik-Apartment mit italienischen Akzenten</p> </div> <!-- Quick Specs Bar --> <div class="grid grid-cols-2 sm:grid-cols-4 gap-4 p-6 rounded-3xl stone-card border border-[#D4A373]/20 text-center"> <div> <span class="block text-[10px] uppercase tracking-wider text-[#D4A373] font-bold">Kapazität</span> <span class="font-serif text-lg font-bold text-[#E6D5C3] mt-1 block">👥 Bis 2 Gäste</span> </div> <div> <span class="block text-[10px] uppercase tracking-wider text-[#D4A373] font-bold">Größe</span> <span class="font-serif text-lg font-bold text-[#E6D5C3] mt-1 block">📐 40 m²</span> </div> <div> <span class="block text-[10px] uppercase tracking-wider text-[#D4A373] font-bold">Aussicht</span> <span class="font-serif text-lg font-bold text-[#E6D5C3] mt-1 block">Altstadtblick</span> </div> <div> <span class="block text-[10px] uppercase tracking-wider text-[#D4A373] font-bold">Workspace</span> <span class="font-serif text-lg font-bold text-[#E6D5C3] mt-1 block">⚡ Wi-Fi 6</span> </div> </div> <!-- Visual Gallery Placeholder Banner --> <div class="aspect-[21/9] rounded-3xl bg-gradient-to-br from-[#2E2A25] to-[#1A1816] text-[#E6D5C3] flex flex-col items-center justify-center p-6 text-center border border-[#D4A373]/20 relative overflow-hidden shadow-2xl"> <div class="relative z-10 space-y-2"> <span class="px-3.5 py-1 rounded-full bg-[#2D5A43]/30 text-emerald-400 text-xs font-bold uppercase tracking-widest border border-emerald-500/30">
Saniert 2025 • UNESCO Altstadt Goslar
</span> <h2 class="font-serif text-2xl sm:text-3xl font-bold">Romantik-Apartment Altstadt 2</h2> <p class="text-[#A3978B] text-xs sm:text-sm max-w-md mx-auto">
Restauriertes Fachwerk aus dem 16. Jahrhundert kombiniert mit italienischem Design & smartem Nuki Keyless Check-in.
</p> </div> </div> <!-- Highlights & Details --> <div class="grid grid-cols-1 md:grid-cols-3 gap-8 pt-4"> <div class="md:col-span-2 space-y-6 stone-card p-8 rounded-3xl border border-[#D4A373]/20"> <h2 class="font-serif text-2xl font-bold text-[#E6D5C3]">Beschreibung & Ausstattung</h2> <div class="prose prose-invert max-w-none text-[#E6D5C3] text-sm leading-relaxed"> <p>Einfach ankommen und wohlfühlen: Romantik-Apartment 2 überzeugt durch behagliches Ambiente und durchdachte Details im Herzen der Altstadt.</p> </div> <div class="pt-6 border-t border-[#D4A373]/15"> <h3 class="font-serif text-lg font-bold text-[#D4A373] mb-2">Küche & Verpflegung</h3> <p class="text-[#A3978B] text-xs leading-relaxed">Kompakte, voll ausgestattete Küche</p> </div> <div class="pt-4 border-t border-[#D4A373]/15 flex flex-wrap items-center justify-between gap-4 text-xs text-[#A3978B]"> <span>🔑 Nuki Smart Lock PIN Check-in ab 15:00 Uhr</span> <span>🌿 Nachhaltige Lehmdämmung für gesunden Schlaf</span> </div> </div> <!-- Sidebar / Highlights --> <div class="space-y-6"> <div class="stone-card p-6 rounded-3xl space-y-4 border border-[#D4A373]/30 shadow-xl"> <h3 class="font-serif text-xl font-bold text-[#D4A373]">Ausstattungs-Highlights</h3> <ul class="space-y-3 text-xs text-[#E6D5C3]"> <li class="flex items-start gap-3"> <span class="text-emerald-400 font-bold">✓</span> <span>Ruhige Ausrichtung zum Innenhof</span> </li><li class="flex items-start gap-3"> <span class="text-emerald-400 font-bold">✓</span> <span>Bequemes Doppelbett &amp; gemütliche Sitzecke</span> </li><li class="flex items-start gap-3"> <span class="text-emerald-400 font-bold">✓</span> <span>Inklusive Tee- &amp; Kaffeeset</span> </li> </ul> </div> <!-- Trattoria Info Card --> <div class="stone-card border border-[#C85A32]/40 p-6 rounded-3xl space-y-3"> <span class="text-xs font-bold uppercase tracking-wider text-[#C85A32]">Hauseigene Gastronomie</span> <h4 class="font-serif text-lg font-bold text-[#E6D5C3]">Trattoria da Enzo im Erdgeschoss</h4> <p class="text-xs text-[#A3978B] leading-relaxed">
Als Hotelgast genießt du eine bevorzugte Tischreservierung bei Alessandra. Genieße hausgemachte Pasta und sizilianische Weine direkt im Haus!
</p> <a href="tel:+49532123456" class="inline-block text-xs font-bold text-[#C85A32] hover:underline">
📞 Tisch reservieren: +49 5321 23456 →
</a> </div> </div> </div> <!-- Eviivo Booking Widget --> <section id="booking" class="pt-6"> <div class="stone-card rounded-3xl p-6 sm:p-10 max-w-4xl mx-auto my-8 font-sans border border-[#D4A373]/30 shadow-2xl"> <div class="text-center mb-8 space-y-2"> <div class="inline-flex items-center gap-2 px-3.5 py-1 rounded-full bg-[#2D5A43]/20 border border-emerald-500/40 text-emerald-400 text-xs font-bold uppercase tracking-wider"> <span>🔒 Direktbucher Bestpreis-Garantie</span> </div> <h3 class="font-serif text-2xl sm:text-3xl font-bold text-[#E6D5C3]">
Verfügbarkeit & Bestpreis prüfen
</h3> <p class="text-[#A3978B] text-xs sm:text-sm max-w-xl mx-auto">
Buche direkt über unsere Eviivo-Schnittstelle – 15% günstiger als auf Booking.com oder Airbnb. Bestpreis garantiert!
</p> </div> <!-- Booking Mask Interface --> <form action="https://onlinereservation.eviivo.com" method="GET" target="_blank" class="grid grid-cols-1 sm:grid-cols-3 gap-4"> <div class="space-y-1"> <label class="text-xs font-semibold text-[#D4A373] uppercase tracking-wider">Anreise</label> <input type="date" name="startDate" class="w-full px-4 py-3 rounded-xl bg-[#1A1816] border border-[#D4A373]/30 text-[#E6D5C3] text-xs focus:border-[#D4A373] focus:outline-none" required> </div> <div class="space-y-1"> <label class="text-xs font-semibold text-[#D4A373] uppercase tracking-wider">Abreise</label> <input type="date" name="endDate" class="w-full px-4 py-3 rounded-xl bg-[#1A1816] border border-[#D4A373]/30 text-[#E6D5C3] text-xs focus:border-[#D4A373] focus:outline-none" required> </div> <div class="space-y-1"> <label class="text-xs font-semibold text-[#D4A373] uppercase tracking-wider">Gäste</label> <select name="adults" class="w-full px-4 py-3 rounded-xl bg-[#1A1816] border border-[#D4A373]/30 text-[#E6D5C3] text-xs focus:border-[#D4A373] focus:outline-none"> <option value="1">1 Person</option> <option value="2" selected>2 Personen</option> <option value="3">3 Personen</option> <option value="4">4 Personen</option> </select> </div> <div class="sm:col-span-3 pt-2"> <button type="submit" class="w-full py-4 rounded-xl bg-gradient-to-r from-[#2D5A43] to-[#C85A32] text-white font-bold text-sm hover:opacity-95 shadow-xl transition-all">
Jetzt Verfügbarkeit & Bestpreis abrufen ➔
</button> </div> </form> <div class="mt-6 text-center text-[11px] text-[#A3978B] flex flex-wrap items-center justify-center gap-4 border-t border-[#D4A373]/10 pt-4"> <span>🔒 Sichere SSL-Schnittstelle</span> <span>•</span> <span>💳 Keine versteckten Gebühren</span> <span>•</span> <span>⚡ Sofortige Reservierungsbestätigung</span> </div> </div> </section> </div> </div> </main> <footer class="bg-stone-950 text-stone-400 pt-16 pb-12 border-t border-stone-800 font-sans"> <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8"> <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-12 mb-12"> <!-- Col 1: Brand & Heritage --> <div class="space-y-4"> <div class="flex items-center gap-3"> <div class="w-10 h-10 rounded-xl bg-gradient-to-br from-[#2D5A43] via-[#D4A373] to-[#C85A32] p-0.5"> <div class="w-full h-full bg-stone-950 rounded-[10px] flex items-center justify-center font-serif text-lg font-bold text-amber-400">
E
</div> </div> <div> <h3 class="font-serif text-xl font-bold text-stone-100">Casa da Enzo</h3> <p class="text-[10px] uppercase tracking-widest text-amber-400">Sizilien trifft Goslar • Seit 1980</p> </div> </div> <p class="text-xs leading-relaxed text-stone-400">
7 individuelle Boutique-Apartments über unserer traditionsreichen Trattoria im UNESCO-Weltkulturerbe Goslar. 100% digitaler Check-in trifft auf authentische italienische Gastfreundschaft.
</p> <p class="text-xs text-amber-400 font-medium">
📍 Bäckerstraße 18 • 38640 Goslar, Harz
</p> </div> <!-- Col 2: Navigation --> <div class="space-y-3"> <h4 class="font-serif text-base font-semibold text-stone-100 border-b border-stone-800 pb-2">Navigation</h4> <ul class="space-y-2 text-xs"> <li> <a href="/apartments" class="hover:text-emerald-400 transition-colors flex items-center gap-2"> <span class="w-1.5 h-1.5 rounded-full bg-emerald-500"></span> <span>Apartments & Suiten (7 Einheiten)</span> </a> </li> <li> <a href="/trattoria" class="hover:text-[#C85A32] transition-colors flex items-center gap-2"> <span class="w-1.5 h-1.5 rounded-full bg-[#C85A32]"></span> <span>Trattoria da Enzo (Speisekarte & Tisch)</span> </a> </li> <li> <a href="/trattoria#gutscheine" class="hover:text-amber-400 transition-colors flex items-center gap-2"> <span class="w-1.5 h-1.5 rounded-full bg-amber-400"></span> <span>Gutschein-Shop</span> </a> </li> <li> <a href="/blog" class="hover:text-amber-400 transition-colors">
Blog & Magazin
</a> </li> <li> <a href="/#geschichte" class="hover:text-amber-400 transition-colors">
Unsere Geschichte
</a> </li> </ul> </div> <!-- Col 3: Contacts --> <div class="space-y-3"> <h4 class="font-serif text-base font-semibold text-stone-100 border-b border-stone-800 pb-2">
Kontakt & Service
</h4> <div class="space-y-3 text-xs"> <!-- Apartments Contact --> <div class="p-3 rounded-xl bg-stone-900 border border-emerald-500/30 space-y-1"> <div class="text-[10px] uppercase font-bold text-emerald-400 flex items-center gap-1.5"> <span class="w-2 h-2 rounded-full bg-emerald-500"></span> <span>Apartments & Buchungen</span> </div> <a href="https://wa.me/4915207483196" target="_blank" class="block text-emerald-400 hover:underline font-bold">
WhatsApp: +49 1520 7483196
</a> <p class="text-[10px] text-stone-400">E-Mail: booking@casa-daenzo.de</p> </div> <!-- Trattoria Contact --> <div class="p-3 rounded-xl bg-stone-900 border border-[#C85A32]/30 space-y-1"> <div class="text-[10px] uppercase font-bold text-[#C85A32] flex items-center gap-1.5"> <span class="w-2 h-2 rounded-full bg-[#C85A32]"></span> <span>Trattoria Reservierung</span> </div> <a href="tel:+4915207483196" class="block text-[#C85A32] hover:underline font-bold">
Telefon: +49 1520 7483196
</a> <p class="text-[10px] text-stone-400">Öffnungszeiten: Di–So 17:00–22:30 Uhr</p> </div> </div> </div> <!-- Col 4: Direct Booking Advantages --> <div class="p-6 rounded-3xl bg-stone-900 border border-stone-800 space-y-4 shadow-xl"> <h4 class="font-serif text-base font-semibold text-amber-400">
Direktbucher-Vorteile
</h4> <ul class="space-y-2.5 text-xs text-stone-300"> <li class="flex items-start gap-2"> <span class="text-amber-400 font-bold">✓</span> <span>Bestpreis-Garantie (15% günstiger als Booking.com)</span> </li> <li class="flex items-start gap-2"> <span class="text-amber-400 font-bold">✓</span> <span>Bevorzugte Tischreservierung in der Trattoria</span> </li> <li class="flex items-start gap-2"> <span class="text-amber-400 font-bold">✓</span> <span>Kontaktloser Nuki Smart-Lock Check-in</span> </li> </ul> <a href="/apartments#booking" class="block text-center py-2.5 rounded-xl bg-[#C85A32] text-white font-bold text-xs hover:bg-[#b04d2a] transition-colors">
Verfügbarkeit prüfen
</a> </div> </div> <!-- Bottom line --> <div class="pt-8 border-t border-stone-900 flex flex-col sm:flex-row items-center justify-between text-xs text-stone-500 gap-4"> <p>© 2026 Casa da Enzo Goslar. Alle Rechte vorbehalten.</p> <div class="flex items-center gap-6"> <a href="https://guest.eviivo.com/casa-daenzo" target="_blank" class="hover:text-stone-300 transition-colors">Eviivo Guest Directory</a> </div> </div> </div> </footer> <div id="enzino-widget" class="fixed bottom-6 right-6 z-50 font-sans" data-lang="de"> <!-- Floating Launcher Button --> <button id="enzino-launcher" class="relative group flex items-center gap-3 bg-[#24211D] border border-[#D4A373]/30 hover:border-[#D4A373] text-[#E6D5C3] px-4 py-3 rounded-full shadow-2xl transition-all duration-300 hover:scale-105" aria-label="Enzino Concierge Chat öffnen"> <div class="relative w-10 h-10 rounded-full bg-gradient-to-br from-[#C85A32] to-[#D4A373] p-0.5 flex items-center justify-center shadow-inner"> <div class="w-full h-full rounded-full bg-[#1A1816] flex items-center justify-center text-lg font-serif font-bold text-[#D4A373]">
🇮🇹
</div> <span class="absolute -top-0.5 -right-0.5 w-3 h-3 bg-emerald-500 rounded-full border-2 border-[#1A1816] animate-pulse"></span> </div> <div class="text-left hidden sm:block"> <div class="text-xs font-serif font-bold text-[#D4A373] tracking-wide">Enzino Concierge</div> <div class="text-[10px] text-[#A3978B]">Online • Frag mich was!</div> </div> </button> <!-- Chat Dialog Window --> <div id="enzino-chat-window" class="hidden fixed bottom-6 right-6 w-[calc(100vw-3rem)] sm:w-[380px] max-h-[580px] h-[85vh] bg-[#24211D] border border-[#D4A373]/30 rounded-3xl shadow-2xl flex-col overflow-hidden transition-all duration-300 z-50"> <!-- Header --> <div class="bg-[#1A1816] border-b border-[#D4A373]/20 p-4 flex items-center justify-between"> <div class="flex items-center gap-3"> <div class="relative w-10 h-10 rounded-full bg-gradient-to-br from-[#C85A32] to-[#D4A373] p-0.5 flex items-center justify-center"> <div class="w-full h-full rounded-full bg-[#24211D] flex items-center justify-center text-lg">
👨‍🍳
</div> <span class="absolute bottom-0 right-0 w-2.5 h-2.5 bg-emerald-500 rounded-full border border-[#1A1816]"></span> </div> <div> <h3 class="font-serif text-sm font-bold text-[#E6D5C3]">Enzino da Enzo</h3> <p class="text-[10px] text-[#D4A373]">Digitaler Host & Concierge</p> </div> </div> <div class="flex items-center gap-2"> <!-- Session Disable Button --> <button id="enzino-disable-btn" title="Enzino für diese Session deaktivieren" class="p-1.5 text-[#A3978B] hover:text-amber-400 rounded-lg hover:bg-[#2A2622] text-xs transition-colors">
🚫
</button> <!-- Close Button --> <button id="enzino-close-btn" class="p-1.5 text-[#A3978B] hover:text-white rounded-lg hover:bg-[#2A2622] transition-colors" aria-label="Chat schließen">
✕
</button> </div> </div> <!-- Messages Body --> <div id="enzino-messages" class="flex-1 p-4 overflow-y-auto space-y-3.5 text-xs text-[#E6D5C3]"> <!-- Initial Bot Message --> <div class="flex gap-2.5 items-start"> <div class="w-7 h-7 rounded-full bg-[#C85A32]/20 border border-[#C85A32]/40 flex items-center justify-center text-xs shrink-0">
🇮🇹
</div> <div class="bg-[#2E2A25] border border-[#D4A373]/15 p-3 rounded-2xl rounded-tl-none max-w-[85%] leading-relaxed shadow-sm"> Ciao! I&#39;m Enzino, dein italienischer Digital Concierge 🇮🇹 Wie kann ich dir heute helfen? Frag mich nach unseren Apartments, der Trattoria oder dem digitalen Check-in! </div> </div> <!-- Quick Chips --> <div id="enzino-chips" class="flex flex-wrap gap-1.5 pt-2 pl-9"> <button class="enzino-chip text-[11px] bg-[#1A1816] hover:bg-[#C85A32]/20 text-[#D4A373] border border-[#D4A373]/30 hover:border-[#D4A373] px-3 py-1.5 rounded-full transition-all text-left" data-question="Wie funktioniert der Check-in?"> Wie funktioniert der Check-in? </button><button class="enzino-chip text-[11px] bg-[#1A1816] hover:bg-[#C85A32]/20 text-[#D4A373] border border-[#D4A373]/30 hover:border-[#D4A373] px-3 py-1.5 rounded-full transition-all text-left" data-question="Tisch in der Trattoria reservieren"> Tisch in der Trattoria reservieren </button><button class="enzino-chip text-[11px] bg-[#1A1816] hover:bg-[#C85A32]/20 text-[#D4A373] border border-[#D4A373]/30 hover:border-[#D4A373] px-3 py-1.5 rounded-full transition-all text-left" data-question="Direktbucher Bestpreis"> Direktbucher Bestpreis </button><button class="enzino-chip text-[11px] bg-[#1A1816] hover:bg-[#C85A32]/20 text-[#D4A373] border border-[#D4A373]/30 hover:border-[#D4A373] px-3 py-1.5 rounded-full transition-all text-left" data-question="Digitales Gästebuch (Eviivo)"> Digitales Gästebuch (Eviivo) </button> </div> </div> <!-- Typing Indicator (hidden by default) --> <div id="enzino-typing" class="hidden px-4 py-2 text-[11px] text-[#D4A373] italic flex items-center gap-2 bg-[#1A1816]/50"> <span class="w-2 h-2 bg-[#D4A373] rounded-full animate-ping"></span> <span>Enzino tippt...</span> </div> <!-- Input Footer --> <form id="enzino-form" class="bg-[#1A1816] border-t border-[#D4A373]/20 p-3 flex gap-2"> <input type="text" id="enzino-input" placeholder="Stelle Enzino eine Frage..." class="flex-1 bg-[#24211D] border border-[#D4A373]/20 focus:border-[#D4A373] text-[#E6D5C3] placeholder-[#A3978B] text-xs rounded-xl px-3 py-2.5 outline-none transition-all" autocomplete="off"> <button type="submit" class="bg-[#C85A32] hover:bg-[#b04d2a] text-white px-3.5 py-2.5 rounded-xl text-xs font-bold transition-all shrink-0">
➔
</button> </form> </div> </div> </body></html>
+83
View File
@@ -0,0 +1,83 @@
<!DOCTYPE html><html lang="de" class="scroll-smooth bg-[#1A1816] text-[#E6D5C3]"> <head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><link rel="icon" type="image/svg+xml" href="/favicon.svg"><meta name="generator" content="Astro v4.16.19"><!-- SEO Meta Tags --><title>Boutique Studio Bäckerstraße | Casa da Enzo Goslar</title><meta name="description" content="Kompaktes, stilvolles Studio für Individualreisende &#38; Städtetrips"><meta name="robots" content="index, follow"><!-- Open Graph / Facebook / WhatsApp --><meta property="og:type" content="website"><meta property="og:url" content="https://casa-daenzo.de/apartments/studio/"><meta property="og:title" content="Boutique Studio Bäckerstraße | Casa da Enzo Goslar"><meta property="og:description" content="Kompaktes, stilvolles Studio für Individualreisende &#38; Städtetrips"><meta property="og:image" content="https://casa-daenzo.de/og-image.jpg"><!-- Twitter --><meta property="twitter:card" content="summary_large_image"><meta property="twitter:title" content="Boutique Studio Bäckerstraße | Casa da Enzo Goslar"><meta property="twitter:description" content="Kompaktes, stilvolles Studio für Individualreisende &#38; Städtetrips"><meta property="twitter:image" content="https://casa-daenzo.de/og-image.jpg"><!-- Schema.org JSON-LD --><script type="application/ld+json">{"@context":"https://schema.org","@graph":[{"@type":"LodgingBusiness","@id":"https://casa-daenzo.de/#lodging","name":"Casa da Enzo Boutique Apartments","url":"https://casa-daenzo.de","telephone":"+4915207483196","email":"booking@casa-daenzo.de","address":{"@type":"PostalAddress","streetAddress":"Bäckerstraße 18","addressLocality":"Goslar","postalCode":"38640","addressCountry":"DE"},"geo":{"@type":"GeoCoordinates","latitude":51.906,"longitude":10.428},"checkinTime":"15:00","checkoutTime":"11:00","numberOfRooms":7},{"@type":"Restaurant","@id":"https://casa-daenzo.de/#restaurant","name":"Trattoria da Enzo","url":"https://casa-daenzo.de/#trattoria","telephone":"+49532123456","servesCuisine":"Italian","address":{"@type":"PostalAddress","streetAddress":"Bäckerstraße 18","addressLocality":"Goslar","postalCode":"38640","addressCountry":"DE"}}]}</script><!-- Google Analytics (GA4) Snippet --><script async src="https://www.googletagmanager.com/gtag/js?id=G-CASADAENZO1"></script><script>(function(){const GA_MEASUREMENT_ID = "G-CASADAENZO1";
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', GA_MEASUREMENT_ID, {
anonymize_ip: true,
cookie_flags: 'SameSite=None;Secure'
});
})();</script><link rel="stylesheet" href="/_astro/_slug_.B_TTBYoh.css"><script type="module" src="/_astro/hoisted.jAcVTPu2.js"></script></head> <body class="bg-[#1A1816] text-[#E6D5C3] antialiased min-h-screen flex flex-col selection:bg-[#D4A373] selection:text-[#1A1816]"> <header class="sticky top-0 z-40 w-full bg-stone-900/95 backdrop-blur-md border-b border-stone-800 transition-all"> <!-- Top Utility Contact Bar --> <div class="bg-stone-950 border-b border-stone-800/80 py-1.5 px-4 text-[11px] sm:text-xs"> <div class="max-w-7xl mx-auto flex flex-wrap items-center justify-between gap-2 text-stone-400"> <!-- Dual Contacts --> <div class="flex flex-wrap items-center gap-4 sm:gap-6"> <!-- Apartments Phone --> <a href="https://wa.me/4915207483196" target="_blank" rel="noopener noreferrer" class="inline-flex items-center gap-1.5 text-emerald-400 hover:text-emerald-300 font-medium transition-colors" title="Apartment Anfragen & Concierge Alja"> <span class="w-2 h-2 rounded-full bg-emerald-500"></span> <span class="text-stone-300">Apartments (WhatsApp):</span> <span class="underline font-semibold">+49 1520 7483196</span> </a> <!-- Trattoria Phone --> <a href="tel:+4915207483196" class="inline-flex items-center gap-1.5 text-[#C85A32] hover:text-[#e2724a] font-medium transition-colors" title="Trattoria Tischreservierung"> <span class="w-2 h-2 rounded-full bg-[#C85A32]"></span> <span class="text-stone-300">Trattoria:</span> <span class="underline font-semibold">+49 1520 7483196</span> </a> </div> <!-- Right Utility Links: Eviivo & Language Switch --> <div class="flex items-center gap-4"> <a href="https://guest.eviivo.com/casa-daenzo" target="_blank" rel="noopener noreferrer" class="inline-flex items-center gap-1 text-amber-400 hover:text-white transition-colors font-medium cursor-pointer" title="Digital Guest Directory"> <span>📖</span> <span class="underline">Eviivo Guest Directory</span> </a> <div class="flex items-center bg-stone-900 border border-stone-800 rounded-full px-2 py-0.5 text-[11px] font-bold"> <span class="px-1.5 py-0.5 rounded-full bg-amber-500 text-stone-950">DE</span> </div> </div> </div> </div> <!-- Main Navigation Bar --> <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 h-20 flex items-center justify-between"> <!-- Brand Logo --> <a href="/" class="flex items-center gap-3 group"> <div class="w-11 h-11 rounded-2xl bg-gradient-to-br from-[#2D5A43] via-[#D4A373] to-[#C85A32] p-0.5 shadow-lg group-hover:scale-105 transition-transform"> <div class="w-full h-full bg-stone-950 rounded-[14px] flex items-center justify-center font-serif text-xl font-bold text-amber-400">
E
</div> </div> <div class="flex flex-col"> <span class="font-serif text-xl tracking-wide font-bold text-white group-hover:text-amber-400 transition-colors">
Casa da Enzo
</span> <div class="flex items-center gap-1.5 text-[10px] tracking-widest uppercase font-sans -mt-0.5"> <span class="text-emerald-400 font-semibold">Apartments</span> <span class="text-stone-400">•</span> <span class="text-[#C85A32] font-semibold">Trattoria</span> </div> </div> </a> <!-- Desktop Navigation --> <nav class="hidden md:flex items-center gap-6 lg:gap-8 text-sm font-medium"> <a href="/apartments" class="text-stone-200 hover:text-emerald-400 transition-colors flex items-center gap-1.5"> <span class="w-1.5 h-1.5 rounded-full bg-emerald-500"></span> <span>Apartments & Suiten</span> </a> <a href="/trattoria" class="text-stone-200 hover:text-[#C85A32] transition-colors flex items-center gap-1.5"> <span class="w-1.5 h-1.5 rounded-full bg-[#C85A32]"></span> <span>Trattoria da Enzo</span> </a> <a href="/blog" class="text-stone-200 hover:text-amber-400 transition-colors">
Blog & Magazin
</a> <a href="/#geschichte" class="text-stone-200 hover:text-amber-400 transition-colors">
Unsere Geschichte
</a> <a href="/#faq" class="text-stone-200 hover:text-amber-400 transition-colors">
FAQ
</a> </nav> <!-- CTAs --> <div class="flex items-center gap-3"> <a href="/apartments#booking" class="hidden sm:inline-flex items-center gap-2 px-5 py-2.5 rounded-full bg-[#C85A32] text-white font-medium text-xs lg:text-sm hover:bg-[#b04d2a] shadow-md transition-all hover:scale-105"> <span>Direkt buchen (Bestpreis)</span> </a> <!-- Mobile Menu Button --> <button id="mobile-menu-btn" class="md:hidden p-2 text-stone-200 hover:text-amber-400 rounded-xl bg-stone-800 border border-stone-700" aria-label="Menü öffnen"> <svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16"></path> </svg> </button> </div> </div> <!-- Mobile Navigation Dropdown --> <div id="mobile-menu" class="hidden md:hidden bg-stone-950 border-b border-stone-800 px-4 py-6 space-y-4"> <a href="/apartments" class="block py-2 text-stone-200 font-medium hover:text-emerald-400 flex items-center gap-2"> <span class="w-2 h-2 rounded-full bg-emerald-500"></span> <span>Apartments & Suiten</span> </a> <a href="/trattoria" class="block py-2 text-stone-200 font-medium hover:text-[#C85A32] flex items-center gap-2"> <span class="w-2 h-2 rounded-full bg-[#C85A32]"></span> <span>Trattoria da Enzo</span> </a> <a href="/blog" class="block py-2 text-stone-200 font-medium hover:text-amber-400">
Blog & Magazin
</a> <a href="/#geschichte" class="block py-2 text-stone-200 font-medium hover:text-amber-400">
Unsere Geschichte
</a> <a href="/#faq" class="block py-2 text-stone-200 font-medium hover:text-amber-400">
FAQ
</a> <div class="pt-2 border-t border-stone-800 space-y-2"> <a href="https://wa.me/4915207483196" target="_blank" class="block py-1.5 text-xs text-emerald-400 font-semibold">
💬 Apartments WhatsApp: +49 1520 7483196
</a> <a href="https://guest.eviivo.com/casa-daenzo" target="_blank" class="block py-1.5 text-xs text-amber-400 font-semibold">
📖 Eviivo Guest Directory
</a> </div> <a href="/apartments#booking" class="block text-center py-3 rounded-2xl bg-[#C85A32] text-white font-bold text-sm">
Jetzt Direkt buchen
</a> </div> </header> <main class="flex-1"> <div class="py-12 bg-[#1A1816]"> <div class="max-w-5xl mx-auto px-4 sm:px-6 lg:px-8 space-y-8"> <!-- Back Link & Top Badges Bar --> <div class="flex flex-col sm:flex-row sm:items-center justify-between gap-4"> <a href="/#apartments" class="inline-flex items-center gap-2 text-xs font-bold text-emerald-400 hover:underline">
← Zurück zu allen Apartments
</a> <!-- Airbnb & Booking Badges + Eviivo Guest Directory --> <div class="flex flex-wrap items-center gap-3 text-xs font-medium"> <span class="px-3 py-1 rounded-full bg-[#24211D] border border-[#D4A373]/20 text-[#E6D5C3]">
★ <strong class="text-[#D4A373]">4.98</strong> Superhost
</span> <span class="px-3 py-1 rounded-full bg-[#24211D] border border-[#D4A373]/20 text-[#E6D5C3]">
Booking.com <strong class="text-blue-400">9.8</strong> </span> <button onclick="document.getElementById('eviivo-link-btn')?.click()" class="px-3 py-1 rounded-full bg-[#2D5A43]/30 border border-emerald-500/40 text-emerald-400 hover:bg-[#2D5A43]/50 transition-colors flex items-center gap-1 font-semibold"> <span>📖 Eviivo Gästemappe</span> </button> </div> </div> <!-- Title & Header --> <div class="space-y-3"> <span class="inline-block px-3 py-1 rounded-full text-xs font-bold uppercase tracking-wider bg-[#24211D] text-[#D4A373] border border-[#D4A373]/30"> Klassik </span> <h1 class="font-serif text-4xl sm:text-5xl font-bold text-[#E6D5C3]">Boutique Studio Bäckerstraße</h1> <p class="text-[#A3978B] text-base sm:text-lg leading-relaxed">Kompaktes, stilvolles Studio für Individualreisende &amp; Städtetrips</p> </div> <!-- Quick Specs Bar --> <div class="grid grid-cols-2 sm:grid-cols-4 gap-4 p-6 rounded-3xl stone-card border border-[#D4A373]/20 text-center"> <div> <span class="block text-[10px] uppercase tracking-wider text-[#D4A373] font-bold">Kapazität</span> <span class="font-serif text-lg font-bold text-[#E6D5C3] mt-1 block">👥 Bis 2 Gäste</span> </div> <div> <span class="block text-[10px] uppercase tracking-wider text-[#D4A373] font-bold">Größe</span> <span class="font-serif text-lg font-bold text-[#E6D5C3] mt-1 block">📐 32 m²</span> </div> <div> <span class="block text-[10px] uppercase tracking-wider text-[#D4A373] font-bold">Aussicht</span> <span class="font-serif text-lg font-bold text-[#E6D5C3] mt-1 block">Altstadtblick</span> </div> <div> <span class="block text-[10px] uppercase tracking-wider text-[#D4A373] font-bold">Workspace</span> <span class="font-serif text-lg font-bold text-[#E6D5C3] mt-1 block">⚡ Wi-Fi 6</span> </div> </div> <!-- Visual Gallery Placeholder Banner --> <div class="aspect-[21/9] rounded-3xl bg-gradient-to-br from-[#2E2A25] to-[#1A1816] text-[#E6D5C3] flex flex-col items-center justify-center p-6 text-center border border-[#D4A373]/20 relative overflow-hidden shadow-2xl"> <div class="relative z-10 space-y-2"> <span class="px-3.5 py-1 rounded-full bg-[#2D5A43]/30 text-emerald-400 text-xs font-bold uppercase tracking-widest border border-emerald-500/30">
Saniert 2025 • UNESCO Altstadt Goslar
</span> <h2 class="font-serif text-2xl sm:text-3xl font-bold">Boutique Studio Bäckerstraße</h2> <p class="text-[#A3978B] text-xs sm:text-sm max-w-md mx-auto">
Restauriertes Fachwerk aus dem 16. Jahrhundert kombiniert mit italienischem Design & smartem Nuki Keyless Check-in.
</p> </div> </div> <!-- Highlights & Details --> <div class="grid grid-cols-1 md:grid-cols-3 gap-8 pt-4"> <div class="md:col-span-2 space-y-6 stone-card p-8 rounded-3xl border border-[#D4A373]/20"> <h2 class="font-serif text-2xl font-bold text-[#E6D5C3]">Beschreibung & Ausstattung</h2> <div class="prose prose-invert max-w-none text-[#E6D5C3] text-sm leading-relaxed"> <p>Unser feines Studio bietet smart genutzten Raum für alle, die eine unkomplizierte, zentrale und stilvolle Bleibe in Goslar suchen.</p> </div> <div class="pt-6 border-t border-[#D4A373]/15"> <h3 class="font-serif text-lg font-bold text-[#D4A373] mb-2">Küche & Verpflegung</h3> <p class="text-[#A3978B] text-xs leading-relaxed">Kompakte Küchenzeile mit Kaffeemaschine</p> </div> <div class="pt-4 border-t border-[#D4A373]/15 flex flex-wrap items-center justify-between gap-4 text-xs text-[#A3978B]"> <span>🔑 Nuki Smart Lock PIN Check-in ab 15:00 Uhr</span> <span>🌿 Nachhaltige Lehmdämmung für gesunden Schlaf</span> </div> </div> <!-- Sidebar / Highlights --> <div class="space-y-6"> <div class="stone-card p-6 rounded-3xl space-y-4 border border-[#D4A373]/30 shadow-xl"> <h3 class="font-serif text-xl font-bold text-[#D4A373]">Ausstattungs-Highlights</h3> <ul class="space-y-3 text-xs text-[#E6D5C3]"> <li class="flex items-start gap-3"> <span class="text-emerald-400 font-bold">✓</span> <span>Optimales Preis-Leistungs-Verhältnis</span> </li><li class="flex items-start gap-3"> <span class="text-emerald-400 font-bold">✓</span> <span>Zentrale Lage in der Bäckerstraße 18</span> </li><li class="flex items-start gap-3"> <span class="text-emerald-400 font-bold">✓</span> <span>Kontaktlose Anreise rund um die Uhr</span> </li> </ul> </div> <!-- Trattoria Info Card --> <div class="stone-card border border-[#C85A32]/40 p-6 rounded-3xl space-y-3"> <span class="text-xs font-bold uppercase tracking-wider text-[#C85A32]">Hauseigene Gastronomie</span> <h4 class="font-serif text-lg font-bold text-[#E6D5C3]">Trattoria da Enzo im Erdgeschoss</h4> <p class="text-xs text-[#A3978B] leading-relaxed">
Als Hotelgast genießt du eine bevorzugte Tischreservierung bei Alessandra. Genieße hausgemachte Pasta und sizilianische Weine direkt im Haus!
</p> <a href="tel:+49532123456" class="inline-block text-xs font-bold text-[#C85A32] hover:underline">
📞 Tisch reservieren: +49 5321 23456 →
</a> </div> </div> </div> <!-- Eviivo Booking Widget --> <section id="booking" class="pt-6"> <div class="stone-card rounded-3xl p-6 sm:p-10 max-w-4xl mx-auto my-8 font-sans border border-[#D4A373]/30 shadow-2xl"> <div class="text-center mb-8 space-y-2"> <div class="inline-flex items-center gap-2 px-3.5 py-1 rounded-full bg-[#2D5A43]/20 border border-emerald-500/40 text-emerald-400 text-xs font-bold uppercase tracking-wider"> <span>🔒 Direktbucher Bestpreis-Garantie</span> </div> <h3 class="font-serif text-2xl sm:text-3xl font-bold text-[#E6D5C3]">
Verfügbarkeit & Bestpreis prüfen
</h3> <p class="text-[#A3978B] text-xs sm:text-sm max-w-xl mx-auto">
Buche direkt über unsere Eviivo-Schnittstelle – 15% günstiger als auf Booking.com oder Airbnb. Bestpreis garantiert!
</p> </div> <!-- Booking Mask Interface --> <form action="https://onlinereservation.eviivo.com" method="GET" target="_blank" class="grid grid-cols-1 sm:grid-cols-3 gap-4"> <div class="space-y-1"> <label class="text-xs font-semibold text-[#D4A373] uppercase tracking-wider">Anreise</label> <input type="date" name="startDate" class="w-full px-4 py-3 rounded-xl bg-[#1A1816] border border-[#D4A373]/30 text-[#E6D5C3] text-xs focus:border-[#D4A373] focus:outline-none" required> </div> <div class="space-y-1"> <label class="text-xs font-semibold text-[#D4A373] uppercase tracking-wider">Abreise</label> <input type="date" name="endDate" class="w-full px-4 py-3 rounded-xl bg-[#1A1816] border border-[#D4A373]/30 text-[#E6D5C3] text-xs focus:border-[#D4A373] focus:outline-none" required> </div> <div class="space-y-1"> <label class="text-xs font-semibold text-[#D4A373] uppercase tracking-wider">Gäste</label> <select name="adults" class="w-full px-4 py-3 rounded-xl bg-[#1A1816] border border-[#D4A373]/30 text-[#E6D5C3] text-xs focus:border-[#D4A373] focus:outline-none"> <option value="1">1 Person</option> <option value="2" selected>2 Personen</option> <option value="3">3 Personen</option> <option value="4">4 Personen</option> </select> </div> <div class="sm:col-span-3 pt-2"> <button type="submit" class="w-full py-4 rounded-xl bg-gradient-to-r from-[#2D5A43] to-[#C85A32] text-white font-bold text-sm hover:opacity-95 shadow-xl transition-all">
Jetzt Verfügbarkeit & Bestpreis abrufen ➔
</button> </div> </form> <div class="mt-6 text-center text-[11px] text-[#A3978B] flex flex-wrap items-center justify-center gap-4 border-t border-[#D4A373]/10 pt-4"> <span>🔒 Sichere SSL-Schnittstelle</span> <span>•</span> <span>💳 Keine versteckten Gebühren</span> <span>•</span> <span>⚡ Sofortige Reservierungsbestätigung</span> </div> </div> </section> </div> </div> </main> <footer class="bg-stone-950 text-stone-400 pt-16 pb-12 border-t border-stone-800 font-sans"> <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8"> <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-12 mb-12"> <!-- Col 1: Brand & Heritage --> <div class="space-y-4"> <div class="flex items-center gap-3"> <div class="w-10 h-10 rounded-xl bg-gradient-to-br from-[#2D5A43] via-[#D4A373] to-[#C85A32] p-0.5"> <div class="w-full h-full bg-stone-950 rounded-[10px] flex items-center justify-center font-serif text-lg font-bold text-amber-400">
E
</div> </div> <div> <h3 class="font-serif text-xl font-bold text-stone-100">Casa da Enzo</h3> <p class="text-[10px] uppercase tracking-widest text-amber-400">Sizilien trifft Goslar • Seit 1980</p> </div> </div> <p class="text-xs leading-relaxed text-stone-400">
7 individuelle Boutique-Apartments über unserer traditionsreichen Trattoria im UNESCO-Weltkulturerbe Goslar. 100% digitaler Check-in trifft auf authentische italienische Gastfreundschaft.
</p> <p class="text-xs text-amber-400 font-medium">
📍 Bäckerstraße 18 • 38640 Goslar, Harz
</p> </div> <!-- Col 2: Navigation --> <div class="space-y-3"> <h4 class="font-serif text-base font-semibold text-stone-100 border-b border-stone-800 pb-2">Navigation</h4> <ul class="space-y-2 text-xs"> <li> <a href="/apartments" class="hover:text-emerald-400 transition-colors flex items-center gap-2"> <span class="w-1.5 h-1.5 rounded-full bg-emerald-500"></span> <span>Apartments & Suiten (7 Einheiten)</span> </a> </li> <li> <a href="/trattoria" class="hover:text-[#C85A32] transition-colors flex items-center gap-2"> <span class="w-1.5 h-1.5 rounded-full bg-[#C85A32]"></span> <span>Trattoria da Enzo (Speisekarte & Tisch)</span> </a> </li> <li> <a href="/trattoria#gutscheine" class="hover:text-amber-400 transition-colors flex items-center gap-2"> <span class="w-1.5 h-1.5 rounded-full bg-amber-400"></span> <span>Gutschein-Shop</span> </a> </li> <li> <a href="/blog" class="hover:text-amber-400 transition-colors">
Blog & Magazin
</a> </li> <li> <a href="/#geschichte" class="hover:text-amber-400 transition-colors">
Unsere Geschichte
</a> </li> </ul> </div> <!-- Col 3: Contacts --> <div class="space-y-3"> <h4 class="font-serif text-base font-semibold text-stone-100 border-b border-stone-800 pb-2">
Kontakt & Service
</h4> <div class="space-y-3 text-xs"> <!-- Apartments Contact --> <div class="p-3 rounded-xl bg-stone-900 border border-emerald-500/30 space-y-1"> <div class="text-[10px] uppercase font-bold text-emerald-400 flex items-center gap-1.5"> <span class="w-2 h-2 rounded-full bg-emerald-500"></span> <span>Apartments & Buchungen</span> </div> <a href="https://wa.me/4915207483196" target="_blank" class="block text-emerald-400 hover:underline font-bold">
WhatsApp: +49 1520 7483196
</a> <p class="text-[10px] text-stone-400">E-Mail: booking@casa-daenzo.de</p> </div> <!-- Trattoria Contact --> <div class="p-3 rounded-xl bg-stone-900 border border-[#C85A32]/30 space-y-1"> <div class="text-[10px] uppercase font-bold text-[#C85A32] flex items-center gap-1.5"> <span class="w-2 h-2 rounded-full bg-[#C85A32]"></span> <span>Trattoria Reservierung</span> </div> <a href="tel:+4915207483196" class="block text-[#C85A32] hover:underline font-bold">
Telefon: +49 1520 7483196
</a> <p class="text-[10px] text-stone-400">Öffnungszeiten: Di–So 17:00–22:30 Uhr</p> </div> </div> </div> <!-- Col 4: Direct Booking Advantages --> <div class="p-6 rounded-3xl bg-stone-900 border border-stone-800 space-y-4 shadow-xl"> <h4 class="font-serif text-base font-semibold text-amber-400">
Direktbucher-Vorteile
</h4> <ul class="space-y-2.5 text-xs text-stone-300"> <li class="flex items-start gap-2"> <span class="text-amber-400 font-bold">✓</span> <span>Bestpreis-Garantie (15% günstiger als Booking.com)</span> </li> <li class="flex items-start gap-2"> <span class="text-amber-400 font-bold">✓</span> <span>Bevorzugte Tischreservierung in der Trattoria</span> </li> <li class="flex items-start gap-2"> <span class="text-amber-400 font-bold">✓</span> <span>Kontaktloser Nuki Smart-Lock Check-in</span> </li> </ul> <a href="/apartments#booking" class="block text-center py-2.5 rounded-xl bg-[#C85A32] text-white font-bold text-xs hover:bg-[#b04d2a] transition-colors">
Verfügbarkeit prüfen
</a> </div> </div> <!-- Bottom line --> <div class="pt-8 border-t border-stone-900 flex flex-col sm:flex-row items-center justify-between text-xs text-stone-500 gap-4"> <p>© 2026 Casa da Enzo Goslar. Alle Rechte vorbehalten.</p> <div class="flex items-center gap-6"> <a href="https://guest.eviivo.com/casa-daenzo" target="_blank" class="hover:text-stone-300 transition-colors">Eviivo Guest Directory</a> </div> </div> </div> </footer> <div id="enzino-widget" class="fixed bottom-6 right-6 z-50 font-sans" data-lang="de"> <!-- Floating Launcher Button --> <button id="enzino-launcher" class="relative group flex items-center gap-3 bg-[#24211D] border border-[#D4A373]/30 hover:border-[#D4A373] text-[#E6D5C3] px-4 py-3 rounded-full shadow-2xl transition-all duration-300 hover:scale-105" aria-label="Enzino Concierge Chat öffnen"> <div class="relative w-10 h-10 rounded-full bg-gradient-to-br from-[#C85A32] to-[#D4A373] p-0.5 flex items-center justify-center shadow-inner"> <div class="w-full h-full rounded-full bg-[#1A1816] flex items-center justify-center text-lg font-serif font-bold text-[#D4A373]">
🇮🇹
</div> <span class="absolute -top-0.5 -right-0.5 w-3 h-3 bg-emerald-500 rounded-full border-2 border-[#1A1816] animate-pulse"></span> </div> <div class="text-left hidden sm:block"> <div class="text-xs font-serif font-bold text-[#D4A373] tracking-wide">Enzino Concierge</div> <div class="text-[10px] text-[#A3978B]">Online • Frag mich was!</div> </div> </button> <!-- Chat Dialog Window --> <div id="enzino-chat-window" class="hidden fixed bottom-6 right-6 w-[calc(100vw-3rem)] sm:w-[380px] max-h-[580px] h-[85vh] bg-[#24211D] border border-[#D4A373]/30 rounded-3xl shadow-2xl flex-col overflow-hidden transition-all duration-300 z-50"> <!-- Header --> <div class="bg-[#1A1816] border-b border-[#D4A373]/20 p-4 flex items-center justify-between"> <div class="flex items-center gap-3"> <div class="relative w-10 h-10 rounded-full bg-gradient-to-br from-[#C85A32] to-[#D4A373] p-0.5 flex items-center justify-center"> <div class="w-full h-full rounded-full bg-[#24211D] flex items-center justify-center text-lg">
👨‍🍳
</div> <span class="absolute bottom-0 right-0 w-2.5 h-2.5 bg-emerald-500 rounded-full border border-[#1A1816]"></span> </div> <div> <h3 class="font-serif text-sm font-bold text-[#E6D5C3]">Enzino da Enzo</h3> <p class="text-[10px] text-[#D4A373]">Digitaler Host & Concierge</p> </div> </div> <div class="flex items-center gap-2"> <!-- Session Disable Button --> <button id="enzino-disable-btn" title="Enzino für diese Session deaktivieren" class="p-1.5 text-[#A3978B] hover:text-amber-400 rounded-lg hover:bg-[#2A2622] text-xs transition-colors">
🚫
</button> <!-- Close Button --> <button id="enzino-close-btn" class="p-1.5 text-[#A3978B] hover:text-white rounded-lg hover:bg-[#2A2622] transition-colors" aria-label="Chat schließen">
✕
</button> </div> </div> <!-- Messages Body --> <div id="enzino-messages" class="flex-1 p-4 overflow-y-auto space-y-3.5 text-xs text-[#E6D5C3]"> <!-- Initial Bot Message --> <div class="flex gap-2.5 items-start"> <div class="w-7 h-7 rounded-full bg-[#C85A32]/20 border border-[#C85A32]/40 flex items-center justify-center text-xs shrink-0">
🇮🇹
</div> <div class="bg-[#2E2A25] border border-[#D4A373]/15 p-3 rounded-2xl rounded-tl-none max-w-[85%] leading-relaxed shadow-sm"> Ciao! I&#39;m Enzino, dein italienischer Digital Concierge 🇮🇹 Wie kann ich dir heute helfen? Frag mich nach unseren Apartments, der Trattoria oder dem digitalen Check-in! </div> </div> <!-- Quick Chips --> <div id="enzino-chips" class="flex flex-wrap gap-1.5 pt-2 pl-9"> <button class="enzino-chip text-[11px] bg-[#1A1816] hover:bg-[#C85A32]/20 text-[#D4A373] border border-[#D4A373]/30 hover:border-[#D4A373] px-3 py-1.5 rounded-full transition-all text-left" data-question="Wie funktioniert der Check-in?"> Wie funktioniert der Check-in? </button><button class="enzino-chip text-[11px] bg-[#1A1816] hover:bg-[#C85A32]/20 text-[#D4A373] border border-[#D4A373]/30 hover:border-[#D4A373] px-3 py-1.5 rounded-full transition-all text-left" data-question="Tisch in der Trattoria reservieren"> Tisch in der Trattoria reservieren </button><button class="enzino-chip text-[11px] bg-[#1A1816] hover:bg-[#C85A32]/20 text-[#D4A373] border border-[#D4A373]/30 hover:border-[#D4A373] px-3 py-1.5 rounded-full transition-all text-left" data-question="Direktbucher Bestpreis"> Direktbucher Bestpreis </button><button class="enzino-chip text-[11px] bg-[#1A1816] hover:bg-[#C85A32]/20 text-[#D4A373] border border-[#D4A373]/30 hover:border-[#D4A373] px-3 py-1.5 rounded-full transition-all text-left" data-question="Digitales Gästebuch (Eviivo)"> Digitales Gästebuch (Eviivo) </button> </div> </div> <!-- Typing Indicator (hidden by default) --> <div id="enzino-typing" class="hidden px-4 py-2 text-[11px] text-[#D4A373] italic flex items-center gap-2 bg-[#1A1816]/50"> <span class="w-2 h-2 bg-[#D4A373] rounded-full animate-ping"></span> <span>Enzino tippt...</span> </div> <!-- Input Footer --> <form id="enzino-form" class="bg-[#1A1816] border-t border-[#D4A373]/20 p-3 flex gap-2"> <input type="text" id="enzino-input" placeholder="Stelle Enzino eine Frage..." class="flex-1 bg-[#24211D] border border-[#D4A373]/20 focus:border-[#D4A373] text-[#E6D5C3] placeholder-[#A3978B] text-xs rounded-xl px-3 py-2.5 outline-none transition-all" autocomplete="off"> <button type="submit" class="bg-[#C85A32] hover:bg-[#b04d2a] text-white px-3.5 py-2.5 rounded-xl text-xs font-bold transition-all shrink-0">
➔
</button> </form> </div> </div> </body></html>
+84
View File
@@ -0,0 +1,84 @@
<!DOCTYPE html><html lang="de" class="scroll-smooth bg-[#1A1816] text-[#E6D5C3]"> <head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><link rel="icon" type="image/svg+xml" href="/favicon.svg"><meta name="generator" content="Astro v4.16.19"><!-- SEO Meta Tags --><title>Komfort-Suite 1 mit Balkon | Casa da Enzo Goslar</title><meta name="description" content="Lichtdurchflutete Premium-Suite mit historischem Altstadt-Balkon und Bosch-Küche"><meta name="robots" content="index, follow"><!-- Open Graph / Facebook / WhatsApp --><meta property="og:type" content="website"><meta property="og:url" content="https://casa-daenzo.de/apartments/suite-1-balkon/"><meta property="og:title" content="Komfort-Suite 1 mit Balkon | Casa da Enzo Goslar"><meta property="og:description" content="Lichtdurchflutete Premium-Suite mit historischem Altstadt-Balkon und Bosch-Küche"><meta property="og:image" content="https://casa-daenzo.de/og-image.jpg"><!-- Twitter --><meta property="twitter:card" content="summary_large_image"><meta property="twitter:title" content="Komfort-Suite 1 mit Balkon | Casa da Enzo Goslar"><meta property="twitter:description" content="Lichtdurchflutete Premium-Suite mit historischem Altstadt-Balkon und Bosch-Küche"><meta property="twitter:image" content="https://casa-daenzo.de/og-image.jpg"><!-- Schema.org JSON-LD --><script type="application/ld+json">{"@context":"https://schema.org","@graph":[{"@type":"LodgingBusiness","@id":"https://casa-daenzo.de/#lodging","name":"Casa da Enzo Boutique Apartments","url":"https://casa-daenzo.de","telephone":"+4915207483196","email":"booking@casa-daenzo.de","address":{"@type":"PostalAddress","streetAddress":"Bäckerstraße 18","addressLocality":"Goslar","postalCode":"38640","addressCountry":"DE"},"geo":{"@type":"GeoCoordinates","latitude":51.906,"longitude":10.428},"checkinTime":"15:00","checkoutTime":"11:00","numberOfRooms":7},{"@type":"Restaurant","@id":"https://casa-daenzo.de/#restaurant","name":"Trattoria da Enzo","url":"https://casa-daenzo.de/#trattoria","telephone":"+49532123456","servesCuisine":"Italian","address":{"@type":"PostalAddress","streetAddress":"Bäckerstraße 18","addressLocality":"Goslar","postalCode":"38640","addressCountry":"DE"}}]}</script><!-- Google Analytics (GA4) Snippet --><script async src="https://www.googletagmanager.com/gtag/js?id=G-CASADAENZO1"></script><script>(function(){const GA_MEASUREMENT_ID = "G-CASADAENZO1";
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', GA_MEASUREMENT_ID, {
anonymize_ip: true,
cookie_flags: 'SameSite=None;Secure'
});
})();</script><link rel="stylesheet" href="/_astro/_slug_.B_TTBYoh.css"><script type="module" src="/_astro/hoisted.jAcVTPu2.js"></script></head> <body class="bg-[#1A1816] text-[#E6D5C3] antialiased min-h-screen flex flex-col selection:bg-[#D4A373] selection:text-[#1A1816]"> <header class="sticky top-0 z-40 w-full bg-stone-900/95 backdrop-blur-md border-b border-stone-800 transition-all"> <!-- Top Utility Contact Bar --> <div class="bg-stone-950 border-b border-stone-800/80 py-1.5 px-4 text-[11px] sm:text-xs"> <div class="max-w-7xl mx-auto flex flex-wrap items-center justify-between gap-2 text-stone-400"> <!-- Dual Contacts --> <div class="flex flex-wrap items-center gap-4 sm:gap-6"> <!-- Apartments Phone --> <a href="https://wa.me/4915207483196" target="_blank" rel="noopener noreferrer" class="inline-flex items-center gap-1.5 text-emerald-400 hover:text-emerald-300 font-medium transition-colors" title="Apartment Anfragen & Concierge Alja"> <span class="w-2 h-2 rounded-full bg-emerald-500"></span> <span class="text-stone-300">Apartments (WhatsApp):</span> <span class="underline font-semibold">+49 1520 7483196</span> </a> <!-- Trattoria Phone --> <a href="tel:+4915207483196" class="inline-flex items-center gap-1.5 text-[#C85A32] hover:text-[#e2724a] font-medium transition-colors" title="Trattoria Tischreservierung"> <span class="w-2 h-2 rounded-full bg-[#C85A32]"></span> <span class="text-stone-300">Trattoria:</span> <span class="underline font-semibold">+49 1520 7483196</span> </a> </div> <!-- Right Utility Links: Eviivo & Language Switch --> <div class="flex items-center gap-4"> <a href="https://guest.eviivo.com/casa-daenzo" target="_blank" rel="noopener noreferrer" class="inline-flex items-center gap-1 text-amber-400 hover:text-white transition-colors font-medium cursor-pointer" title="Digital Guest Directory"> <span>📖</span> <span class="underline">Eviivo Guest Directory</span> </a> <div class="flex items-center bg-stone-900 border border-stone-800 rounded-full px-2 py-0.5 text-[11px] font-bold"> <span class="px-1.5 py-0.5 rounded-full bg-amber-500 text-stone-950">DE</span> </div> </div> </div> </div> <!-- Main Navigation Bar --> <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 h-20 flex items-center justify-between"> <!-- Brand Logo --> <a href="/" class="flex items-center gap-3 group"> <div class="w-11 h-11 rounded-2xl bg-gradient-to-br from-[#2D5A43] via-[#D4A373] to-[#C85A32] p-0.5 shadow-lg group-hover:scale-105 transition-transform"> <div class="w-full h-full bg-stone-950 rounded-[14px] flex items-center justify-center font-serif text-xl font-bold text-amber-400">
E
</div> </div> <div class="flex flex-col"> <span class="font-serif text-xl tracking-wide font-bold text-white group-hover:text-amber-400 transition-colors">
Casa da Enzo
</span> <div class="flex items-center gap-1.5 text-[10px] tracking-widest uppercase font-sans -mt-0.5"> <span class="text-emerald-400 font-semibold">Apartments</span> <span class="text-stone-400">•</span> <span class="text-[#C85A32] font-semibold">Trattoria</span> </div> </div> </a> <!-- Desktop Navigation --> <nav class="hidden md:flex items-center gap-6 lg:gap-8 text-sm font-medium"> <a href="/apartments" class="text-stone-200 hover:text-emerald-400 transition-colors flex items-center gap-1.5"> <span class="w-1.5 h-1.5 rounded-full bg-emerald-500"></span> <span>Apartments & Suiten</span> </a> <a href="/trattoria" class="text-stone-200 hover:text-[#C85A32] transition-colors flex items-center gap-1.5"> <span class="w-1.5 h-1.5 rounded-full bg-[#C85A32]"></span> <span>Trattoria da Enzo</span> </a> <a href="/blog" class="text-stone-200 hover:text-amber-400 transition-colors">
Blog & Magazin
</a> <a href="/#geschichte" class="text-stone-200 hover:text-amber-400 transition-colors">
Unsere Geschichte
</a> <a href="/#faq" class="text-stone-200 hover:text-amber-400 transition-colors">
FAQ
</a> </nav> <!-- CTAs --> <div class="flex items-center gap-3"> <a href="/apartments#booking" class="hidden sm:inline-flex items-center gap-2 px-5 py-2.5 rounded-full bg-[#C85A32] text-white font-medium text-xs lg:text-sm hover:bg-[#b04d2a] shadow-md transition-all hover:scale-105"> <span>Direkt buchen (Bestpreis)</span> </a> <!-- Mobile Menu Button --> <button id="mobile-menu-btn" class="md:hidden p-2 text-stone-200 hover:text-amber-400 rounded-xl bg-stone-800 border border-stone-700" aria-label="Menü öffnen"> <svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16"></path> </svg> </button> </div> </div> <!-- Mobile Navigation Dropdown --> <div id="mobile-menu" class="hidden md:hidden bg-stone-950 border-b border-stone-800 px-4 py-6 space-y-4"> <a href="/apartments" class="block py-2 text-stone-200 font-medium hover:text-emerald-400 flex items-center gap-2"> <span class="w-2 h-2 rounded-full bg-emerald-500"></span> <span>Apartments & Suiten</span> </a> <a href="/trattoria" class="block py-2 text-stone-200 font-medium hover:text-[#C85A32] flex items-center gap-2"> <span class="w-2 h-2 rounded-full bg-[#C85A32]"></span> <span>Trattoria da Enzo</span> </a> <a href="/blog" class="block py-2 text-stone-200 font-medium hover:text-amber-400">
Blog & Magazin
</a> <a href="/#geschichte" class="block py-2 text-stone-200 font-medium hover:text-amber-400">
Unsere Geschichte
</a> <a href="/#faq" class="block py-2 text-stone-200 font-medium hover:text-amber-400">
FAQ
</a> <div class="pt-2 border-t border-stone-800 space-y-2"> <a href="https://wa.me/4915207483196" target="_blank" class="block py-1.5 text-xs text-emerald-400 font-semibold">
💬 Apartments WhatsApp: +49 1520 7483196
</a> <a href="https://guest.eviivo.com/casa-daenzo" target="_blank" class="block py-1.5 text-xs text-amber-400 font-semibold">
📖 Eviivo Guest Directory
</a> </div> <a href="/apartments#booking" class="block text-center py-3 rounded-2xl bg-[#C85A32] text-white font-bold text-sm">
Jetzt Direkt buchen
</a> </div> </header> <main class="flex-1"> <div class="py-12 bg-[#1A1816]"> <div class="max-w-5xl mx-auto px-4 sm:px-6 lg:px-8 space-y-8"> <!-- Back Link & Top Badges Bar --> <div class="flex flex-col sm:flex-row sm:items-center justify-between gap-4"> <a href="/#apartments" class="inline-flex items-center gap-2 text-xs font-bold text-emerald-400 hover:underline">
← Zurück zu allen Apartments
</a> <!-- Airbnb & Booking Badges + Eviivo Guest Directory --> <div class="flex flex-wrap items-center gap-3 text-xs font-medium"> <span class="px-3 py-1 rounded-full bg-[#24211D] border border-[#D4A373]/20 text-[#E6D5C3]">
★ <strong class="text-[#D4A373]">4.98</strong> Superhost
</span> <span class="px-3 py-1 rounded-full bg-[#24211D] border border-[#D4A373]/20 text-[#E6D5C3]">
Booking.com <strong class="text-blue-400">9.8</strong> </span> <button onclick="document.getElementById('eviivo-link-btn')?.click()" class="px-3 py-1 rounded-full bg-[#2D5A43]/30 border border-emerald-500/40 text-emerald-400 hover:bg-[#2D5A43]/50 transition-colors flex items-center gap-1 font-semibold"> <span>📖 Eviivo Gästemappe</span> </button> </div> </div> <!-- Title & Header --> <div class="space-y-3"> <span class="inline-block px-3 py-1 rounded-full text-xs font-bold uppercase tracking-wider bg-[#2D5A43] text-emerald-100 border border-emerald-500/40"> Premium-Komfort </span> <h1 class="font-serif text-4xl sm:text-5xl font-bold text-[#E6D5C3]">Komfort-Suite 1 mit Balkon</h1> <p class="text-[#A3978B] text-base sm:text-lg leading-relaxed">Lichtdurchflutete Premium-Suite mit historischem Altstadt-Balkon und Bosch-Küche</p> </div> <!-- Quick Specs Bar --> <div class="grid grid-cols-2 sm:grid-cols-4 gap-4 p-6 rounded-3xl stone-card border border-[#D4A373]/20 text-center"> <div> <span class="block text-[10px] uppercase tracking-wider text-[#D4A373] font-bold">Kapazität</span> <span class="font-serif text-lg font-bold text-[#E6D5C3] mt-1 block">👥 Bis 4 Gäste</span> </div> <div> <span class="block text-[10px] uppercase tracking-wider text-[#D4A373] font-bold">Größe</span> <span class="font-serif text-lg font-bold text-[#E6D5C3] mt-1 block">📐 58 m²</span> </div> <div> <span class="block text-[10px] uppercase tracking-wider text-[#D4A373] font-bold">Aussicht</span> <span class="font-serif text-lg font-bold text-[#E6D5C3] mt-1 block">🌿 Balkon / Terrasse</span> </div> <div> <span class="block text-[10px] uppercase tracking-wider text-[#D4A373] font-bold">Workspace</span> <span class="font-serif text-lg font-bold text-[#E6D5C3] mt-1 block">💻 Workstation</span> </div> </div> <!-- Visual Gallery Placeholder Banner --> <div class="aspect-[21/9] rounded-3xl bg-gradient-to-br from-[#2E2A25] to-[#1A1816] text-[#E6D5C3] flex flex-col items-center justify-center p-6 text-center border border-[#D4A373]/20 relative overflow-hidden shadow-2xl"> <div class="relative z-10 space-y-2"> <span class="px-3.5 py-1 rounded-full bg-[#2D5A43]/30 text-emerald-400 text-xs font-bold uppercase tracking-widest border border-emerald-500/30">
Saniert 2025 • UNESCO Altstadt Goslar
</span> <h2 class="font-serif text-2xl sm:text-3xl font-bold">Komfort-Suite 1 mit Balkon</h2> <p class="text-[#A3978B] text-xs sm:text-sm max-w-md mx-auto">
Restauriertes Fachwerk aus dem 16. Jahrhundert kombiniert mit italienischem Design & smartem Nuki Keyless Check-in.
</p> </div> </div> <!-- Highlights & Details --> <div class="grid grid-cols-1 md:grid-cols-3 gap-8 pt-4"> <div class="md:col-span-2 space-y-6 stone-card p-8 rounded-3xl border border-[#D4A373]/20"> <h2 class="font-serif text-2xl font-bold text-[#E6D5C3]">Beschreibung & Ausstattung</h2> <div class="prose prose-invert max-w-none text-[#E6D5C3] text-sm leading-relaxed"> <p>Willkommen in unserer Flaggschiff-Komfort-Suite. Diese 58m² große Wohnung im 1. Obergeschoss verbindet restauriertes Fachwerk aus dem 16. Jahrhundert mit zeitgemäßem skandinavisch-italienischem Design.</p>
<p>Genieße deinen Morgenkaffee auf dem privaten Balkon mit Blick in die ruhige Altstadtstraße oder nutze den separaten Arbeitsbereich für produktive Workation-Tage.</p> </div> <div class="pt-6 border-t border-[#D4A373]/15"> <h3 class="font-serif text-lg font-bold text-[#D4A373] mb-2">Küche & Verpflegung</h3> <p class="text-[#A3978B] text-xs leading-relaxed">Voll ausgestattete Bosch-Einbauküche</p> </div> <div class="pt-4 border-t border-[#D4A373]/15 flex flex-wrap items-center justify-between gap-4 text-xs text-[#A3978B]"> <span>🔑 Nuki Smart Lock PIN Check-in ab 15:00 Uhr</span> <span>🌿 Nachhaltige Lehmdämmung für gesunden Schlaf</span> </div> </div> <!-- Sidebar / Highlights --> <div class="space-y-6"> <div class="stone-card p-6 rounded-3xl space-y-4 border border-[#D4A373]/30 shadow-xl"> <h3 class="font-serif text-xl font-bold text-[#D4A373]">Ausstattungs-Highlights</h3> <ul class="space-y-3 text-xs text-[#E6D5C3]"> <li class="flex items-start gap-3"> <span class="text-emerald-400 font-bold">✓</span> <span>Privater Balkon zur ruhigen Bäckerstraße</span> </li><li class="flex items-start gap-3"> <span class="text-emerald-400 font-bold">✓</span> <span>Ergonomischer Dedicated Workspace mit Highspeed-WLAN</span> </li><li class="flex items-start gap-3"> <span class="text-emerald-400 font-bold">✓</span> <span>Nuki Keyless Smart Lock Check-in</span> </li><li class="flex items-start gap-3"> <span class="text-emerald-400 font-bold">✓</span> <span>Gesundes Raumklima durch nachhaltige Lehmputz-Sanierung</span> </li> </ul> </div> <!-- Trattoria Info Card --> <div class="stone-card border border-[#C85A32]/40 p-6 rounded-3xl space-y-3"> <span class="text-xs font-bold uppercase tracking-wider text-[#C85A32]">Hauseigene Gastronomie</span> <h4 class="font-serif text-lg font-bold text-[#E6D5C3]">Trattoria da Enzo im Erdgeschoss</h4> <p class="text-xs text-[#A3978B] leading-relaxed">
Als Hotelgast genießt du eine bevorzugte Tischreservierung bei Alessandra. Genieße hausgemachte Pasta und sizilianische Weine direkt im Haus!
</p> <a href="tel:+49532123456" class="inline-block text-xs font-bold text-[#C85A32] hover:underline">
📞 Tisch reservieren: +49 5321 23456 →
</a> </div> </div> </div> <!-- Eviivo Booking Widget --> <section id="booking" class="pt-6"> <div class="stone-card rounded-3xl p-6 sm:p-10 max-w-4xl mx-auto my-8 font-sans border border-[#D4A373]/30 shadow-2xl"> <div class="text-center mb-8 space-y-2"> <div class="inline-flex items-center gap-2 px-3.5 py-1 rounded-full bg-[#2D5A43]/20 border border-emerald-500/40 text-emerald-400 text-xs font-bold uppercase tracking-wider"> <span>🔒 Direktbucher Bestpreis-Garantie</span> </div> <h3 class="font-serif text-2xl sm:text-3xl font-bold text-[#E6D5C3]">
Verfügbarkeit & Bestpreis prüfen
</h3> <p class="text-[#A3978B] text-xs sm:text-sm max-w-xl mx-auto">
Buche direkt über unsere Eviivo-Schnittstelle – 15% günstiger als auf Booking.com oder Airbnb. Bestpreis garantiert!
</p> </div> <!-- Booking Mask Interface --> <form action="https://onlinereservation.eviivo.com" method="GET" target="_blank" class="grid grid-cols-1 sm:grid-cols-3 gap-4"> <div class="space-y-1"> <label class="text-xs font-semibold text-[#D4A373] uppercase tracking-wider">Anreise</label> <input type="date" name="startDate" class="w-full px-4 py-3 rounded-xl bg-[#1A1816] border border-[#D4A373]/30 text-[#E6D5C3] text-xs focus:border-[#D4A373] focus:outline-none" required> </div> <div class="space-y-1"> <label class="text-xs font-semibold text-[#D4A373] uppercase tracking-wider">Abreise</label> <input type="date" name="endDate" class="w-full px-4 py-3 rounded-xl bg-[#1A1816] border border-[#D4A373]/30 text-[#E6D5C3] text-xs focus:border-[#D4A373] focus:outline-none" required> </div> <div class="space-y-1"> <label class="text-xs font-semibold text-[#D4A373] uppercase tracking-wider">Gäste</label> <select name="adults" class="w-full px-4 py-3 rounded-xl bg-[#1A1816] border border-[#D4A373]/30 text-[#E6D5C3] text-xs focus:border-[#D4A373] focus:outline-none"> <option value="1">1 Person</option> <option value="2" selected>2 Personen</option> <option value="3">3 Personen</option> <option value="4">4 Personen</option> </select> </div> <div class="sm:col-span-3 pt-2"> <button type="submit" class="w-full py-4 rounded-xl bg-gradient-to-r from-[#2D5A43] to-[#C85A32] text-white font-bold text-sm hover:opacity-95 shadow-xl transition-all">
Jetzt Verfügbarkeit & Bestpreis abrufen ➔
</button> </div> </form> <div class="mt-6 text-center text-[11px] text-[#A3978B] flex flex-wrap items-center justify-center gap-4 border-t border-[#D4A373]/10 pt-4"> <span>🔒 Sichere SSL-Schnittstelle</span> <span>•</span> <span>💳 Keine versteckten Gebühren</span> <span>•</span> <span>⚡ Sofortige Reservierungsbestätigung</span> </div> </div> </section> </div> </div> </main> <footer class="bg-stone-950 text-stone-400 pt-16 pb-12 border-t border-stone-800 font-sans"> <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8"> <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-12 mb-12"> <!-- Col 1: Brand & Heritage --> <div class="space-y-4"> <div class="flex items-center gap-3"> <div class="w-10 h-10 rounded-xl bg-gradient-to-br from-[#2D5A43] via-[#D4A373] to-[#C85A32] p-0.5"> <div class="w-full h-full bg-stone-950 rounded-[10px] flex items-center justify-center font-serif text-lg font-bold text-amber-400">
E
</div> </div> <div> <h3 class="font-serif text-xl font-bold text-stone-100">Casa da Enzo</h3> <p class="text-[10px] uppercase tracking-widest text-amber-400">Sizilien trifft Goslar • Seit 1980</p> </div> </div> <p class="text-xs leading-relaxed text-stone-400">
7 individuelle Boutique-Apartments über unserer traditionsreichen Trattoria im UNESCO-Weltkulturerbe Goslar. 100% digitaler Check-in trifft auf authentische italienische Gastfreundschaft.
</p> <p class="text-xs text-amber-400 font-medium">
📍 Bäckerstraße 18 • 38640 Goslar, Harz
</p> </div> <!-- Col 2: Navigation --> <div class="space-y-3"> <h4 class="font-serif text-base font-semibold text-stone-100 border-b border-stone-800 pb-2">Navigation</h4> <ul class="space-y-2 text-xs"> <li> <a href="/apartments" class="hover:text-emerald-400 transition-colors flex items-center gap-2"> <span class="w-1.5 h-1.5 rounded-full bg-emerald-500"></span> <span>Apartments & Suiten (7 Einheiten)</span> </a> </li> <li> <a href="/trattoria" class="hover:text-[#C85A32] transition-colors flex items-center gap-2"> <span class="w-1.5 h-1.5 rounded-full bg-[#C85A32]"></span> <span>Trattoria da Enzo (Speisekarte & Tisch)</span> </a> </li> <li> <a href="/trattoria#gutscheine" class="hover:text-amber-400 transition-colors flex items-center gap-2"> <span class="w-1.5 h-1.5 rounded-full bg-amber-400"></span> <span>Gutschein-Shop</span> </a> </li> <li> <a href="/blog" class="hover:text-amber-400 transition-colors">
Blog & Magazin
</a> </li> <li> <a href="/#geschichte" class="hover:text-amber-400 transition-colors">
Unsere Geschichte
</a> </li> </ul> </div> <!-- Col 3: Contacts --> <div class="space-y-3"> <h4 class="font-serif text-base font-semibold text-stone-100 border-b border-stone-800 pb-2">
Kontakt & Service
</h4> <div class="space-y-3 text-xs"> <!-- Apartments Contact --> <div class="p-3 rounded-xl bg-stone-900 border border-emerald-500/30 space-y-1"> <div class="text-[10px] uppercase font-bold text-emerald-400 flex items-center gap-1.5"> <span class="w-2 h-2 rounded-full bg-emerald-500"></span> <span>Apartments & Buchungen</span> </div> <a href="https://wa.me/4915207483196" target="_blank" class="block text-emerald-400 hover:underline font-bold">
WhatsApp: +49 1520 7483196
</a> <p class="text-[10px] text-stone-400">E-Mail: booking@casa-daenzo.de</p> </div> <!-- Trattoria Contact --> <div class="p-3 rounded-xl bg-stone-900 border border-[#C85A32]/30 space-y-1"> <div class="text-[10px] uppercase font-bold text-[#C85A32] flex items-center gap-1.5"> <span class="w-2 h-2 rounded-full bg-[#C85A32]"></span> <span>Trattoria Reservierung</span> </div> <a href="tel:+4915207483196" class="block text-[#C85A32] hover:underline font-bold">
Telefon: +49 1520 7483196
</a> <p class="text-[10px] text-stone-400">Öffnungszeiten: Di–So 17:00–22:30 Uhr</p> </div> </div> </div> <!-- Col 4: Direct Booking Advantages --> <div class="p-6 rounded-3xl bg-stone-900 border border-stone-800 space-y-4 shadow-xl"> <h4 class="font-serif text-base font-semibold text-amber-400">
Direktbucher-Vorteile
</h4> <ul class="space-y-2.5 text-xs text-stone-300"> <li class="flex items-start gap-2"> <span class="text-amber-400 font-bold">✓</span> <span>Bestpreis-Garantie (15% günstiger als Booking.com)</span> </li> <li class="flex items-start gap-2"> <span class="text-amber-400 font-bold">✓</span> <span>Bevorzugte Tischreservierung in der Trattoria</span> </li> <li class="flex items-start gap-2"> <span class="text-amber-400 font-bold">✓</span> <span>Kontaktloser Nuki Smart-Lock Check-in</span> </li> </ul> <a href="/apartments#booking" class="block text-center py-2.5 rounded-xl bg-[#C85A32] text-white font-bold text-xs hover:bg-[#b04d2a] transition-colors">
Verfügbarkeit prüfen
</a> </div> </div> <!-- Bottom line --> <div class="pt-8 border-t border-stone-900 flex flex-col sm:flex-row items-center justify-between text-xs text-stone-500 gap-4"> <p>© 2026 Casa da Enzo Goslar. Alle Rechte vorbehalten.</p> <div class="flex items-center gap-6"> <a href="https://guest.eviivo.com/casa-daenzo" target="_blank" class="hover:text-stone-300 transition-colors">Eviivo Guest Directory</a> </div> </div> </div> </footer> <div id="enzino-widget" class="fixed bottom-6 right-6 z-50 font-sans" data-lang="de"> <!-- Floating Launcher Button --> <button id="enzino-launcher" class="relative group flex items-center gap-3 bg-[#24211D] border border-[#D4A373]/30 hover:border-[#D4A373] text-[#E6D5C3] px-4 py-3 rounded-full shadow-2xl transition-all duration-300 hover:scale-105" aria-label="Enzino Concierge Chat öffnen"> <div class="relative w-10 h-10 rounded-full bg-gradient-to-br from-[#C85A32] to-[#D4A373] p-0.5 flex items-center justify-center shadow-inner"> <div class="w-full h-full rounded-full bg-[#1A1816] flex items-center justify-center text-lg font-serif font-bold text-[#D4A373]">
🇮🇹
</div> <span class="absolute -top-0.5 -right-0.5 w-3 h-3 bg-emerald-500 rounded-full border-2 border-[#1A1816] animate-pulse"></span> </div> <div class="text-left hidden sm:block"> <div class="text-xs font-serif font-bold text-[#D4A373] tracking-wide">Enzino Concierge</div> <div class="text-[10px] text-[#A3978B]">Online • Frag mich was!</div> </div> </button> <!-- Chat Dialog Window --> <div id="enzino-chat-window" class="hidden fixed bottom-6 right-6 w-[calc(100vw-3rem)] sm:w-[380px] max-h-[580px] h-[85vh] bg-[#24211D] border border-[#D4A373]/30 rounded-3xl shadow-2xl flex-col overflow-hidden transition-all duration-300 z-50"> <!-- Header --> <div class="bg-[#1A1816] border-b border-[#D4A373]/20 p-4 flex items-center justify-between"> <div class="flex items-center gap-3"> <div class="relative w-10 h-10 rounded-full bg-gradient-to-br from-[#C85A32] to-[#D4A373] p-0.5 flex items-center justify-center"> <div class="w-full h-full rounded-full bg-[#24211D] flex items-center justify-center text-lg">
👨‍🍳
</div> <span class="absolute bottom-0 right-0 w-2.5 h-2.5 bg-emerald-500 rounded-full border border-[#1A1816]"></span> </div> <div> <h3 class="font-serif text-sm font-bold text-[#E6D5C3]">Enzino da Enzo</h3> <p class="text-[10px] text-[#D4A373]">Digitaler Host & Concierge</p> </div> </div> <div class="flex items-center gap-2"> <!-- Session Disable Button --> <button id="enzino-disable-btn" title="Enzino für diese Session deaktivieren" class="p-1.5 text-[#A3978B] hover:text-amber-400 rounded-lg hover:bg-[#2A2622] text-xs transition-colors">
🚫
</button> <!-- Close Button --> <button id="enzino-close-btn" class="p-1.5 text-[#A3978B] hover:text-white rounded-lg hover:bg-[#2A2622] transition-colors" aria-label="Chat schließen">
✕
</button> </div> </div> <!-- Messages Body --> <div id="enzino-messages" class="flex-1 p-4 overflow-y-auto space-y-3.5 text-xs text-[#E6D5C3]"> <!-- Initial Bot Message --> <div class="flex gap-2.5 items-start"> <div class="w-7 h-7 rounded-full bg-[#C85A32]/20 border border-[#C85A32]/40 flex items-center justify-center text-xs shrink-0">
🇮🇹
</div> <div class="bg-[#2E2A25] border border-[#D4A373]/15 p-3 rounded-2xl rounded-tl-none max-w-[85%] leading-relaxed shadow-sm"> Ciao! I&#39;m Enzino, dein italienischer Digital Concierge 🇮🇹 Wie kann ich dir heute helfen? Frag mich nach unseren Apartments, der Trattoria oder dem digitalen Check-in! </div> </div> <!-- Quick Chips --> <div id="enzino-chips" class="flex flex-wrap gap-1.5 pt-2 pl-9"> <button class="enzino-chip text-[11px] bg-[#1A1816] hover:bg-[#C85A32]/20 text-[#D4A373] border border-[#D4A373]/30 hover:border-[#D4A373] px-3 py-1.5 rounded-full transition-all text-left" data-question="Wie funktioniert der Check-in?"> Wie funktioniert der Check-in? </button><button class="enzino-chip text-[11px] bg-[#1A1816] hover:bg-[#C85A32]/20 text-[#D4A373] border border-[#D4A373]/30 hover:border-[#D4A373] px-3 py-1.5 rounded-full transition-all text-left" data-question="Tisch in der Trattoria reservieren"> Tisch in der Trattoria reservieren </button><button class="enzino-chip text-[11px] bg-[#1A1816] hover:bg-[#C85A32]/20 text-[#D4A373] border border-[#D4A373]/30 hover:border-[#D4A373] px-3 py-1.5 rounded-full transition-all text-left" data-question="Direktbucher Bestpreis"> Direktbucher Bestpreis </button><button class="enzino-chip text-[11px] bg-[#1A1816] hover:bg-[#C85A32]/20 text-[#D4A373] border border-[#D4A373]/30 hover:border-[#D4A373] px-3 py-1.5 rounded-full transition-all text-left" data-question="Digitales Gästebuch (Eviivo)"> Digitales Gästebuch (Eviivo) </button> </div> </div> <!-- Typing Indicator (hidden by default) --> <div id="enzino-typing" class="hidden px-4 py-2 text-[11px] text-[#D4A373] italic flex items-center gap-2 bg-[#1A1816]/50"> <span class="w-2 h-2 bg-[#D4A373] rounded-full animate-ping"></span> <span>Enzino tippt...</span> </div> <!-- Input Footer --> <form id="enzino-form" class="bg-[#1A1816] border-t border-[#D4A373]/20 p-3 flex gap-2"> <input type="text" id="enzino-input" placeholder="Stelle Enzino eine Frage..." class="flex-1 bg-[#24211D] border border-[#D4A373]/20 focus:border-[#D4A373] text-[#E6D5C3] placeholder-[#A3978B] text-xs rounded-xl px-3 py-2.5 outline-none transition-all" autocomplete="off"> <button type="submit" class="bg-[#C85A32] hover:bg-[#b04d2a] text-white px-3.5 py-2.5 rounded-xl text-xs font-bold transition-all shrink-0">
➔
</button> </form> </div> </div> </body></html>
+83
View File
@@ -0,0 +1,83 @@
<!DOCTYPE html><html lang="de" class="scroll-smooth bg-[#1A1816] text-[#E6D5C3]"> <head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><link rel="icon" type="image/svg+xml" href="/favicon.svg"><meta name="generator" content="Astro v4.16.19"><!-- SEO Meta Tags --><title>Komfort-Suite 2 mit Terrasse | Casa da Enzo Goslar</title><meta name="description" content="Großzügige 62m² Suite mit privatem Innenhof-Balkon und ruhiger Lage"><meta name="robots" content="index, follow"><!-- Open Graph / Facebook / WhatsApp --><meta property="og:type" content="website"><meta property="og:url" content="https://casa-daenzo.de/apartments/suite-2-terrasse/"><meta property="og:title" content="Komfort-Suite 2 mit Terrasse | Casa da Enzo Goslar"><meta property="og:description" content="Großzügige 62m² Suite mit privatem Innenhof-Balkon und ruhiger Lage"><meta property="og:image" content="https://casa-daenzo.de/og-image.jpg"><!-- Twitter --><meta property="twitter:card" content="summary_large_image"><meta property="twitter:title" content="Komfort-Suite 2 mit Terrasse | Casa da Enzo Goslar"><meta property="twitter:description" content="Großzügige 62m² Suite mit privatem Innenhof-Balkon und ruhiger Lage"><meta property="twitter:image" content="https://casa-daenzo.de/og-image.jpg"><!-- Schema.org JSON-LD --><script type="application/ld+json">{"@context":"https://schema.org","@graph":[{"@type":"LodgingBusiness","@id":"https://casa-daenzo.de/#lodging","name":"Casa da Enzo Boutique Apartments","url":"https://casa-daenzo.de","telephone":"+4915207483196","email":"booking@casa-daenzo.de","address":{"@type":"PostalAddress","streetAddress":"Bäckerstraße 18","addressLocality":"Goslar","postalCode":"38640","addressCountry":"DE"},"geo":{"@type":"GeoCoordinates","latitude":51.906,"longitude":10.428},"checkinTime":"15:00","checkoutTime":"11:00","numberOfRooms":7},{"@type":"Restaurant","@id":"https://casa-daenzo.de/#restaurant","name":"Trattoria da Enzo","url":"https://casa-daenzo.de/#trattoria","telephone":"+49532123456","servesCuisine":"Italian","address":{"@type":"PostalAddress","streetAddress":"Bäckerstraße 18","addressLocality":"Goslar","postalCode":"38640","addressCountry":"DE"}}]}</script><!-- Google Analytics (GA4) Snippet --><script async src="https://www.googletagmanager.com/gtag/js?id=G-CASADAENZO1"></script><script>(function(){const GA_MEASUREMENT_ID = "G-CASADAENZO1";
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', GA_MEASUREMENT_ID, {
anonymize_ip: true,
cookie_flags: 'SameSite=None;Secure'
});
})();</script><link rel="stylesheet" href="/_astro/_slug_.B_TTBYoh.css"><script type="module" src="/_astro/hoisted.jAcVTPu2.js"></script></head> <body class="bg-[#1A1816] text-[#E6D5C3] antialiased min-h-screen flex flex-col selection:bg-[#D4A373] selection:text-[#1A1816]"> <header class="sticky top-0 z-40 w-full bg-stone-900/95 backdrop-blur-md border-b border-stone-800 transition-all"> <!-- Top Utility Contact Bar --> <div class="bg-stone-950 border-b border-stone-800/80 py-1.5 px-4 text-[11px] sm:text-xs"> <div class="max-w-7xl mx-auto flex flex-wrap items-center justify-between gap-2 text-stone-400"> <!-- Dual Contacts --> <div class="flex flex-wrap items-center gap-4 sm:gap-6"> <!-- Apartments Phone --> <a href="https://wa.me/4915207483196" target="_blank" rel="noopener noreferrer" class="inline-flex items-center gap-1.5 text-emerald-400 hover:text-emerald-300 font-medium transition-colors" title="Apartment Anfragen & Concierge Alja"> <span class="w-2 h-2 rounded-full bg-emerald-500"></span> <span class="text-stone-300">Apartments (WhatsApp):</span> <span class="underline font-semibold">+49 1520 7483196</span> </a> <!-- Trattoria Phone --> <a href="tel:+4915207483196" class="inline-flex items-center gap-1.5 text-[#C85A32] hover:text-[#e2724a] font-medium transition-colors" title="Trattoria Tischreservierung"> <span class="w-2 h-2 rounded-full bg-[#C85A32]"></span> <span class="text-stone-300">Trattoria:</span> <span class="underline font-semibold">+49 1520 7483196</span> </a> </div> <!-- Right Utility Links: Eviivo & Language Switch --> <div class="flex items-center gap-4"> <a href="https://guest.eviivo.com/casa-daenzo" target="_blank" rel="noopener noreferrer" class="inline-flex items-center gap-1 text-amber-400 hover:text-white transition-colors font-medium cursor-pointer" title="Digital Guest Directory"> <span>📖</span> <span class="underline">Eviivo Guest Directory</span> </a> <div class="flex items-center bg-stone-900 border border-stone-800 rounded-full px-2 py-0.5 text-[11px] font-bold"> <span class="px-1.5 py-0.5 rounded-full bg-amber-500 text-stone-950">DE</span> </div> </div> </div> </div> <!-- Main Navigation Bar --> <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 h-20 flex items-center justify-between"> <!-- Brand Logo --> <a href="/" class="flex items-center gap-3 group"> <div class="w-11 h-11 rounded-2xl bg-gradient-to-br from-[#2D5A43] via-[#D4A373] to-[#C85A32] p-0.5 shadow-lg group-hover:scale-105 transition-transform"> <div class="w-full h-full bg-stone-950 rounded-[14px] flex items-center justify-center font-serif text-xl font-bold text-amber-400">
E
</div> </div> <div class="flex flex-col"> <span class="font-serif text-xl tracking-wide font-bold text-white group-hover:text-amber-400 transition-colors">
Casa da Enzo
</span> <div class="flex items-center gap-1.5 text-[10px] tracking-widest uppercase font-sans -mt-0.5"> <span class="text-emerald-400 font-semibold">Apartments</span> <span class="text-stone-400">•</span> <span class="text-[#C85A32] font-semibold">Trattoria</span> </div> </div> </a> <!-- Desktop Navigation --> <nav class="hidden md:flex items-center gap-6 lg:gap-8 text-sm font-medium"> <a href="/apartments" class="text-stone-200 hover:text-emerald-400 transition-colors flex items-center gap-1.5"> <span class="w-1.5 h-1.5 rounded-full bg-emerald-500"></span> <span>Apartments & Suiten</span> </a> <a href="/trattoria" class="text-stone-200 hover:text-[#C85A32] transition-colors flex items-center gap-1.5"> <span class="w-1.5 h-1.5 rounded-full bg-[#C85A32]"></span> <span>Trattoria da Enzo</span> </a> <a href="/blog" class="text-stone-200 hover:text-amber-400 transition-colors">
Blog & Magazin
</a> <a href="/#geschichte" class="text-stone-200 hover:text-amber-400 transition-colors">
Unsere Geschichte
</a> <a href="/#faq" class="text-stone-200 hover:text-amber-400 transition-colors">
FAQ
</a> </nav> <!-- CTAs --> <div class="flex items-center gap-3"> <a href="/apartments#booking" class="hidden sm:inline-flex items-center gap-2 px-5 py-2.5 rounded-full bg-[#C85A32] text-white font-medium text-xs lg:text-sm hover:bg-[#b04d2a] shadow-md transition-all hover:scale-105"> <span>Direkt buchen (Bestpreis)</span> </a> <!-- Mobile Menu Button --> <button id="mobile-menu-btn" class="md:hidden p-2 text-stone-200 hover:text-amber-400 rounded-xl bg-stone-800 border border-stone-700" aria-label="Menü öffnen"> <svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16"></path> </svg> </button> </div> </div> <!-- Mobile Navigation Dropdown --> <div id="mobile-menu" class="hidden md:hidden bg-stone-950 border-b border-stone-800 px-4 py-6 space-y-4"> <a href="/apartments" class="block py-2 text-stone-200 font-medium hover:text-emerald-400 flex items-center gap-2"> <span class="w-2 h-2 rounded-full bg-emerald-500"></span> <span>Apartments & Suiten</span> </a> <a href="/trattoria" class="block py-2 text-stone-200 font-medium hover:text-[#C85A32] flex items-center gap-2"> <span class="w-2 h-2 rounded-full bg-[#C85A32]"></span> <span>Trattoria da Enzo</span> </a> <a href="/blog" class="block py-2 text-stone-200 font-medium hover:text-amber-400">
Blog & Magazin
</a> <a href="/#geschichte" class="block py-2 text-stone-200 font-medium hover:text-amber-400">
Unsere Geschichte
</a> <a href="/#faq" class="block py-2 text-stone-200 font-medium hover:text-amber-400">
FAQ
</a> <div class="pt-2 border-t border-stone-800 space-y-2"> <a href="https://wa.me/4915207483196" target="_blank" class="block py-1.5 text-xs text-emerald-400 font-semibold">
💬 Apartments WhatsApp: +49 1520 7483196
</a> <a href="https://guest.eviivo.com/casa-daenzo" target="_blank" class="block py-1.5 text-xs text-amber-400 font-semibold">
📖 Eviivo Guest Directory
</a> </div> <a href="/apartments#booking" class="block text-center py-3 rounded-2xl bg-[#C85A32] text-white font-bold text-sm">
Jetzt Direkt buchen
</a> </div> </header> <main class="flex-1"> <div class="py-12 bg-[#1A1816]"> <div class="max-w-5xl mx-auto px-4 sm:px-6 lg:px-8 space-y-8"> <!-- Back Link & Top Badges Bar --> <div class="flex flex-col sm:flex-row sm:items-center justify-between gap-4"> <a href="/#apartments" class="inline-flex items-center gap-2 text-xs font-bold text-emerald-400 hover:underline">
← Zurück zu allen Apartments
</a> <!-- Airbnb & Booking Badges + Eviivo Guest Directory --> <div class="flex flex-wrap items-center gap-3 text-xs font-medium"> <span class="px-3 py-1 rounded-full bg-[#24211D] border border-[#D4A373]/20 text-[#E6D5C3]">
★ <strong class="text-[#D4A373]">4.98</strong> Superhost
</span> <span class="px-3 py-1 rounded-full bg-[#24211D] border border-[#D4A373]/20 text-[#E6D5C3]">
Booking.com <strong class="text-blue-400">9.8</strong> </span> <button onclick="document.getElementById('eviivo-link-btn')?.click()" class="px-3 py-1 rounded-full bg-[#2D5A43]/30 border border-emerald-500/40 text-emerald-400 hover:bg-[#2D5A43]/50 transition-colors flex items-center gap-1 font-semibold"> <span>📖 Eviivo Gästemappe</span> </button> </div> </div> <!-- Title & Header --> <div class="space-y-3"> <span class="inline-block px-3 py-1 rounded-full text-xs font-bold uppercase tracking-wider bg-[#2D5A43] text-emerald-100 border border-emerald-500/40"> Premium-Komfort </span> <h1 class="font-serif text-4xl sm:text-5xl font-bold text-[#E6D5C3]">Komfort-Suite 2 mit Terrasse</h1> <p class="text-[#A3978B] text-base sm:text-lg leading-relaxed">Großzügige 62m² Suite mit privatem Innenhof-Balkon und ruhiger Lage</p> </div> <!-- Quick Specs Bar --> <div class="grid grid-cols-2 sm:grid-cols-4 gap-4 p-6 rounded-3xl stone-card border border-[#D4A373]/20 text-center"> <div> <span class="block text-[10px] uppercase tracking-wider text-[#D4A373] font-bold">Kapazität</span> <span class="font-serif text-lg font-bold text-[#E6D5C3] mt-1 block">👥 Bis 4 Gäste</span> </div> <div> <span class="block text-[10px] uppercase tracking-wider text-[#D4A373] font-bold">Größe</span> <span class="font-serif text-lg font-bold text-[#E6D5C3] mt-1 block">📐 62 m²</span> </div> <div> <span class="block text-[10px] uppercase tracking-wider text-[#D4A373] font-bold">Aussicht</span> <span class="font-serif text-lg font-bold text-[#E6D5C3] mt-1 block">🌿 Balkon / Terrasse</span> </div> <div> <span class="block text-[10px] uppercase tracking-wider text-[#D4A373] font-bold">Workspace</span> <span class="font-serif text-lg font-bold text-[#E6D5C3] mt-1 block">💻 Workstation</span> </div> </div> <!-- Visual Gallery Placeholder Banner --> <div class="aspect-[21/9] rounded-3xl bg-gradient-to-br from-[#2E2A25] to-[#1A1816] text-[#E6D5C3] flex flex-col items-center justify-center p-6 text-center border border-[#D4A373]/20 relative overflow-hidden shadow-2xl"> <div class="relative z-10 space-y-2"> <span class="px-3.5 py-1 rounded-full bg-[#2D5A43]/30 text-emerald-400 text-xs font-bold uppercase tracking-widest border border-emerald-500/30">
Saniert 2025 • UNESCO Altstadt Goslar
</span> <h2 class="font-serif text-2xl sm:text-3xl font-bold">Komfort-Suite 2 mit Terrasse</h2> <p class="text-[#A3978B] text-xs sm:text-sm max-w-md mx-auto">
Restauriertes Fachwerk aus dem 16. Jahrhundert kombiniert mit italienischem Design & smartem Nuki Keyless Check-in.
</p> </div> </div> <!-- Highlights & Details --> <div class="grid grid-cols-1 md:grid-cols-3 gap-8 pt-4"> <div class="md:col-span-2 space-y-6 stone-card p-8 rounded-3xl border border-[#D4A373]/20"> <h2 class="font-serif text-2xl font-bold text-[#E6D5C3]">Beschreibung & Ausstattung</h2> <div class="prose prose-invert max-w-none text-[#E6D5C3] text-sm leading-relaxed"> <p>Perfekt für Familien oder Paare, die maximale Ruhe schätzen. Die Suite 2 bietet eine geschützte Terrasse zum Innenhof, ein separates Schlafzimmer mit hochwertigem Boxspringbett und einen großzügigen Wohnbereich.</p> </div> <div class="pt-6 border-t border-[#D4A373]/15"> <h3 class="font-serif text-lg font-bold text-[#D4A373] mb-2">Küche & Verpflegung</h3> <p class="text-[#A3978B] text-xs leading-relaxed">Große Bosch-Küche mit Induktion &amp; Geschirrspüler</p> </div> <div class="pt-4 border-t border-[#D4A373]/15 flex flex-wrap items-center justify-between gap-4 text-xs text-[#A3978B]"> <span>🔑 Nuki Smart Lock PIN Check-in ab 15:00 Uhr</span> <span>🌿 Nachhaltige Lehmdämmung für gesunden Schlaf</span> </div> </div> <!-- Sidebar / Highlights --> <div class="space-y-6"> <div class="stone-card p-6 rounded-3xl space-y-4 border border-[#D4A373]/30 shadow-xl"> <h3 class="font-serif text-xl font-bold text-[#D4A373]">Ausstattungs-Highlights</h3> <ul class="space-y-3 text-xs text-[#E6D5C3]"> <li class="flex items-start gap-3"> <span class="text-emerald-400 font-bold">✓</span> <span>Ruhiger Balkon/Terrasse zum geschützten Innenhof</span> </li><li class="flex items-start gap-3"> <span class="text-emerald-400 font-bold">✓</span> <span>Separates Schlafzimmer mit Boxspringbett</span> </li><li class="flex items-start gap-3"> <span class="text-emerald-400 font-bold">✓</span> <span>Kontaktloser 24/7 Check-in via Nuki Code</span> </li><li class="flex items-start gap-3"> <span class="text-emerald-400 font-bold">✓</span> <span>Nachhaltige Materialien &amp; gesundes Raumklima</span> </li> </ul> </div> <!-- Trattoria Info Card --> <div class="stone-card border border-[#C85A32]/40 p-6 rounded-3xl space-y-3"> <span class="text-xs font-bold uppercase tracking-wider text-[#C85A32]">Hauseigene Gastronomie</span> <h4 class="font-serif text-lg font-bold text-[#E6D5C3]">Trattoria da Enzo im Erdgeschoss</h4> <p class="text-xs text-[#A3978B] leading-relaxed">
Als Hotelgast genießt du eine bevorzugte Tischreservierung bei Alessandra. Genieße hausgemachte Pasta und sizilianische Weine direkt im Haus!
</p> <a href="tel:+49532123456" class="inline-block text-xs font-bold text-[#C85A32] hover:underline">
📞 Tisch reservieren: +49 5321 23456 →
</a> </div> </div> </div> <!-- Eviivo Booking Widget --> <section id="booking" class="pt-6"> <div class="stone-card rounded-3xl p-6 sm:p-10 max-w-4xl mx-auto my-8 font-sans border border-[#D4A373]/30 shadow-2xl"> <div class="text-center mb-8 space-y-2"> <div class="inline-flex items-center gap-2 px-3.5 py-1 rounded-full bg-[#2D5A43]/20 border border-emerald-500/40 text-emerald-400 text-xs font-bold uppercase tracking-wider"> <span>🔒 Direktbucher Bestpreis-Garantie</span> </div> <h3 class="font-serif text-2xl sm:text-3xl font-bold text-[#E6D5C3]">
Verfügbarkeit & Bestpreis prüfen
</h3> <p class="text-[#A3978B] text-xs sm:text-sm max-w-xl mx-auto">
Buche direkt über unsere Eviivo-Schnittstelle – 15% günstiger als auf Booking.com oder Airbnb. Bestpreis garantiert!
</p> </div> <!-- Booking Mask Interface --> <form action="https://onlinereservation.eviivo.com" method="GET" target="_blank" class="grid grid-cols-1 sm:grid-cols-3 gap-4"> <div class="space-y-1"> <label class="text-xs font-semibold text-[#D4A373] uppercase tracking-wider">Anreise</label> <input type="date" name="startDate" class="w-full px-4 py-3 rounded-xl bg-[#1A1816] border border-[#D4A373]/30 text-[#E6D5C3] text-xs focus:border-[#D4A373] focus:outline-none" required> </div> <div class="space-y-1"> <label class="text-xs font-semibold text-[#D4A373] uppercase tracking-wider">Abreise</label> <input type="date" name="endDate" class="w-full px-4 py-3 rounded-xl bg-[#1A1816] border border-[#D4A373]/30 text-[#E6D5C3] text-xs focus:border-[#D4A373] focus:outline-none" required> </div> <div class="space-y-1"> <label class="text-xs font-semibold text-[#D4A373] uppercase tracking-wider">Gäste</label> <select name="adults" class="w-full px-4 py-3 rounded-xl bg-[#1A1816] border border-[#D4A373]/30 text-[#E6D5C3] text-xs focus:border-[#D4A373] focus:outline-none"> <option value="1">1 Person</option> <option value="2" selected>2 Personen</option> <option value="3">3 Personen</option> <option value="4">4 Personen</option> </select> </div> <div class="sm:col-span-3 pt-2"> <button type="submit" class="w-full py-4 rounded-xl bg-gradient-to-r from-[#2D5A43] to-[#C85A32] text-white font-bold text-sm hover:opacity-95 shadow-xl transition-all">
Jetzt Verfügbarkeit & Bestpreis abrufen ➔
</button> </div> </form> <div class="mt-6 text-center text-[11px] text-[#A3978B] flex flex-wrap items-center justify-center gap-4 border-t border-[#D4A373]/10 pt-4"> <span>🔒 Sichere SSL-Schnittstelle</span> <span>•</span> <span>💳 Keine versteckten Gebühren</span> <span>•</span> <span>⚡ Sofortige Reservierungsbestätigung</span> </div> </div> </section> </div> </div> </main> <footer class="bg-stone-950 text-stone-400 pt-16 pb-12 border-t border-stone-800 font-sans"> <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8"> <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-12 mb-12"> <!-- Col 1: Brand & Heritage --> <div class="space-y-4"> <div class="flex items-center gap-3"> <div class="w-10 h-10 rounded-xl bg-gradient-to-br from-[#2D5A43] via-[#D4A373] to-[#C85A32] p-0.5"> <div class="w-full h-full bg-stone-950 rounded-[10px] flex items-center justify-center font-serif text-lg font-bold text-amber-400">
E
</div> </div> <div> <h3 class="font-serif text-xl font-bold text-stone-100">Casa da Enzo</h3> <p class="text-[10px] uppercase tracking-widest text-amber-400">Sizilien trifft Goslar • Seit 1980</p> </div> </div> <p class="text-xs leading-relaxed text-stone-400">
7 individuelle Boutique-Apartments über unserer traditionsreichen Trattoria im UNESCO-Weltkulturerbe Goslar. 100% digitaler Check-in trifft auf authentische italienische Gastfreundschaft.
</p> <p class="text-xs text-amber-400 font-medium">
📍 Bäckerstraße 18 • 38640 Goslar, Harz
</p> </div> <!-- Col 2: Navigation --> <div class="space-y-3"> <h4 class="font-serif text-base font-semibold text-stone-100 border-b border-stone-800 pb-2">Navigation</h4> <ul class="space-y-2 text-xs"> <li> <a href="/apartments" class="hover:text-emerald-400 transition-colors flex items-center gap-2"> <span class="w-1.5 h-1.5 rounded-full bg-emerald-500"></span> <span>Apartments & Suiten (7 Einheiten)</span> </a> </li> <li> <a href="/trattoria" class="hover:text-[#C85A32] transition-colors flex items-center gap-2"> <span class="w-1.5 h-1.5 rounded-full bg-[#C85A32]"></span> <span>Trattoria da Enzo (Speisekarte & Tisch)</span> </a> </li> <li> <a href="/trattoria#gutscheine" class="hover:text-amber-400 transition-colors flex items-center gap-2"> <span class="w-1.5 h-1.5 rounded-full bg-amber-400"></span> <span>Gutschein-Shop</span> </a> </li> <li> <a href="/blog" class="hover:text-amber-400 transition-colors">
Blog & Magazin
</a> </li> <li> <a href="/#geschichte" class="hover:text-amber-400 transition-colors">
Unsere Geschichte
</a> </li> </ul> </div> <!-- Col 3: Contacts --> <div class="space-y-3"> <h4 class="font-serif text-base font-semibold text-stone-100 border-b border-stone-800 pb-2">
Kontakt & Service
</h4> <div class="space-y-3 text-xs"> <!-- Apartments Contact --> <div class="p-3 rounded-xl bg-stone-900 border border-emerald-500/30 space-y-1"> <div class="text-[10px] uppercase font-bold text-emerald-400 flex items-center gap-1.5"> <span class="w-2 h-2 rounded-full bg-emerald-500"></span> <span>Apartments & Buchungen</span> </div> <a href="https://wa.me/4915207483196" target="_blank" class="block text-emerald-400 hover:underline font-bold">
WhatsApp: +49 1520 7483196
</a> <p class="text-[10px] text-stone-400">E-Mail: booking@casa-daenzo.de</p> </div> <!-- Trattoria Contact --> <div class="p-3 rounded-xl bg-stone-900 border border-[#C85A32]/30 space-y-1"> <div class="text-[10px] uppercase font-bold text-[#C85A32] flex items-center gap-1.5"> <span class="w-2 h-2 rounded-full bg-[#C85A32]"></span> <span>Trattoria Reservierung</span> </div> <a href="tel:+4915207483196" class="block text-[#C85A32] hover:underline font-bold">
Telefon: +49 1520 7483196
</a> <p class="text-[10px] text-stone-400">Öffnungszeiten: Di–So 17:00–22:30 Uhr</p> </div> </div> </div> <!-- Col 4: Direct Booking Advantages --> <div class="p-6 rounded-3xl bg-stone-900 border border-stone-800 space-y-4 shadow-xl"> <h4 class="font-serif text-base font-semibold text-amber-400">
Direktbucher-Vorteile
</h4> <ul class="space-y-2.5 text-xs text-stone-300"> <li class="flex items-start gap-2"> <span class="text-amber-400 font-bold">✓</span> <span>Bestpreis-Garantie (15% günstiger als Booking.com)</span> </li> <li class="flex items-start gap-2"> <span class="text-amber-400 font-bold">✓</span> <span>Bevorzugte Tischreservierung in der Trattoria</span> </li> <li class="flex items-start gap-2"> <span class="text-amber-400 font-bold">✓</span> <span>Kontaktloser Nuki Smart-Lock Check-in</span> </li> </ul> <a href="/apartments#booking" class="block text-center py-2.5 rounded-xl bg-[#C85A32] text-white font-bold text-xs hover:bg-[#b04d2a] transition-colors">
Verfügbarkeit prüfen
</a> </div> </div> <!-- Bottom line --> <div class="pt-8 border-t border-stone-900 flex flex-col sm:flex-row items-center justify-between text-xs text-stone-500 gap-4"> <p>© 2026 Casa da Enzo Goslar. Alle Rechte vorbehalten.</p> <div class="flex items-center gap-6"> <a href="https://guest.eviivo.com/casa-daenzo" target="_blank" class="hover:text-stone-300 transition-colors">Eviivo Guest Directory</a> </div> </div> </div> </footer> <div id="enzino-widget" class="fixed bottom-6 right-6 z-50 font-sans" data-lang="de"> <!-- Floating Launcher Button --> <button id="enzino-launcher" class="relative group flex items-center gap-3 bg-[#24211D] border border-[#D4A373]/30 hover:border-[#D4A373] text-[#E6D5C3] px-4 py-3 rounded-full shadow-2xl transition-all duration-300 hover:scale-105" aria-label="Enzino Concierge Chat öffnen"> <div class="relative w-10 h-10 rounded-full bg-gradient-to-br from-[#C85A32] to-[#D4A373] p-0.5 flex items-center justify-center shadow-inner"> <div class="w-full h-full rounded-full bg-[#1A1816] flex items-center justify-center text-lg font-serif font-bold text-[#D4A373]">
🇮🇹
</div> <span class="absolute -top-0.5 -right-0.5 w-3 h-3 bg-emerald-500 rounded-full border-2 border-[#1A1816] animate-pulse"></span> </div> <div class="text-left hidden sm:block"> <div class="text-xs font-serif font-bold text-[#D4A373] tracking-wide">Enzino Concierge</div> <div class="text-[10px] text-[#A3978B]">Online • Frag mich was!</div> </div> </button> <!-- Chat Dialog Window --> <div id="enzino-chat-window" class="hidden fixed bottom-6 right-6 w-[calc(100vw-3rem)] sm:w-[380px] max-h-[580px] h-[85vh] bg-[#24211D] border border-[#D4A373]/30 rounded-3xl shadow-2xl flex-col overflow-hidden transition-all duration-300 z-50"> <!-- Header --> <div class="bg-[#1A1816] border-b border-[#D4A373]/20 p-4 flex items-center justify-between"> <div class="flex items-center gap-3"> <div class="relative w-10 h-10 rounded-full bg-gradient-to-br from-[#C85A32] to-[#D4A373] p-0.5 flex items-center justify-center"> <div class="w-full h-full rounded-full bg-[#24211D] flex items-center justify-center text-lg">
👨‍🍳
</div> <span class="absolute bottom-0 right-0 w-2.5 h-2.5 bg-emerald-500 rounded-full border border-[#1A1816]"></span> </div> <div> <h3 class="font-serif text-sm font-bold text-[#E6D5C3]">Enzino da Enzo</h3> <p class="text-[10px] text-[#D4A373]">Digitaler Host & Concierge</p> </div> </div> <div class="flex items-center gap-2"> <!-- Session Disable Button --> <button id="enzino-disable-btn" title="Enzino für diese Session deaktivieren" class="p-1.5 text-[#A3978B] hover:text-amber-400 rounded-lg hover:bg-[#2A2622] text-xs transition-colors">
🚫
</button> <!-- Close Button --> <button id="enzino-close-btn" class="p-1.5 text-[#A3978B] hover:text-white rounded-lg hover:bg-[#2A2622] transition-colors" aria-label="Chat schließen">
✕
</button> </div> </div> <!-- Messages Body --> <div id="enzino-messages" class="flex-1 p-4 overflow-y-auto space-y-3.5 text-xs text-[#E6D5C3]"> <!-- Initial Bot Message --> <div class="flex gap-2.5 items-start"> <div class="w-7 h-7 rounded-full bg-[#C85A32]/20 border border-[#C85A32]/40 flex items-center justify-center text-xs shrink-0">
🇮🇹
</div> <div class="bg-[#2E2A25] border border-[#D4A373]/15 p-3 rounded-2xl rounded-tl-none max-w-[85%] leading-relaxed shadow-sm"> Ciao! I&#39;m Enzino, dein italienischer Digital Concierge 🇮🇹 Wie kann ich dir heute helfen? Frag mich nach unseren Apartments, der Trattoria oder dem digitalen Check-in! </div> </div> <!-- Quick Chips --> <div id="enzino-chips" class="flex flex-wrap gap-1.5 pt-2 pl-9"> <button class="enzino-chip text-[11px] bg-[#1A1816] hover:bg-[#C85A32]/20 text-[#D4A373] border border-[#D4A373]/30 hover:border-[#D4A373] px-3 py-1.5 rounded-full transition-all text-left" data-question="Wie funktioniert der Check-in?"> Wie funktioniert der Check-in? </button><button class="enzino-chip text-[11px] bg-[#1A1816] hover:bg-[#C85A32]/20 text-[#D4A373] border border-[#D4A373]/30 hover:border-[#D4A373] px-3 py-1.5 rounded-full transition-all text-left" data-question="Tisch in der Trattoria reservieren"> Tisch in der Trattoria reservieren </button><button class="enzino-chip text-[11px] bg-[#1A1816] hover:bg-[#C85A32]/20 text-[#D4A373] border border-[#D4A373]/30 hover:border-[#D4A373] px-3 py-1.5 rounded-full transition-all text-left" data-question="Direktbucher Bestpreis"> Direktbucher Bestpreis </button><button class="enzino-chip text-[11px] bg-[#1A1816] hover:bg-[#C85A32]/20 text-[#D4A373] border border-[#D4A373]/30 hover:border-[#D4A373] px-3 py-1.5 rounded-full transition-all text-left" data-question="Digitales Gästebuch (Eviivo)"> Digitales Gästebuch (Eviivo) </button> </div> </div> <!-- Typing Indicator (hidden by default) --> <div id="enzino-typing" class="hidden px-4 py-2 text-[11px] text-[#D4A373] italic flex items-center gap-2 bg-[#1A1816]/50"> <span class="w-2 h-2 bg-[#D4A373] rounded-full animate-ping"></span> <span>Enzino tippt...</span> </div> <!-- Input Footer --> <form id="enzino-form" class="bg-[#1A1816] border-t border-[#D4A373]/20 p-3 flex gap-2"> <input type="text" id="enzino-input" placeholder="Stelle Enzino eine Frage..." class="flex-1 bg-[#24211D] border border-[#D4A373]/20 focus:border-[#D4A373] text-[#E6D5C3] placeholder-[#A3978B] text-xs rounded-xl px-3 py-2.5 outline-none transition-all" autocomplete="off"> <button type="submit" class="bg-[#C85A32] hover:bg-[#b04d2a] text-white px-3.5 py-2.5 rounded-xl text-xs font-bold transition-all shrink-0">
➔
</button> </form> </div> </div> </body></html>
+83
View File
@@ -0,0 +1,83 @@
<!DOCTYPE html><html lang="de" class="scroll-smooth bg-[#1A1816] text-[#E6D5C3]"> <head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><link rel="icon" type="image/svg+xml" href="/favicon.svg"><meta name="generator" content="Astro v4.16.19"><!-- SEO Meta Tags --><title>Komfort-Suite 3 Design | Casa da Enzo Goslar</title><meta name="description" content="Elegante Altstadt-Suite mit sichtbaren Balken und edler Einrichtung"><meta name="robots" content="index, follow"><!-- Open Graph / Facebook / WhatsApp --><meta property="og:type" content="website"><meta property="og:url" content="https://casa-daenzo.de/apartments/suite-3-komfort/"><meta property="og:title" content="Komfort-Suite 3 Design | Casa da Enzo Goslar"><meta property="og:description" content="Elegante Altstadt-Suite mit sichtbaren Balken und edler Einrichtung"><meta property="og:image" content="https://casa-daenzo.de/og-image.jpg"><!-- Twitter --><meta property="twitter:card" content="summary_large_image"><meta property="twitter:title" content="Komfort-Suite 3 Design | Casa da Enzo Goslar"><meta property="twitter:description" content="Elegante Altstadt-Suite mit sichtbaren Balken und edler Einrichtung"><meta property="twitter:image" content="https://casa-daenzo.de/og-image.jpg"><!-- Schema.org JSON-LD --><script type="application/ld+json">{"@context":"https://schema.org","@graph":[{"@type":"LodgingBusiness","@id":"https://casa-daenzo.de/#lodging","name":"Casa da Enzo Boutique Apartments","url":"https://casa-daenzo.de","telephone":"+4915207483196","email":"booking@casa-daenzo.de","address":{"@type":"PostalAddress","streetAddress":"Bäckerstraße 18","addressLocality":"Goslar","postalCode":"38640","addressCountry":"DE"},"geo":{"@type":"GeoCoordinates","latitude":51.906,"longitude":10.428},"checkinTime":"15:00","checkoutTime":"11:00","numberOfRooms":7},{"@type":"Restaurant","@id":"https://casa-daenzo.de/#restaurant","name":"Trattoria da Enzo","url":"https://casa-daenzo.de/#trattoria","telephone":"+49532123456","servesCuisine":"Italian","address":{"@type":"PostalAddress","streetAddress":"Bäckerstraße 18","addressLocality":"Goslar","postalCode":"38640","addressCountry":"DE"}}]}</script><!-- Google Analytics (GA4) Snippet --><script async src="https://www.googletagmanager.com/gtag/js?id=G-CASADAENZO1"></script><script>(function(){const GA_MEASUREMENT_ID = "G-CASADAENZO1";
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', GA_MEASUREMENT_ID, {
anonymize_ip: true,
cookie_flags: 'SameSite=None;Secure'
});
})();</script><link rel="stylesheet" href="/_astro/_slug_.B_TTBYoh.css"><script type="module" src="/_astro/hoisted.jAcVTPu2.js"></script></head> <body class="bg-[#1A1816] text-[#E6D5C3] antialiased min-h-screen flex flex-col selection:bg-[#D4A373] selection:text-[#1A1816]"> <header class="sticky top-0 z-40 w-full bg-stone-900/95 backdrop-blur-md border-b border-stone-800 transition-all"> <!-- Top Utility Contact Bar --> <div class="bg-stone-950 border-b border-stone-800/80 py-1.5 px-4 text-[11px] sm:text-xs"> <div class="max-w-7xl mx-auto flex flex-wrap items-center justify-between gap-2 text-stone-400"> <!-- Dual Contacts --> <div class="flex flex-wrap items-center gap-4 sm:gap-6"> <!-- Apartments Phone --> <a href="https://wa.me/4915207483196" target="_blank" rel="noopener noreferrer" class="inline-flex items-center gap-1.5 text-emerald-400 hover:text-emerald-300 font-medium transition-colors" title="Apartment Anfragen & Concierge Alja"> <span class="w-2 h-2 rounded-full bg-emerald-500"></span> <span class="text-stone-300">Apartments (WhatsApp):</span> <span class="underline font-semibold">+49 1520 7483196</span> </a> <!-- Trattoria Phone --> <a href="tel:+4915207483196" class="inline-flex items-center gap-1.5 text-[#C85A32] hover:text-[#e2724a] font-medium transition-colors" title="Trattoria Tischreservierung"> <span class="w-2 h-2 rounded-full bg-[#C85A32]"></span> <span class="text-stone-300">Trattoria:</span> <span class="underline font-semibold">+49 1520 7483196</span> </a> </div> <!-- Right Utility Links: Eviivo & Language Switch --> <div class="flex items-center gap-4"> <a href="https://guest.eviivo.com/casa-daenzo" target="_blank" rel="noopener noreferrer" class="inline-flex items-center gap-1 text-amber-400 hover:text-white transition-colors font-medium cursor-pointer" title="Digital Guest Directory"> <span>📖</span> <span class="underline">Eviivo Guest Directory</span> </a> <div class="flex items-center bg-stone-900 border border-stone-800 rounded-full px-2 py-0.5 text-[11px] font-bold"> <span class="px-1.5 py-0.5 rounded-full bg-amber-500 text-stone-950">DE</span> </div> </div> </div> </div> <!-- Main Navigation Bar --> <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 h-20 flex items-center justify-between"> <!-- Brand Logo --> <a href="/" class="flex items-center gap-3 group"> <div class="w-11 h-11 rounded-2xl bg-gradient-to-br from-[#2D5A43] via-[#D4A373] to-[#C85A32] p-0.5 shadow-lg group-hover:scale-105 transition-transform"> <div class="w-full h-full bg-stone-950 rounded-[14px] flex items-center justify-center font-serif text-xl font-bold text-amber-400">
E
</div> </div> <div class="flex flex-col"> <span class="font-serif text-xl tracking-wide font-bold text-white group-hover:text-amber-400 transition-colors">
Casa da Enzo
</span> <div class="flex items-center gap-1.5 text-[10px] tracking-widest uppercase font-sans -mt-0.5"> <span class="text-emerald-400 font-semibold">Apartments</span> <span class="text-stone-400">•</span> <span class="text-[#C85A32] font-semibold">Trattoria</span> </div> </div> </a> <!-- Desktop Navigation --> <nav class="hidden md:flex items-center gap-6 lg:gap-8 text-sm font-medium"> <a href="/apartments" class="text-stone-200 hover:text-emerald-400 transition-colors flex items-center gap-1.5"> <span class="w-1.5 h-1.5 rounded-full bg-emerald-500"></span> <span>Apartments & Suiten</span> </a> <a href="/trattoria" class="text-stone-200 hover:text-[#C85A32] transition-colors flex items-center gap-1.5"> <span class="w-1.5 h-1.5 rounded-full bg-[#C85A32]"></span> <span>Trattoria da Enzo</span> </a> <a href="/blog" class="text-stone-200 hover:text-amber-400 transition-colors">
Blog & Magazin
</a> <a href="/#geschichte" class="text-stone-200 hover:text-amber-400 transition-colors">
Unsere Geschichte
</a> <a href="/#faq" class="text-stone-200 hover:text-amber-400 transition-colors">
FAQ
</a> </nav> <!-- CTAs --> <div class="flex items-center gap-3"> <a href="/apartments#booking" class="hidden sm:inline-flex items-center gap-2 px-5 py-2.5 rounded-full bg-[#C85A32] text-white font-medium text-xs lg:text-sm hover:bg-[#b04d2a] shadow-md transition-all hover:scale-105"> <span>Direkt buchen (Bestpreis)</span> </a> <!-- Mobile Menu Button --> <button id="mobile-menu-btn" class="md:hidden p-2 text-stone-200 hover:text-amber-400 rounded-xl bg-stone-800 border border-stone-700" aria-label="Menü öffnen"> <svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16"></path> </svg> </button> </div> </div> <!-- Mobile Navigation Dropdown --> <div id="mobile-menu" class="hidden md:hidden bg-stone-950 border-b border-stone-800 px-4 py-6 space-y-4"> <a href="/apartments" class="block py-2 text-stone-200 font-medium hover:text-emerald-400 flex items-center gap-2"> <span class="w-2 h-2 rounded-full bg-emerald-500"></span> <span>Apartments & Suiten</span> </a> <a href="/trattoria" class="block py-2 text-stone-200 font-medium hover:text-[#C85A32] flex items-center gap-2"> <span class="w-2 h-2 rounded-full bg-[#C85A32]"></span> <span>Trattoria da Enzo</span> </a> <a href="/blog" class="block py-2 text-stone-200 font-medium hover:text-amber-400">
Blog & Magazin
</a> <a href="/#geschichte" class="block py-2 text-stone-200 font-medium hover:text-amber-400">
Unsere Geschichte
</a> <a href="/#faq" class="block py-2 text-stone-200 font-medium hover:text-amber-400">
FAQ
</a> <div class="pt-2 border-t border-stone-800 space-y-2"> <a href="https://wa.me/4915207483196" target="_blank" class="block py-1.5 text-xs text-emerald-400 font-semibold">
💬 Apartments WhatsApp: +49 1520 7483196
</a> <a href="https://guest.eviivo.com/casa-daenzo" target="_blank" class="block py-1.5 text-xs text-amber-400 font-semibold">
📖 Eviivo Guest Directory
</a> </div> <a href="/apartments#booking" class="block text-center py-3 rounded-2xl bg-[#C85A32] text-white font-bold text-sm">
Jetzt Direkt buchen
</a> </div> </header> <main class="flex-1"> <div class="py-12 bg-[#1A1816]"> <div class="max-w-5xl mx-auto px-4 sm:px-6 lg:px-8 space-y-8"> <!-- Back Link & Top Badges Bar --> <div class="flex flex-col sm:flex-row sm:items-center justify-between gap-4"> <a href="/#apartments" class="inline-flex items-center gap-2 text-xs font-bold text-emerald-400 hover:underline">
← Zurück zu allen Apartments
</a> <!-- Airbnb & Booking Badges + Eviivo Guest Directory --> <div class="flex flex-wrap items-center gap-3 text-xs font-medium"> <span class="px-3 py-1 rounded-full bg-[#24211D] border border-[#D4A373]/20 text-[#E6D5C3]">
★ <strong class="text-[#D4A373]">4.98</strong> Superhost
</span> <span class="px-3 py-1 rounded-full bg-[#24211D] border border-[#D4A373]/20 text-[#E6D5C3]">
Booking.com <strong class="text-blue-400">9.8</strong> </span> <button onclick="document.getElementById('eviivo-link-btn')?.click()" class="px-3 py-1 rounded-full bg-[#2D5A43]/30 border border-emerald-500/40 text-emerald-400 hover:bg-[#2D5A43]/50 transition-colors flex items-center gap-1 font-semibold"> <span>📖 Eviivo Gästemappe</span> </button> </div> </div> <!-- Title & Header --> <div class="space-y-3"> <span class="inline-block px-3 py-1 rounded-full text-xs font-bold uppercase tracking-wider bg-[#2D5A43] text-emerald-100 border border-emerald-500/40"> Premium-Komfort </span> <h1 class="font-serif text-4xl sm:text-5xl font-bold text-[#E6D5C3]">Komfort-Suite 3 Design</h1> <p class="text-[#A3978B] text-base sm:text-lg leading-relaxed">Elegante Altstadt-Suite mit sichtbaren Balken und edler Einrichtung</p> </div> <!-- Quick Specs Bar --> <div class="grid grid-cols-2 sm:grid-cols-4 gap-4 p-6 rounded-3xl stone-card border border-[#D4A373]/20 text-center"> <div> <span class="block text-[10px] uppercase tracking-wider text-[#D4A373] font-bold">Kapazität</span> <span class="font-serif text-lg font-bold text-[#E6D5C3] mt-1 block">👥 Bis 3 Gäste</span> </div> <div> <span class="block text-[10px] uppercase tracking-wider text-[#D4A373] font-bold">Größe</span> <span class="font-serif text-lg font-bold text-[#E6D5C3] mt-1 block">📐 52 m²</span> </div> <div> <span class="block text-[10px] uppercase tracking-wider text-[#D4A373] font-bold">Aussicht</span> <span class="font-serif text-lg font-bold text-[#E6D5C3] mt-1 block">Altstadtblick</span> </div> <div> <span class="block text-[10px] uppercase tracking-wider text-[#D4A373] font-bold">Workspace</span> <span class="font-serif text-lg font-bold text-[#E6D5C3] mt-1 block">💻 Workstation</span> </div> </div> <!-- Visual Gallery Placeholder Banner --> <div class="aspect-[21/9] rounded-3xl bg-gradient-to-br from-[#2E2A25] to-[#1A1816] text-[#E6D5C3] flex flex-col items-center justify-center p-6 text-center border border-[#D4A373]/20 relative overflow-hidden shadow-2xl"> <div class="relative z-10 space-y-2"> <span class="px-3.5 py-1 rounded-full bg-[#2D5A43]/30 text-emerald-400 text-xs font-bold uppercase tracking-widest border border-emerald-500/30">
Saniert 2025 • UNESCO Altstadt Goslar
</span> <h2 class="font-serif text-2xl sm:text-3xl font-bold">Komfort-Suite 3 Design</h2> <p class="text-[#A3978B] text-xs sm:text-sm max-w-md mx-auto">
Restauriertes Fachwerk aus dem 16. Jahrhundert kombiniert mit italienischem Design & smartem Nuki Keyless Check-in.
</p> </div> </div> <!-- Highlights & Details --> <div class="grid grid-cols-1 md:grid-cols-3 gap-8 pt-4"> <div class="md:col-span-2 space-y-6 stone-card p-8 rounded-3xl border border-[#D4A373]/20"> <h2 class="font-serif text-2xl font-bold text-[#E6D5C3]">Beschreibung & Ausstattung</h2> <div class="prose prose-invert max-w-none text-[#E6D5C3] text-sm leading-relaxed"> <p>Ein Refugium für Ästheten: Die Suite 3 vereint den rustikalen Charme der Goslarer Altstadt mit edler italienischer Möblierung und smarter Haustechnik.</p> </div> <div class="pt-6 border-t border-[#D4A373]/15"> <h3 class="font-serif text-lg font-bold text-[#D4A373] mb-2">Küche & Verpflegung</h3> <p class="text-[#A3978B] text-xs leading-relaxed">Moderne Bosch-Küche mit Nespresso-Maschine</p> </div> <div class="pt-4 border-t border-[#D4A373]/15 flex flex-wrap items-center justify-between gap-4 text-xs text-[#A3978B]"> <span>🔑 Nuki Smart Lock PIN Check-in ab 15:00 Uhr</span> <span>🌿 Nachhaltige Lehmdämmung für gesunden Schlaf</span> </div> </div> <!-- Sidebar / Highlights --> <div class="space-y-6"> <div class="stone-card p-6 rounded-3xl space-y-4 border border-[#D4A373]/30 shadow-xl"> <h3 class="font-serif text-xl font-bold text-[#D4A373]">Ausstattungs-Highlights</h3> <ul class="space-y-3 text-xs text-[#E6D5C3]"> <li class="flex items-start gap-3"> <span class="text-emerald-400 font-bold">✓</span> <span>Sichtbares historisches Fachwerkelement</span> </li><li class="flex items-start gap-3"> <span class="text-emerald-400 font-bold">✓</span> <span>Highspeed Wi-Fi 6 für Remote Work</span> </li><li class="flex items-start gap-3"> <span class="text-emerald-400 font-bold">✓</span> <span>Kontaktlose Anreise &amp; Nuki Smart Lock</span> </li><li class="flex items-start gap-3"> <span class="text-emerald-400 font-bold">✓</span> <span>Direkter Zugang zur Trattoria im Erdgeschoss</span> </li> </ul> </div> <!-- Trattoria Info Card --> <div class="stone-card border border-[#C85A32]/40 p-6 rounded-3xl space-y-3"> <span class="text-xs font-bold uppercase tracking-wider text-[#C85A32]">Hauseigene Gastronomie</span> <h4 class="font-serif text-lg font-bold text-[#E6D5C3]">Trattoria da Enzo im Erdgeschoss</h4> <p class="text-xs text-[#A3978B] leading-relaxed">
Als Hotelgast genießt du eine bevorzugte Tischreservierung bei Alessandra. Genieße hausgemachte Pasta und sizilianische Weine direkt im Haus!
</p> <a href="tel:+49532123456" class="inline-block text-xs font-bold text-[#C85A32] hover:underline">
📞 Tisch reservieren: +49 5321 23456 →
</a> </div> </div> </div> <!-- Eviivo Booking Widget --> <section id="booking" class="pt-6"> <div class="stone-card rounded-3xl p-6 sm:p-10 max-w-4xl mx-auto my-8 font-sans border border-[#D4A373]/30 shadow-2xl"> <div class="text-center mb-8 space-y-2"> <div class="inline-flex items-center gap-2 px-3.5 py-1 rounded-full bg-[#2D5A43]/20 border border-emerald-500/40 text-emerald-400 text-xs font-bold uppercase tracking-wider"> <span>🔒 Direktbucher Bestpreis-Garantie</span> </div> <h3 class="font-serif text-2xl sm:text-3xl font-bold text-[#E6D5C3]">
Verfügbarkeit & Bestpreis prüfen
</h3> <p class="text-[#A3978B] text-xs sm:text-sm max-w-xl mx-auto">
Buche direkt über unsere Eviivo-Schnittstelle – 15% günstiger als auf Booking.com oder Airbnb. Bestpreis garantiert!
</p> </div> <!-- Booking Mask Interface --> <form action="https://onlinereservation.eviivo.com" method="GET" target="_blank" class="grid grid-cols-1 sm:grid-cols-3 gap-4"> <div class="space-y-1"> <label class="text-xs font-semibold text-[#D4A373] uppercase tracking-wider">Anreise</label> <input type="date" name="startDate" class="w-full px-4 py-3 rounded-xl bg-[#1A1816] border border-[#D4A373]/30 text-[#E6D5C3] text-xs focus:border-[#D4A373] focus:outline-none" required> </div> <div class="space-y-1"> <label class="text-xs font-semibold text-[#D4A373] uppercase tracking-wider">Abreise</label> <input type="date" name="endDate" class="w-full px-4 py-3 rounded-xl bg-[#1A1816] border border-[#D4A373]/30 text-[#E6D5C3] text-xs focus:border-[#D4A373] focus:outline-none" required> </div> <div class="space-y-1"> <label class="text-xs font-semibold text-[#D4A373] uppercase tracking-wider">Gäste</label> <select name="adults" class="w-full px-4 py-3 rounded-xl bg-[#1A1816] border border-[#D4A373]/30 text-[#E6D5C3] text-xs focus:border-[#D4A373] focus:outline-none"> <option value="1">1 Person</option> <option value="2" selected>2 Personen</option> <option value="3">3 Personen</option> <option value="4">4 Personen</option> </select> </div> <div class="sm:col-span-3 pt-2"> <button type="submit" class="w-full py-4 rounded-xl bg-gradient-to-r from-[#2D5A43] to-[#C85A32] text-white font-bold text-sm hover:opacity-95 shadow-xl transition-all">
Jetzt Verfügbarkeit & Bestpreis abrufen ➔
</button> </div> </form> <div class="mt-6 text-center text-[11px] text-[#A3978B] flex flex-wrap items-center justify-center gap-4 border-t border-[#D4A373]/10 pt-4"> <span>🔒 Sichere SSL-Schnittstelle</span> <span>•</span> <span>💳 Keine versteckten Gebühren</span> <span>•</span> <span>⚡ Sofortige Reservierungsbestätigung</span> </div> </div> </section> </div> </div> </main> <footer class="bg-stone-950 text-stone-400 pt-16 pb-12 border-t border-stone-800 font-sans"> <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8"> <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-12 mb-12"> <!-- Col 1: Brand & Heritage --> <div class="space-y-4"> <div class="flex items-center gap-3"> <div class="w-10 h-10 rounded-xl bg-gradient-to-br from-[#2D5A43] via-[#D4A373] to-[#C85A32] p-0.5"> <div class="w-full h-full bg-stone-950 rounded-[10px] flex items-center justify-center font-serif text-lg font-bold text-amber-400">
E
</div> </div> <div> <h3 class="font-serif text-xl font-bold text-stone-100">Casa da Enzo</h3> <p class="text-[10px] uppercase tracking-widest text-amber-400">Sizilien trifft Goslar • Seit 1980</p> </div> </div> <p class="text-xs leading-relaxed text-stone-400">
7 individuelle Boutique-Apartments über unserer traditionsreichen Trattoria im UNESCO-Weltkulturerbe Goslar. 100% digitaler Check-in trifft auf authentische italienische Gastfreundschaft.
</p> <p class="text-xs text-amber-400 font-medium">
📍 Bäckerstraße 18 • 38640 Goslar, Harz
</p> </div> <!-- Col 2: Navigation --> <div class="space-y-3"> <h4 class="font-serif text-base font-semibold text-stone-100 border-b border-stone-800 pb-2">Navigation</h4> <ul class="space-y-2 text-xs"> <li> <a href="/apartments" class="hover:text-emerald-400 transition-colors flex items-center gap-2"> <span class="w-1.5 h-1.5 rounded-full bg-emerald-500"></span> <span>Apartments & Suiten (7 Einheiten)</span> </a> </li> <li> <a href="/trattoria" class="hover:text-[#C85A32] transition-colors flex items-center gap-2"> <span class="w-1.5 h-1.5 rounded-full bg-[#C85A32]"></span> <span>Trattoria da Enzo (Speisekarte & Tisch)</span> </a> </li> <li> <a href="/trattoria#gutscheine" class="hover:text-amber-400 transition-colors flex items-center gap-2"> <span class="w-1.5 h-1.5 rounded-full bg-amber-400"></span> <span>Gutschein-Shop</span> </a> </li> <li> <a href="/blog" class="hover:text-amber-400 transition-colors">
Blog & Magazin
</a> </li> <li> <a href="/#geschichte" class="hover:text-amber-400 transition-colors">
Unsere Geschichte
</a> </li> </ul> </div> <!-- Col 3: Contacts --> <div class="space-y-3"> <h4 class="font-serif text-base font-semibold text-stone-100 border-b border-stone-800 pb-2">
Kontakt & Service
</h4> <div class="space-y-3 text-xs"> <!-- Apartments Contact --> <div class="p-3 rounded-xl bg-stone-900 border border-emerald-500/30 space-y-1"> <div class="text-[10px] uppercase font-bold text-emerald-400 flex items-center gap-1.5"> <span class="w-2 h-2 rounded-full bg-emerald-500"></span> <span>Apartments & Buchungen</span> </div> <a href="https://wa.me/4915207483196" target="_blank" class="block text-emerald-400 hover:underline font-bold">
WhatsApp: +49 1520 7483196
</a> <p class="text-[10px] text-stone-400">E-Mail: booking@casa-daenzo.de</p> </div> <!-- Trattoria Contact --> <div class="p-3 rounded-xl bg-stone-900 border border-[#C85A32]/30 space-y-1"> <div class="text-[10px] uppercase font-bold text-[#C85A32] flex items-center gap-1.5"> <span class="w-2 h-2 rounded-full bg-[#C85A32]"></span> <span>Trattoria Reservierung</span> </div> <a href="tel:+4915207483196" class="block text-[#C85A32] hover:underline font-bold">
Telefon: +49 1520 7483196
</a> <p class="text-[10px] text-stone-400">Öffnungszeiten: Di–So 17:00–22:30 Uhr</p> </div> </div> </div> <!-- Col 4: Direct Booking Advantages --> <div class="p-6 rounded-3xl bg-stone-900 border border-stone-800 space-y-4 shadow-xl"> <h4 class="font-serif text-base font-semibold text-amber-400">
Direktbucher-Vorteile
</h4> <ul class="space-y-2.5 text-xs text-stone-300"> <li class="flex items-start gap-2"> <span class="text-amber-400 font-bold">✓</span> <span>Bestpreis-Garantie (15% günstiger als Booking.com)</span> </li> <li class="flex items-start gap-2"> <span class="text-amber-400 font-bold">✓</span> <span>Bevorzugte Tischreservierung in der Trattoria</span> </li> <li class="flex items-start gap-2"> <span class="text-amber-400 font-bold">✓</span> <span>Kontaktloser Nuki Smart-Lock Check-in</span> </li> </ul> <a href="/apartments#booking" class="block text-center py-2.5 rounded-xl bg-[#C85A32] text-white font-bold text-xs hover:bg-[#b04d2a] transition-colors">
Verfügbarkeit prüfen
</a> </div> </div> <!-- Bottom line --> <div class="pt-8 border-t border-stone-900 flex flex-col sm:flex-row items-center justify-between text-xs text-stone-500 gap-4"> <p>© 2026 Casa da Enzo Goslar. Alle Rechte vorbehalten.</p> <div class="flex items-center gap-6"> <a href="https://guest.eviivo.com/casa-daenzo" target="_blank" class="hover:text-stone-300 transition-colors">Eviivo Guest Directory</a> </div> </div> </div> </footer> <div id="enzino-widget" class="fixed bottom-6 right-6 z-50 font-sans" data-lang="de"> <!-- Floating Launcher Button --> <button id="enzino-launcher" class="relative group flex items-center gap-3 bg-[#24211D] border border-[#D4A373]/30 hover:border-[#D4A373] text-[#E6D5C3] px-4 py-3 rounded-full shadow-2xl transition-all duration-300 hover:scale-105" aria-label="Enzino Concierge Chat öffnen"> <div class="relative w-10 h-10 rounded-full bg-gradient-to-br from-[#C85A32] to-[#D4A373] p-0.5 flex items-center justify-center shadow-inner"> <div class="w-full h-full rounded-full bg-[#1A1816] flex items-center justify-center text-lg font-serif font-bold text-[#D4A373]">
🇮🇹
</div> <span class="absolute -top-0.5 -right-0.5 w-3 h-3 bg-emerald-500 rounded-full border-2 border-[#1A1816] animate-pulse"></span> </div> <div class="text-left hidden sm:block"> <div class="text-xs font-serif font-bold text-[#D4A373] tracking-wide">Enzino Concierge</div> <div class="text-[10px] text-[#A3978B]">Online • Frag mich was!</div> </div> </button> <!-- Chat Dialog Window --> <div id="enzino-chat-window" class="hidden fixed bottom-6 right-6 w-[calc(100vw-3rem)] sm:w-[380px] max-h-[580px] h-[85vh] bg-[#24211D] border border-[#D4A373]/30 rounded-3xl shadow-2xl flex-col overflow-hidden transition-all duration-300 z-50"> <!-- Header --> <div class="bg-[#1A1816] border-b border-[#D4A373]/20 p-4 flex items-center justify-between"> <div class="flex items-center gap-3"> <div class="relative w-10 h-10 rounded-full bg-gradient-to-br from-[#C85A32] to-[#D4A373] p-0.5 flex items-center justify-center"> <div class="w-full h-full rounded-full bg-[#24211D] flex items-center justify-center text-lg">
👨‍🍳
</div> <span class="absolute bottom-0 right-0 w-2.5 h-2.5 bg-emerald-500 rounded-full border border-[#1A1816]"></span> </div> <div> <h3 class="font-serif text-sm font-bold text-[#E6D5C3]">Enzino da Enzo</h3> <p class="text-[10px] text-[#D4A373]">Digitaler Host & Concierge</p> </div> </div> <div class="flex items-center gap-2"> <!-- Session Disable Button --> <button id="enzino-disable-btn" title="Enzino für diese Session deaktivieren" class="p-1.5 text-[#A3978B] hover:text-amber-400 rounded-lg hover:bg-[#2A2622] text-xs transition-colors">
🚫
</button> <!-- Close Button --> <button id="enzino-close-btn" class="p-1.5 text-[#A3978B] hover:text-white rounded-lg hover:bg-[#2A2622] transition-colors" aria-label="Chat schließen">
✕
</button> </div> </div> <!-- Messages Body --> <div id="enzino-messages" class="flex-1 p-4 overflow-y-auto space-y-3.5 text-xs text-[#E6D5C3]"> <!-- Initial Bot Message --> <div class="flex gap-2.5 items-start"> <div class="w-7 h-7 rounded-full bg-[#C85A32]/20 border border-[#C85A32]/40 flex items-center justify-center text-xs shrink-0">
🇮🇹
</div> <div class="bg-[#2E2A25] border border-[#D4A373]/15 p-3 rounded-2xl rounded-tl-none max-w-[85%] leading-relaxed shadow-sm"> Ciao! I&#39;m Enzino, dein italienischer Digital Concierge 🇮🇹 Wie kann ich dir heute helfen? Frag mich nach unseren Apartments, der Trattoria oder dem digitalen Check-in! </div> </div> <!-- Quick Chips --> <div id="enzino-chips" class="flex flex-wrap gap-1.5 pt-2 pl-9"> <button class="enzino-chip text-[11px] bg-[#1A1816] hover:bg-[#C85A32]/20 text-[#D4A373] border border-[#D4A373]/30 hover:border-[#D4A373] px-3 py-1.5 rounded-full transition-all text-left" data-question="Wie funktioniert der Check-in?"> Wie funktioniert der Check-in? </button><button class="enzino-chip text-[11px] bg-[#1A1816] hover:bg-[#C85A32]/20 text-[#D4A373] border border-[#D4A373]/30 hover:border-[#D4A373] px-3 py-1.5 rounded-full transition-all text-left" data-question="Tisch in der Trattoria reservieren"> Tisch in der Trattoria reservieren </button><button class="enzino-chip text-[11px] bg-[#1A1816] hover:bg-[#C85A32]/20 text-[#D4A373] border border-[#D4A373]/30 hover:border-[#D4A373] px-3 py-1.5 rounded-full transition-all text-left" data-question="Direktbucher Bestpreis"> Direktbucher Bestpreis </button><button class="enzino-chip text-[11px] bg-[#1A1816] hover:bg-[#C85A32]/20 text-[#D4A373] border border-[#D4A373]/30 hover:border-[#D4A373] px-3 py-1.5 rounded-full transition-all text-left" data-question="Digitales Gästebuch (Eviivo)"> Digitales Gästebuch (Eviivo) </button> </div> </div> <!-- Typing Indicator (hidden by default) --> <div id="enzino-typing" class="hidden px-4 py-2 text-[11px] text-[#D4A373] italic flex items-center gap-2 bg-[#1A1816]/50"> <span class="w-2 h-2 bg-[#D4A373] rounded-full animate-ping"></span> <span>Enzino tippt...</span> </div> <!-- Input Footer --> <form id="enzino-form" class="bg-[#1A1816] border-t border-[#D4A373]/20 p-3 flex gap-2"> <input type="text" id="enzino-input" placeholder="Stelle Enzino eine Frage..." class="flex-1 bg-[#24211D] border border-[#D4A373]/20 focus:border-[#D4A373] text-[#E6D5C3] placeholder-[#A3978B] text-xs rounded-xl px-3 py-2.5 outline-none transition-all" autocomplete="off"> <button type="submit" class="bg-[#C85A32] hover:bg-[#b04d2a] text-white px-3.5 py-2.5 rounded-xl text-xs font-bold transition-all shrink-0">
➔
</button> </form> </div> </div> </body></html>
+83
View File
@@ -0,0 +1,83 @@
<!DOCTYPE html><html lang="de" class="scroll-smooth bg-[#1A1816] text-[#E6D5C3]"> <head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><link rel="icon" type="image/svg+xml" href="/favicon.svg"><meta name="generator" content="Astro v4.16.19"><!-- SEO Meta Tags --><title>Komfort-Suite 4 Workation | Casa da Enzo Goslar</title><meta name="description" content="Optimiert für Remote Worker, Geschäftsreisende und Long-Stays"><meta name="robots" content="index, follow"><!-- Open Graph / Facebook / WhatsApp --><meta property="og:type" content="website"><meta property="og:url" content="https://casa-daenzo.de/apartments/suite-4-workspace/"><meta property="og:title" content="Komfort-Suite 4 Workation | Casa da Enzo Goslar"><meta property="og:description" content="Optimiert für Remote Worker, Geschäftsreisende und Long-Stays"><meta property="og:image" content="https://casa-daenzo.de/og-image.jpg"><!-- Twitter --><meta property="twitter:card" content="summary_large_image"><meta property="twitter:title" content="Komfort-Suite 4 Workation | Casa da Enzo Goslar"><meta property="twitter:description" content="Optimiert für Remote Worker, Geschäftsreisende und Long-Stays"><meta property="twitter:image" content="https://casa-daenzo.de/og-image.jpg"><!-- Schema.org JSON-LD --><script type="application/ld+json">{"@context":"https://schema.org","@graph":[{"@type":"LodgingBusiness","@id":"https://casa-daenzo.de/#lodging","name":"Casa da Enzo Boutique Apartments","url":"https://casa-daenzo.de","telephone":"+4915207483196","email":"booking@casa-daenzo.de","address":{"@type":"PostalAddress","streetAddress":"Bäckerstraße 18","addressLocality":"Goslar","postalCode":"38640","addressCountry":"DE"},"geo":{"@type":"GeoCoordinates","latitude":51.906,"longitude":10.428},"checkinTime":"15:00","checkoutTime":"11:00","numberOfRooms":7},{"@type":"Restaurant","@id":"https://casa-daenzo.de/#restaurant","name":"Trattoria da Enzo","url":"https://casa-daenzo.de/#trattoria","telephone":"+49532123456","servesCuisine":"Italian","address":{"@type":"PostalAddress","streetAddress":"Bäckerstraße 18","addressLocality":"Goslar","postalCode":"38640","addressCountry":"DE"}}]}</script><!-- Google Analytics (GA4) Snippet --><script async src="https://www.googletagmanager.com/gtag/js?id=G-CASADAENZO1"></script><script>(function(){const GA_MEASUREMENT_ID = "G-CASADAENZO1";
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', GA_MEASUREMENT_ID, {
anonymize_ip: true,
cookie_flags: 'SameSite=None;Secure'
});
})();</script><link rel="stylesheet" href="/_astro/_slug_.B_TTBYoh.css"><script type="module" src="/_astro/hoisted.jAcVTPu2.js"></script></head> <body class="bg-[#1A1816] text-[#E6D5C3] antialiased min-h-screen flex flex-col selection:bg-[#D4A373] selection:text-[#1A1816]"> <header class="sticky top-0 z-40 w-full bg-stone-900/95 backdrop-blur-md border-b border-stone-800 transition-all"> <!-- Top Utility Contact Bar --> <div class="bg-stone-950 border-b border-stone-800/80 py-1.5 px-4 text-[11px] sm:text-xs"> <div class="max-w-7xl mx-auto flex flex-wrap items-center justify-between gap-2 text-stone-400"> <!-- Dual Contacts --> <div class="flex flex-wrap items-center gap-4 sm:gap-6"> <!-- Apartments Phone --> <a href="https://wa.me/4915207483196" target="_blank" rel="noopener noreferrer" class="inline-flex items-center gap-1.5 text-emerald-400 hover:text-emerald-300 font-medium transition-colors" title="Apartment Anfragen & Concierge Alja"> <span class="w-2 h-2 rounded-full bg-emerald-500"></span> <span class="text-stone-300">Apartments (WhatsApp):</span> <span class="underline font-semibold">+49 1520 7483196</span> </a> <!-- Trattoria Phone --> <a href="tel:+4915207483196" class="inline-flex items-center gap-1.5 text-[#C85A32] hover:text-[#e2724a] font-medium transition-colors" title="Trattoria Tischreservierung"> <span class="w-2 h-2 rounded-full bg-[#C85A32]"></span> <span class="text-stone-300">Trattoria:</span> <span class="underline font-semibold">+49 1520 7483196</span> </a> </div> <!-- Right Utility Links: Eviivo & Language Switch --> <div class="flex items-center gap-4"> <a href="https://guest.eviivo.com/casa-daenzo" target="_blank" rel="noopener noreferrer" class="inline-flex items-center gap-1 text-amber-400 hover:text-white transition-colors font-medium cursor-pointer" title="Digital Guest Directory"> <span>📖</span> <span class="underline">Eviivo Guest Directory</span> </a> <div class="flex items-center bg-stone-900 border border-stone-800 rounded-full px-2 py-0.5 text-[11px] font-bold"> <span class="px-1.5 py-0.5 rounded-full bg-amber-500 text-stone-950">DE</span> </div> </div> </div> </div> <!-- Main Navigation Bar --> <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 h-20 flex items-center justify-between"> <!-- Brand Logo --> <a href="/" class="flex items-center gap-3 group"> <div class="w-11 h-11 rounded-2xl bg-gradient-to-br from-[#2D5A43] via-[#D4A373] to-[#C85A32] p-0.5 shadow-lg group-hover:scale-105 transition-transform"> <div class="w-full h-full bg-stone-950 rounded-[14px] flex items-center justify-center font-serif text-xl font-bold text-amber-400">
E
</div> </div> <div class="flex flex-col"> <span class="font-serif text-xl tracking-wide font-bold text-white group-hover:text-amber-400 transition-colors">
Casa da Enzo
</span> <div class="flex items-center gap-1.5 text-[10px] tracking-widest uppercase font-sans -mt-0.5"> <span class="text-emerald-400 font-semibold">Apartments</span> <span class="text-stone-400">•</span> <span class="text-[#C85A32] font-semibold">Trattoria</span> </div> </div> </a> <!-- Desktop Navigation --> <nav class="hidden md:flex items-center gap-6 lg:gap-8 text-sm font-medium"> <a href="/apartments" class="text-stone-200 hover:text-emerald-400 transition-colors flex items-center gap-1.5"> <span class="w-1.5 h-1.5 rounded-full bg-emerald-500"></span> <span>Apartments & Suiten</span> </a> <a href="/trattoria" class="text-stone-200 hover:text-[#C85A32] transition-colors flex items-center gap-1.5"> <span class="w-1.5 h-1.5 rounded-full bg-[#C85A32]"></span> <span>Trattoria da Enzo</span> </a> <a href="/blog" class="text-stone-200 hover:text-amber-400 transition-colors">
Blog & Magazin
</a> <a href="/#geschichte" class="text-stone-200 hover:text-amber-400 transition-colors">
Unsere Geschichte
</a> <a href="/#faq" class="text-stone-200 hover:text-amber-400 transition-colors">
FAQ
</a> </nav> <!-- CTAs --> <div class="flex items-center gap-3"> <a href="/apartments#booking" class="hidden sm:inline-flex items-center gap-2 px-5 py-2.5 rounded-full bg-[#C85A32] text-white font-medium text-xs lg:text-sm hover:bg-[#b04d2a] shadow-md transition-all hover:scale-105"> <span>Direkt buchen (Bestpreis)</span> </a> <!-- Mobile Menu Button --> <button id="mobile-menu-btn" class="md:hidden p-2 text-stone-200 hover:text-amber-400 rounded-xl bg-stone-800 border border-stone-700" aria-label="Menü öffnen"> <svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16"></path> </svg> </button> </div> </div> <!-- Mobile Navigation Dropdown --> <div id="mobile-menu" class="hidden md:hidden bg-stone-950 border-b border-stone-800 px-4 py-6 space-y-4"> <a href="/apartments" class="block py-2 text-stone-200 font-medium hover:text-emerald-400 flex items-center gap-2"> <span class="w-2 h-2 rounded-full bg-emerald-500"></span> <span>Apartments & Suiten</span> </a> <a href="/trattoria" class="block py-2 text-stone-200 font-medium hover:text-[#C85A32] flex items-center gap-2"> <span class="w-2 h-2 rounded-full bg-[#C85A32]"></span> <span>Trattoria da Enzo</span> </a> <a href="/blog" class="block py-2 text-stone-200 font-medium hover:text-amber-400">
Blog & Magazin
</a> <a href="/#geschichte" class="block py-2 text-stone-200 font-medium hover:text-amber-400">
Unsere Geschichte
</a> <a href="/#faq" class="block py-2 text-stone-200 font-medium hover:text-amber-400">
FAQ
</a> <div class="pt-2 border-t border-stone-800 space-y-2"> <a href="https://wa.me/4915207483196" target="_blank" class="block py-1.5 text-xs text-emerald-400 font-semibold">
💬 Apartments WhatsApp: +49 1520 7483196
</a> <a href="https://guest.eviivo.com/casa-daenzo" target="_blank" class="block py-1.5 text-xs text-amber-400 font-semibold">
📖 Eviivo Guest Directory
</a> </div> <a href="/apartments#booking" class="block text-center py-3 rounded-2xl bg-[#C85A32] text-white font-bold text-sm">
Jetzt Direkt buchen
</a> </div> </header> <main class="flex-1"> <div class="py-12 bg-[#1A1816]"> <div class="max-w-5xl mx-auto px-4 sm:px-6 lg:px-8 space-y-8"> <!-- Back Link & Top Badges Bar --> <div class="flex flex-col sm:flex-row sm:items-center justify-between gap-4"> <a href="/#apartments" class="inline-flex items-center gap-2 text-xs font-bold text-emerald-400 hover:underline">
← Zurück zu allen Apartments
</a> <!-- Airbnb & Booking Badges + Eviivo Guest Directory --> <div class="flex flex-wrap items-center gap-3 text-xs font-medium"> <span class="px-3 py-1 rounded-full bg-[#24211D] border border-[#D4A373]/20 text-[#E6D5C3]">
★ <strong class="text-[#D4A373]">4.98</strong> Superhost
</span> <span class="px-3 py-1 rounded-full bg-[#24211D] border border-[#D4A373]/20 text-[#E6D5C3]">
Booking.com <strong class="text-blue-400">9.8</strong> </span> <button onclick="document.getElementById('eviivo-link-btn')?.click()" class="px-3 py-1 rounded-full bg-[#2D5A43]/30 border border-emerald-500/40 text-emerald-400 hover:bg-[#2D5A43]/50 transition-colors flex items-center gap-1 font-semibold"> <span>📖 Eviivo Gästemappe</span> </button> </div> </div> <!-- Title & Header --> <div class="space-y-3"> <span class="inline-block px-3 py-1 rounded-full text-xs font-bold uppercase tracking-wider bg-[#2D5A43] text-emerald-100 border border-emerald-500/40"> Premium-Komfort </span> <h1 class="font-serif text-4xl sm:text-5xl font-bold text-[#E6D5C3]">Komfort-Suite 4 Workation</h1> <p class="text-[#A3978B] text-base sm:text-lg leading-relaxed">Optimiert für Remote Worker, Geschäftsreisende und Long-Stays</p> </div> <!-- Quick Specs Bar --> <div class="grid grid-cols-2 sm:grid-cols-4 gap-4 p-6 rounded-3xl stone-card border border-[#D4A373]/20 text-center"> <div> <span class="block text-[10px] uppercase tracking-wider text-[#D4A373] font-bold">Kapazität</span> <span class="font-serif text-lg font-bold text-[#E6D5C3] mt-1 block">👥 Bis 2 Gäste</span> </div> <div> <span class="block text-[10px] uppercase tracking-wider text-[#D4A373] font-bold">Größe</span> <span class="font-serif text-lg font-bold text-[#E6D5C3] mt-1 block">📐 50 m²</span> </div> <div> <span class="block text-[10px] uppercase tracking-wider text-[#D4A373] font-bold">Aussicht</span> <span class="font-serif text-lg font-bold text-[#E6D5C3] mt-1 block">Altstadtblick</span> </div> <div> <span class="block text-[10px] uppercase tracking-wider text-[#D4A373] font-bold">Workspace</span> <span class="font-serif text-lg font-bold text-[#E6D5C3] mt-1 block">💻 Workstation</span> </div> </div> <!-- Visual Gallery Placeholder Banner --> <div class="aspect-[21/9] rounded-3xl bg-gradient-to-br from-[#2E2A25] to-[#1A1816] text-[#E6D5C3] flex flex-col items-center justify-center p-6 text-center border border-[#D4A373]/20 relative overflow-hidden shadow-2xl"> <div class="relative z-10 space-y-2"> <span class="px-3.5 py-1 rounded-full bg-[#2D5A43]/30 text-emerald-400 text-xs font-bold uppercase tracking-widest border border-emerald-500/30">
Saniert 2025 • UNESCO Altstadt Goslar
</span> <h2 class="font-serif text-2xl sm:text-3xl font-bold">Komfort-Suite 4 Workation</h2> <p class="text-[#A3978B] text-xs sm:text-sm max-w-md mx-auto">
Restauriertes Fachwerk aus dem 16. Jahrhundert kombiniert mit italienischem Design & smartem Nuki Keyless Check-in.
</p> </div> </div> <!-- Highlights & Details --> <div class="grid grid-cols-1 md:grid-cols-3 gap-8 pt-4"> <div class="md:col-span-2 space-y-6 stone-card p-8 rounded-3xl border border-[#D4A373]/20"> <h2 class="font-serif text-2xl font-bold text-[#E6D5C3]">Beschreibung & Ausstattung</h2> <div class="prose prose-invert max-w-none text-[#E6D5C3] text-sm leading-relaxed"> <p>Für digitale Nomaden und Workation-Gäste maßgeschneidert: Suite 4 bietet einen professionellen Arbeitsplatz, blitzschnelles Internet und absolute Ruhe mitten im UNESCO-Weltkulturerbe.</p> </div> <div class="pt-6 border-t border-[#D4A373]/15"> <h3 class="font-serif text-lg font-bold text-[#D4A373] mb-2">Küche & Verpflegung</h3> <p class="text-[#A3978B] text-xs leading-relaxed">Voll ausgestattete Küchenzeile mit Bosch-Geräten</p> </div> <div class="pt-4 border-t border-[#D4A373]/15 flex flex-wrap items-center justify-between gap-4 text-xs text-[#A3978B]"> <span>🔑 Nuki Smart Lock PIN Check-in ab 15:00 Uhr</span> <span>🌿 Nachhaltige Lehmdämmung für gesunden Schlaf</span> </div> </div> <!-- Sidebar / Highlights --> <div class="space-y-6"> <div class="stone-card p-6 rounded-3xl space-y-4 border border-[#D4A373]/30 shadow-xl"> <h3 class="font-serif text-xl font-bold text-[#D4A373]">Ausstattungs-Highlights</h3> <ul class="space-y-3 text-xs text-[#E6D5C3]"> <li class="flex items-start gap-3"> <span class="text-emerald-400 font-bold">✓</span> <span>Professioneller Workstation-Schreibtisch &amp; Monitor</span> </li><li class="flex items-start gap-3"> <span class="text-emerald-400 font-bold">✓</span> <span>100 Mbit/s Glasfaser WLAN</span> </li><li class="flex items-start gap-3"> <span class="text-emerald-400 font-bold">✓</span> <span>Flüsterleise Lage &amp; Verdunkelungsrollos</span> </li><li class="flex items-start gap-3"> <span class="text-emerald-400 font-bold">✓</span> <span>Wäsche- &amp; Reinigungsservice auf Anfrage</span> </li> </ul> </div> <!-- Trattoria Info Card --> <div class="stone-card border border-[#C85A32]/40 p-6 rounded-3xl space-y-3"> <span class="text-xs font-bold uppercase tracking-wider text-[#C85A32]">Hauseigene Gastronomie</span> <h4 class="font-serif text-lg font-bold text-[#E6D5C3]">Trattoria da Enzo im Erdgeschoss</h4> <p class="text-xs text-[#A3978B] leading-relaxed">
Als Hotelgast genießt du eine bevorzugte Tischreservierung bei Alessandra. Genieße hausgemachte Pasta und sizilianische Weine direkt im Haus!
</p> <a href="tel:+49532123456" class="inline-block text-xs font-bold text-[#C85A32] hover:underline">
📞 Tisch reservieren: +49 5321 23456 →
</a> </div> </div> </div> <!-- Eviivo Booking Widget --> <section id="booking" class="pt-6"> <div class="stone-card rounded-3xl p-6 sm:p-10 max-w-4xl mx-auto my-8 font-sans border border-[#D4A373]/30 shadow-2xl"> <div class="text-center mb-8 space-y-2"> <div class="inline-flex items-center gap-2 px-3.5 py-1 rounded-full bg-[#2D5A43]/20 border border-emerald-500/40 text-emerald-400 text-xs font-bold uppercase tracking-wider"> <span>🔒 Direktbucher Bestpreis-Garantie</span> </div> <h3 class="font-serif text-2xl sm:text-3xl font-bold text-[#E6D5C3]">
Verfügbarkeit & Bestpreis prüfen
</h3> <p class="text-[#A3978B] text-xs sm:text-sm max-w-xl mx-auto">
Buche direkt über unsere Eviivo-Schnittstelle – 15% günstiger als auf Booking.com oder Airbnb. Bestpreis garantiert!
</p> </div> <!-- Booking Mask Interface --> <form action="https://onlinereservation.eviivo.com" method="GET" target="_blank" class="grid grid-cols-1 sm:grid-cols-3 gap-4"> <div class="space-y-1"> <label class="text-xs font-semibold text-[#D4A373] uppercase tracking-wider">Anreise</label> <input type="date" name="startDate" class="w-full px-4 py-3 rounded-xl bg-[#1A1816] border border-[#D4A373]/30 text-[#E6D5C3] text-xs focus:border-[#D4A373] focus:outline-none" required> </div> <div class="space-y-1"> <label class="text-xs font-semibold text-[#D4A373] uppercase tracking-wider">Abreise</label> <input type="date" name="endDate" class="w-full px-4 py-3 rounded-xl bg-[#1A1816] border border-[#D4A373]/30 text-[#E6D5C3] text-xs focus:border-[#D4A373] focus:outline-none" required> </div> <div class="space-y-1"> <label class="text-xs font-semibold text-[#D4A373] uppercase tracking-wider">Gäste</label> <select name="adults" class="w-full px-4 py-3 rounded-xl bg-[#1A1816] border border-[#D4A373]/30 text-[#E6D5C3] text-xs focus:border-[#D4A373] focus:outline-none"> <option value="1">1 Person</option> <option value="2" selected>2 Personen</option> <option value="3">3 Personen</option> <option value="4">4 Personen</option> </select> </div> <div class="sm:col-span-3 pt-2"> <button type="submit" class="w-full py-4 rounded-xl bg-gradient-to-r from-[#2D5A43] to-[#C85A32] text-white font-bold text-sm hover:opacity-95 shadow-xl transition-all">
Jetzt Verfügbarkeit & Bestpreis abrufen ➔
</button> </div> </form> <div class="mt-6 text-center text-[11px] text-[#A3978B] flex flex-wrap items-center justify-center gap-4 border-t border-[#D4A373]/10 pt-4"> <span>🔒 Sichere SSL-Schnittstelle</span> <span>•</span> <span>💳 Keine versteckten Gebühren</span> <span>•</span> <span>⚡ Sofortige Reservierungsbestätigung</span> </div> </div> </section> </div> </div> </main> <footer class="bg-stone-950 text-stone-400 pt-16 pb-12 border-t border-stone-800 font-sans"> <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8"> <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-12 mb-12"> <!-- Col 1: Brand & Heritage --> <div class="space-y-4"> <div class="flex items-center gap-3"> <div class="w-10 h-10 rounded-xl bg-gradient-to-br from-[#2D5A43] via-[#D4A373] to-[#C85A32] p-0.5"> <div class="w-full h-full bg-stone-950 rounded-[10px] flex items-center justify-center font-serif text-lg font-bold text-amber-400">
E
</div> </div> <div> <h3 class="font-serif text-xl font-bold text-stone-100">Casa da Enzo</h3> <p class="text-[10px] uppercase tracking-widest text-amber-400">Sizilien trifft Goslar • Seit 1980</p> </div> </div> <p class="text-xs leading-relaxed text-stone-400">
7 individuelle Boutique-Apartments über unserer traditionsreichen Trattoria im UNESCO-Weltkulturerbe Goslar. 100% digitaler Check-in trifft auf authentische italienische Gastfreundschaft.
</p> <p class="text-xs text-amber-400 font-medium">
📍 Bäckerstraße 18 • 38640 Goslar, Harz
</p> </div> <!-- Col 2: Navigation --> <div class="space-y-3"> <h4 class="font-serif text-base font-semibold text-stone-100 border-b border-stone-800 pb-2">Navigation</h4> <ul class="space-y-2 text-xs"> <li> <a href="/apartments" class="hover:text-emerald-400 transition-colors flex items-center gap-2"> <span class="w-1.5 h-1.5 rounded-full bg-emerald-500"></span> <span>Apartments & Suiten (7 Einheiten)</span> </a> </li> <li> <a href="/trattoria" class="hover:text-[#C85A32] transition-colors flex items-center gap-2"> <span class="w-1.5 h-1.5 rounded-full bg-[#C85A32]"></span> <span>Trattoria da Enzo (Speisekarte & Tisch)</span> </a> </li> <li> <a href="/trattoria#gutscheine" class="hover:text-amber-400 transition-colors flex items-center gap-2"> <span class="w-1.5 h-1.5 rounded-full bg-amber-400"></span> <span>Gutschein-Shop</span> </a> </li> <li> <a href="/blog" class="hover:text-amber-400 transition-colors">
Blog & Magazin
</a> </li> <li> <a href="/#geschichte" class="hover:text-amber-400 transition-colors">
Unsere Geschichte
</a> </li> </ul> </div> <!-- Col 3: Contacts --> <div class="space-y-3"> <h4 class="font-serif text-base font-semibold text-stone-100 border-b border-stone-800 pb-2">
Kontakt & Service
</h4> <div class="space-y-3 text-xs"> <!-- Apartments Contact --> <div class="p-3 rounded-xl bg-stone-900 border border-emerald-500/30 space-y-1"> <div class="text-[10px] uppercase font-bold text-emerald-400 flex items-center gap-1.5"> <span class="w-2 h-2 rounded-full bg-emerald-500"></span> <span>Apartments & Buchungen</span> </div> <a href="https://wa.me/4915207483196" target="_blank" class="block text-emerald-400 hover:underline font-bold">
WhatsApp: +49 1520 7483196
</a> <p class="text-[10px] text-stone-400">E-Mail: booking@casa-daenzo.de</p> </div> <!-- Trattoria Contact --> <div class="p-3 rounded-xl bg-stone-900 border border-[#C85A32]/30 space-y-1"> <div class="text-[10px] uppercase font-bold text-[#C85A32] flex items-center gap-1.5"> <span class="w-2 h-2 rounded-full bg-[#C85A32]"></span> <span>Trattoria Reservierung</span> </div> <a href="tel:+4915207483196" class="block text-[#C85A32] hover:underline font-bold">
Telefon: +49 1520 7483196
</a> <p class="text-[10px] text-stone-400">Öffnungszeiten: Di–So 17:00–22:30 Uhr</p> </div> </div> </div> <!-- Col 4: Direct Booking Advantages --> <div class="p-6 rounded-3xl bg-stone-900 border border-stone-800 space-y-4 shadow-xl"> <h4 class="font-serif text-base font-semibold text-amber-400">
Direktbucher-Vorteile
</h4> <ul class="space-y-2.5 text-xs text-stone-300"> <li class="flex items-start gap-2"> <span class="text-amber-400 font-bold">✓</span> <span>Bestpreis-Garantie (15% günstiger als Booking.com)</span> </li> <li class="flex items-start gap-2"> <span class="text-amber-400 font-bold">✓</span> <span>Bevorzugte Tischreservierung in der Trattoria</span> </li> <li class="flex items-start gap-2"> <span class="text-amber-400 font-bold">✓</span> <span>Kontaktloser Nuki Smart-Lock Check-in</span> </li> </ul> <a href="/apartments#booking" class="block text-center py-2.5 rounded-xl bg-[#C85A32] text-white font-bold text-xs hover:bg-[#b04d2a] transition-colors">
Verfügbarkeit prüfen
</a> </div> </div> <!-- Bottom line --> <div class="pt-8 border-t border-stone-900 flex flex-col sm:flex-row items-center justify-between text-xs text-stone-500 gap-4"> <p>© 2026 Casa da Enzo Goslar. Alle Rechte vorbehalten.</p> <div class="flex items-center gap-6"> <a href="https://guest.eviivo.com/casa-daenzo" target="_blank" class="hover:text-stone-300 transition-colors">Eviivo Guest Directory</a> </div> </div> </div> </footer> <div id="enzino-widget" class="fixed bottom-6 right-6 z-50 font-sans" data-lang="de"> <!-- Floating Launcher Button --> <button id="enzino-launcher" class="relative group flex items-center gap-3 bg-[#24211D] border border-[#D4A373]/30 hover:border-[#D4A373] text-[#E6D5C3] px-4 py-3 rounded-full shadow-2xl transition-all duration-300 hover:scale-105" aria-label="Enzino Concierge Chat öffnen"> <div class="relative w-10 h-10 rounded-full bg-gradient-to-br from-[#C85A32] to-[#D4A373] p-0.5 flex items-center justify-center shadow-inner"> <div class="w-full h-full rounded-full bg-[#1A1816] flex items-center justify-center text-lg font-serif font-bold text-[#D4A373]">
🇮🇹
</div> <span class="absolute -top-0.5 -right-0.5 w-3 h-3 bg-emerald-500 rounded-full border-2 border-[#1A1816] animate-pulse"></span> </div> <div class="text-left hidden sm:block"> <div class="text-xs font-serif font-bold text-[#D4A373] tracking-wide">Enzino Concierge</div> <div class="text-[10px] text-[#A3978B]">Online • Frag mich was!</div> </div> </button> <!-- Chat Dialog Window --> <div id="enzino-chat-window" class="hidden fixed bottom-6 right-6 w-[calc(100vw-3rem)] sm:w-[380px] max-h-[580px] h-[85vh] bg-[#24211D] border border-[#D4A373]/30 rounded-3xl shadow-2xl flex-col overflow-hidden transition-all duration-300 z-50"> <!-- Header --> <div class="bg-[#1A1816] border-b border-[#D4A373]/20 p-4 flex items-center justify-between"> <div class="flex items-center gap-3"> <div class="relative w-10 h-10 rounded-full bg-gradient-to-br from-[#C85A32] to-[#D4A373] p-0.5 flex items-center justify-center"> <div class="w-full h-full rounded-full bg-[#24211D] flex items-center justify-center text-lg">
👨‍🍳
</div> <span class="absolute bottom-0 right-0 w-2.5 h-2.5 bg-emerald-500 rounded-full border border-[#1A1816]"></span> </div> <div> <h3 class="font-serif text-sm font-bold text-[#E6D5C3]">Enzino da Enzo</h3> <p class="text-[10px] text-[#D4A373]">Digitaler Host & Concierge</p> </div> </div> <div class="flex items-center gap-2"> <!-- Session Disable Button --> <button id="enzino-disable-btn" title="Enzino für diese Session deaktivieren" class="p-1.5 text-[#A3978B] hover:text-amber-400 rounded-lg hover:bg-[#2A2622] text-xs transition-colors">
🚫
</button> <!-- Close Button --> <button id="enzino-close-btn" class="p-1.5 text-[#A3978B] hover:text-white rounded-lg hover:bg-[#2A2622] transition-colors" aria-label="Chat schließen">
✕
</button> </div> </div> <!-- Messages Body --> <div id="enzino-messages" class="flex-1 p-4 overflow-y-auto space-y-3.5 text-xs text-[#E6D5C3]"> <!-- Initial Bot Message --> <div class="flex gap-2.5 items-start"> <div class="w-7 h-7 rounded-full bg-[#C85A32]/20 border border-[#C85A32]/40 flex items-center justify-center text-xs shrink-0">
🇮🇹
</div> <div class="bg-[#2E2A25] border border-[#D4A373]/15 p-3 rounded-2xl rounded-tl-none max-w-[85%] leading-relaxed shadow-sm"> Ciao! I&#39;m Enzino, dein italienischer Digital Concierge 🇮🇹 Wie kann ich dir heute helfen? Frag mich nach unseren Apartments, der Trattoria oder dem digitalen Check-in! </div> </div> <!-- Quick Chips --> <div id="enzino-chips" class="flex flex-wrap gap-1.5 pt-2 pl-9"> <button class="enzino-chip text-[11px] bg-[#1A1816] hover:bg-[#C85A32]/20 text-[#D4A373] border border-[#D4A373]/30 hover:border-[#D4A373] px-3 py-1.5 rounded-full transition-all text-left" data-question="Wie funktioniert der Check-in?"> Wie funktioniert der Check-in? </button><button class="enzino-chip text-[11px] bg-[#1A1816] hover:bg-[#C85A32]/20 text-[#D4A373] border border-[#D4A373]/30 hover:border-[#D4A373] px-3 py-1.5 rounded-full transition-all text-left" data-question="Tisch in der Trattoria reservieren"> Tisch in der Trattoria reservieren </button><button class="enzino-chip text-[11px] bg-[#1A1816] hover:bg-[#C85A32]/20 text-[#D4A373] border border-[#D4A373]/30 hover:border-[#D4A373] px-3 py-1.5 rounded-full transition-all text-left" data-question="Direktbucher Bestpreis"> Direktbucher Bestpreis </button><button class="enzino-chip text-[11px] bg-[#1A1816] hover:bg-[#C85A32]/20 text-[#D4A373] border border-[#D4A373]/30 hover:border-[#D4A373] px-3 py-1.5 rounded-full transition-all text-left" data-question="Digitales Gästebuch (Eviivo)"> Digitales Gästebuch (Eviivo) </button> </div> </div> <!-- Typing Indicator (hidden by default) --> <div id="enzino-typing" class="hidden px-4 py-2 text-[11px] text-[#D4A373] italic flex items-center gap-2 bg-[#1A1816]/50"> <span class="w-2 h-2 bg-[#D4A373] rounded-full animate-ping"></span> <span>Enzino tippt...</span> </div> <!-- Input Footer --> <form id="enzino-form" class="bg-[#1A1816] border-t border-[#D4A373]/20 p-3 flex gap-2"> <input type="text" id="enzino-input" placeholder="Stelle Enzino eine Frage..." class="flex-1 bg-[#24211D] border border-[#D4A373]/20 focus:border-[#D4A373] text-[#E6D5C3] placeholder-[#A3978B] text-xs rounded-xl px-3 py-2.5 outline-none transition-all" autocomplete="off"> <button type="submit" class="bg-[#C85A32] hover:bg-[#b04d2a] text-white px-3.5 py-2.5 rounded-xl text-xs font-bold transition-all shrink-0">
➔
</button> </form> </div> </div> </body></html>