@font-face {font-family: System; src: local("Inter"), local("-apple-system"), local("Segoe UI"), local("Roboto"), local("Helvetica Neue"), local("Arial");}
:root {--bg-1:#ffffff;--bg-2:#ffffff;--accent:#ff5a5f;--accent-2:#ffd166;--ink:#3b3b3b;--text:#111111;--muted:#6b6b6b;}
* {box-sizing:border-box}
html,body {height:100%}
body {margin:0;font-family:'Gravitas One', System, serif;background:var(--bg-1);color:var(--text);-webkit-font-smoothing:antialiased;overscroll-behavior:none}
.container {position:relative;z-index:3}
#map, .bg, .orbs, .blobs {transform:translateZ(0)}
#map {position:fixed;inset:0;z-index:0}
.watercolor-ish .leaflet-tile {filter: sepia(.15) contrast(.95) brightness(1.02) saturate(1.15) hue-rotate(-6deg)}
.bg {position:fixed;inset:0;background:radial-gradient(1000px 500px at 20% 30%, rgba(255,90,95,.04) 0%, transparent 60%), radial-gradient(900px 450px at 80% 70%, rgba(255,209,102,.05) 0%, transparent 60%);filter:blur(30px);animation:glow 14s ease-in-out infinite;pointer-events:none;z-index:1}
.orbs {position:fixed;inset:0;pointer-events:none;z-index:2}
.blobs {position:fixed;inset:0;pointer-events:none;z-index:2}
.orb {position:absolute;width:32vmin;height:32vmin;border-radius:50%;background:radial-gradient(circle at 30% 30%, rgba(0,0,0,.06), rgba(0,0,0,.02) 40%, transparent 70%);mix-blend-mode:multiply;filter:blur(6px);animation:orb 18s linear infinite}
.orb:nth-child(1){top:8%;left:10%;animation-delay:-2s}
.orb:nth-child(2){bottom:12%;left:50%;animation-delay:-7s}
.orb:nth-child(3){top:30%;right:8%;animation-delay:-12s}
@keyframes orb {0%{transform:translate3d(-12vw,0,0) scale(1)}50%{transform:translate3d(12vw,6vh,0) scale(1.15)}100%{transform:translate3d(-12vw,0,0) scale(1)}}
@keyframes glow {0%,100%{opacity:.7}50%{opacity:1}}
.container {min-height:100vh;display:grid;grid-template-rows:auto 1fr;place-items:center;padding:8vmin 5vmin}
.hero {display:flex;align-items:center;justify-content:center;text-align:center}
.brand {display:flex;flex-direction:column;align-items:center;gap:2.4vmin}
#logo {width:56vmin;max-width:72vw;height:auto;filter:drop-shadow(0 10px 20px rgba(0,0,0,.08));animation:float 6s ease-in-out infinite}
@keyframes float {0%{transform:translateY(0) scale(1)}50%{transform:translateY(-1.2vmin) scale(1.02)}100%{transform:translateY(0) scale(1)}}
.tagline {font-size:4.4vmin;margin:0;color:var(--muted);opacity:.9}
.contact {display:inline-block;padding:2.6vmin 4vmin;border-radius:999px;background:linear-gradient(90deg,var(--accent),var(--accent-2));color:#0c0c0f;text-decoration:none;font-weight:700;box-shadow:0 10px 24px rgba(255,90,95,.25);transform:translateZ(0);transition:transform .2s ease, box-shadow .2s ease}
.contact:active {transform:scale(.98)}
.footer {position:relative;z-index:4;width:100%}
.footer-inner {display:flex;gap:2rem;align-items:center;justify-content:center;padding:2vmin 4vmin;background:rgba(255,255,255,.7);border-top:1px solid rgba(0,0,0,.08);backdrop-filter:saturate(160%) blur(6px)}
.footer .social {color:#111;text-decoration:none;font-weight:700;display:flex;align-items:center;gap:.6rem}
.footer .social .icon {width:20px;height:20px;flex:0 0 auto}
.footer .copy {color:#2a2a2a;opacity:.8}
.products {width:100%;max-width:1400px;padding-top:8vmin}
.section-title {margin:0 0 1rem 0;text-align:center;color:#111;font-weight:700;letter-spacing:.08em}
.carousel {position:relative}
.track {display:grid;grid-auto-flow:column;grid-auto-columns:min(420px,80vw);gap:4vmin;overflow-x:auto;scroll-snap-type:x mandatory;padding:2vmin 0}
.track::-webkit-scrollbar{display:none}
.track{scrollbar-width:none}
.card {scroll-snap-align:center}
.nav {position:absolute;top:50%;transform:translateY(-50%);width:40px;height:40px;border-radius:999px;border:1px solid rgba(0,0,0,.12);background:linear-gradient(135deg, rgba(255,255,255,.9), rgba(255,255,255,.75));color:#111;display:grid;place-items:center;cursor:pointer;box-shadow:0 10px 24px rgba(0,0,0,.16);backdrop-filter:saturate(160%) blur(6px);z-index:5}
.nav.prev {left:8px}
.nav.next {right:8px}
.card {display:grid;grid-template-columns:1fr;gap:2.4vmin;align-items:center;background:rgba(255,255,255,.6);border:1px solid rgba(0,0,0,.08);border-radius:20px;padding:3vmin;transition:transform .25s ease, box-shadow .25s ease, background .25s ease;backdrop-filter:saturate(160%) blur(10px);box-shadow:0 12px 28px rgba(0,0,0,.12)}
.card:hover {transform:translateY(-6px) scale(1.01);box-shadow:0 18px 44px rgba(0,0,0,.18);background:rgba(255,255,255,.72)}
.thumb {width:100%;aspect-ratio:16/9;border-radius:16px;background:linear-gradient(90deg,rgba(0,0,0,.03),rgba(0,0,0,.06),rgba(0,0,0,.03));background-size:200% 100%;animation:shimmer 1.4s linear infinite}
.img-thumb {background-size:cover;background-position:center;animation:none}
.title {margin:0;font-size:3.4vmin;font-weight:700;color:#111}
.desc {margin:0;color:#1e2744;opacity:.9;font-size:2.4vmin;line-height:1.45}
.card {cursor:pointer}
@keyframes shimmer {0%{background-position:0 0}100%{background-position:100% 0}}
.details {display:grid;gap:2.2vmin}
.line {height:12px;border-radius:10px;background:linear-gradient(90deg,rgba(0,0,0,.03),rgba(0,0,0,.06),rgba(0,0,0,.03));background-size:200% 100%;animation:shimmer 1.6s linear infinite}
.line.short {width:60%}
.reveal {opacity:0;transform:translateY(24px);transition:opacity .6s ease, transform .6s ease}
.reveal.in {opacity:1;transform:translateY(0)}
@media (min-width:960px){.track{grid-auto-columns:min(420px,40vw)}}
@media (min-width:1280px){.track{grid-auto-columns:min(360px,28vw)}}
@media (min-width:768px){#logo{width:42vmin}.tagline{font-size:3vmin}.container{padding:6vmin}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}#logo{transform:none}}

@media (max-width:480px){
  .track{grid-auto-columns:92vw;gap:3vmin}
  .title{font-size:4vmin}
  .desc{font-size:3vmin}
  .nav{display:none}
}

@media (max-width:640px){
  #map{display:block}
  .carousel .track{display:flex;flex-direction:column;overflow:visible;scroll-snap-type:none}
  .card{scroll-snap-align:unset}
  .nav{display:none}
}

.blobs {position:fixed;inset:0;pointer-events:none}
.blob {position:absolute;width:36vmin;height:36vmin;border-radius:50%;filter:blur(30px);opacity:.7;mix-blend-mode:multiply;animation:blob 24s ease-in-out infinite}
.b1 {top:10%;left:5%;background:radial-gradient(circle at 30% 30%, rgba(255,90,95,.25), rgba(255,90,95,.05) 60%, transparent 70%)}
.b2 {top:20%;right:10%;background:radial-gradient(circle at 40% 40%, rgba(255,209,102,.25), rgba(255,209,102,.05) 60%, transparent 70%)}
.b3 {bottom:12%;left:30%;background:radial-gradient(circle at 50% 50%, rgba(93,135,255,.22), rgba(93,135,255,.05) 60%, transparent 70%)}
.b4 {bottom:18%;right:20%;background:radial-gradient(circle at 50% 50%, rgba(0,0,0,.12), rgba(0,0,0,.04) 60%, transparent 70%)}
@keyframes blob {0%,100%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(2vw,-2vh,0) scale(1.15)}}

.marquee {width:100%;overflow:hidden;padding:3vmin 0}
.marquee .track {display:flex;gap:6rem;white-space:nowrap;font-weight:800;font-size:8vmin;color:#111;opacity:.12;animation:marquee 24s linear infinite;will-change:transform;min-width:200%}
.marquee .track span {letter-spacing:.14em}
@keyframes marquee {0%{transform:translateX(0)}100%{transform:translateX(-50%)}}