@import url('https://fonts.googleapis.com/css2?family=Archivo+Black&family=Archivo:wght@400;500;600;700&display=swap');

:root{
  --navy-deep:#0b1726;
  --navy-mid:#13243a;
  --charcoal:#232220;
  --charcoal-soft:#2c2a28;
  --mist:#eceeef;
  --mist-line:#c7cbce;
  --lilac:#cdb6da;
  --lilac-soft:#e6d9ee;
  --gold:#cdae6e;
  --ink:#1c1c1c;
  --paper:#f4f1ea;
}

*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  font-family:'Archivo', sans-serif;
  background:var(--navy-deep);
  color:var(--paper);
  overflow-x:hidden;
}
h1,h2,h3{
  font-family:'Archivo Black', sans-serif;
  font-weight:400;
  letter-spacing:-0.02em;
  line-height:0.95;
}
a{color:inherit; text-decoration:none;}
.eyebrow{
  font-size:0.78rem;
  letter-spacing:0.18em;
  font-weight:700;
  text-transform:uppercase;
  opacity:0.85;
}
.wrap{max-width:1280px; margin:0 auto; padding:0 48px;}
section{position:relative;}

/* ---------- NAV ---------- */
nav{
  position:fixed; top:0; left:0; right:0; z-index:50;
  display:flex; align-items:center; justify-content:space-between;
  padding:22px 48px;
  mix-blend-mode:difference;
  color:#fff;
  font-size:0.85rem;
  letter-spacing:0.08em;
}
nav .brand{font-family:'Archivo Black'; font-size:1.1rem; text-transform:uppercase;}
nav ul{display:flex; gap:32px; list-style:none;}
nav ul a{text-transform:uppercase; opacity:0.85; transition:opacity .2s;}
nav ul a:hover, nav ul a.active{opacity:1;}
@media (max-width:760px){ nav ul{display:none;} }

.page-spacer{height:96px;}

/* ---------- HERO (home) ---------- */
.hero{
  min-height:100vh;
  display:flex; align-items:center;
  background:
    radial-gradient(ellipse 60% 80% at 18% 50%, rgba(205,182,218,0.18), transparent 60%),
    linear-gradient(120deg, var(--navy-deep) 0%, var(--navy-mid) 55%, #1a2e47 100%);
}
.hero-grid{
  width:100%;
  display:grid; grid-template-columns: 1fr 1.1fr;
  align-items:center; gap:40px;
  padding:0 48px;
}
.hero-visual{
  position:relative; height:640px;
  display:flex; align-items:center; justify-content:center;
}
.bottle-glow{
  position:absolute; width:420px; height:420px; border-radius:50%;
  background:radial-gradient(circle, rgba(205,182,218,0.35), transparent 70%);
  filter:blur(10px);
}
.bottle{
  position:relative; width:140px; height:380px;
  animation:float 6s ease-in-out infinite;
}
@keyframes float{ 0%,100%{transform:translateY(0)} 50%{transform:translateY(-16px)} }
.bottle .cap{
  width:54px; height:44px; margin:0 auto;
  background:linear-gradient(180deg,#dcc89a,#a9874f);
  border-radius:6px 6px 2px 2px;
}
.bottle .neck{
  width:24px; height:22px; margin:0 auto;
  background:linear-gradient(180deg, rgba(205,182,218,0.9), rgba(205,182,218,0.5));
}
.bottle .body{
  width:140px; height:300px;
  background:linear-gradient(160deg, rgba(205,182,218,0.55), rgba(120,140,170,0.25) 60%, rgba(20,30,45,0.6));
  border-radius:18px 18px 30px 30px;
  border:1px solid rgba(255,255,255,0.25);
  backdrop-filter:blur(2px);
  box-shadow: inset 0 0 40px rgba(255,255,255,0.08), 0 30px 60px rgba(0,0,0,0.45);
  position:relative;
  overflow:hidden;
}
.bottle .body::after{
  content:"";
  position:absolute; left:14px; top:30px; bottom:30px; width:1px;
  background:rgba(255,255,255,0.35);
}
.bottle .label{
  position:absolute; top:130px; left:50%; transform:translateX(-50%) rotate(-90deg);
  font-size:0.62rem; letter-spacing:0.3em; text-transform:uppercase; color:#fff; opacity:0.7;
  white-space:nowrap;
}
.hero-text{
  border:1px solid rgba(255,255,255,0.18);
  padding:56px;
}
.hero-text h1{
  font-size:clamp(3.2rem, 7vw, 5.6rem);
  margin:18px 0 28px;
  color:#fff;
}
.hero-sub{
  font-weight:700; letter-spacing:0.06em; font-size:0.95rem;
  text-transform:uppercase; color:var(--lilac-soft);
}
.hero-arrow{
  margin-top:56px;
  display:flex; align-items:center; gap:14px;
  font-size:0.8rem; letter-spacing:0.1em; text-transform:uppercase; opacity:0.7;
}
.hero-arrow svg{animation:bob 1.8s ease-in-out infinite;}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(6px)}}
@media (max-width:900px){
  .hero-grid{grid-template-columns:1fr; padding:140px 24px 60px;}
  .hero-visual{height:340px;}
  .hero-text{padding:32px;}
}

/* ---------- PAGE HEADER (sub-pages) ---------- */
.page-hero{
  padding:200px 48px 90px;
  background:
    radial-gradient(ellipse 50% 60% at 85% 20%, rgba(205,182,218,0.16), transparent 60%),
    linear-gradient(120deg, var(--navy-deep) 0%, var(--navy-mid) 100%);
}
.page-hero .eyebrow{color:var(--lilac-soft); margin-bottom:14px;}
.page-hero h1{font-size:clamp(2.6rem,6vw,4.4rem); color:#fff;}
.page-hero p{margin-top:18px; max-width:560px; color:#cfd2d6; line-height:1.6;}

/* ---------- ABOUT ---------- */
.about-top{
  background:var(--charcoal);
  display:grid; grid-template-columns: 0.9fr 1.1fr;
  min-height:560px;
}
.about-visual{
  position:relative;
  background:
    radial-gradient(circle at 30% 30%, rgba(205,182,218,0.25), transparent 60%),
    linear-gradient(160deg,#3a3733,#161513);
  display:flex; align-items:center; justify-content:center;
}
.about-visual .drop{
  width:180px; height:240px;
  border-radius:50% 50% 50% 50% / 60% 60% 40% 40%;
  background:linear-gradient(180deg, rgba(205,182,218,0.7), rgba(120,140,170,0.3));
  box-shadow:0 40px 80px rgba(0,0,0,0.5), inset 0 0 30px rgba(255,255,255,0.15);
}
.about-content{padding:80px 64px; display:flex; flex-direction:column; gap:46px;}
.about-row{display:grid; grid-template-columns:160px 1fr; gap:24px; border-top:1px solid rgba(255,255,255,0.25); padding-top:24px;}
.about-row p{color:#d8d6d2; line-height:1.65; font-size:0.98rem;}
.about-row .label-col{font-weight:700; letter-spacing:0.08em; font-size:0.85rem; text-transform:uppercase;}
.about-bottom{
  background:var(--mist); color:var(--ink);
  padding:90px 48px;
  display:grid; grid-template-columns:0.8fr 1.2fr; gap:48px;
}
.about-bottom h2{font-size:3.2rem; color:var(--ink); margin-bottom:22px;}
.about-bottom .lead{color:#555; line-height:1.7; font-size:1.05rem; max-width:380px;}
.cred{padding:18px 0; border-top:1px solid var(--mist-line);}
.cred:first-child{border-top:none;}
.cred h4{font-size:1.05rem; margin-bottom:4px;}
.cred span{display:block; color:#666; font-size:0.92rem;}
@media (max-width:900px){
  .about-top, .about-bottom{grid-template-columns:1fr;}
  .about-visual{height:300px;}
  .about-content{padding:48px 28px;}
}

/* ---------- PRODUCTS ---------- */
.products{
  background:var(--charcoal-soft);
  padding:90px 48px 100px;
}
.products h2{
  text-align:right; font-size:clamp(2.6rem,6vw,4.6rem); color:#fff; margin-bottom:70px;
}
.product-grid{
  display:grid; grid-template-columns:repeat(3,1fr); gap:48px 40px;
}
.product-card .year{color:#9a9a96; font-size:1rem; margin-bottom:2px;}
.product-card h3{font-family:'Archivo'; font-weight:700; font-size:1.25rem; color:#fff; margin-bottom:14px;}
.product-thumb{
  height:180px; border-radius:4px; margin-bottom:18px;
  position:relative; overflow:hidden;
}
.product-thumb span{
  position:absolute; inset:0;
  display:flex; align-items:flex-end; justify-content:flex-end;
  padding:10px 14px; font-size:0.7rem; letter-spacing:0.12em; text-transform:uppercase; color:rgba(255,255,255,0.85);
}
.product-card p{color:#b9b8b4; font-size:0.92rem; line-height:1.55;}
.empty-state{color:#b9b8b4; font-size:0.95rem; text-align:left;}
@media (max-width:900px){ .product-grid{grid-template-columns:1fr;} .products h2{text-align:left;} }

/* ---------- ACCOLADES ---------- */
.accolades{background:var(--mist); color:var(--ink); padding:100px 48px 80px;}
.accolades h2{font-size:clamp(2.4rem,5vw,3.6rem); margin-bottom:60px;}
.award-grid{
  display:grid; grid-template-columns:repeat(4,1fr); gap:40px 28px; margin-bottom:30px;
}
.award-grid.row2{grid-template-columns:repeat(3,1fr); max-width:900px; margin:0 auto;}
.award{text-align:center;}
.laurel{font-size:2.4rem; margin-bottom:10px;}
.award h4{font-size:0.92rem; text-transform:uppercase; letter-spacing:0.04em; margin-bottom:8px;}
.award p{font-size:0.86rem; color:#666; line-height:1.5;}
@media (max-width:900px){ .award-grid, .award-grid.row2{grid-template-columns:repeat(2,1fr);} }

.testimonials{background:#5d5b58; color:#fff; padding:100px 48px;}
.testimonials h2{font-size:clamp(2.4rem,5vw,3.6rem); margin-bottom:60px; color:#f2f0ec;}
.test-grid{display:grid; grid-template-columns:1fr 1fr; gap:48px 60px;}
.test-card{display:grid; grid-template-columns:100px 1fr; gap:20px;}
.test-avatar{
  width:100px; height:100px; border-radius:4px;
  background:linear-gradient(160deg, var(--lilac), #8d96a8);
}
.test-card h4{font-size:1.05rem; margin-bottom:2px;}
.test-card .role{color:#d8d6d2; font-size:0.88rem; margin-bottom:10px;}
.test-card p{color:#cfcdc9; font-size:0.92rem; line-height:1.55;}
@media (max-width:900px){ .test-grid{grid-template-columns:1fr;} }

/* ---------- CONTACT ---------- */
.contact{background:var(--charcoal-soft); padding:90px 48px 70px;}
.contact-visual{
  height:380px; border-radius:4px; margin-bottom:0;
  background:
    radial-gradient(circle at 70% 30%, rgba(205,182,218,0.3), transparent 55%),
    linear-gradient(135deg,#3a3733,#13243a);
  position:relative; overflow:hidden;
}
.contact-visual::after{
  content:"";
  position:absolute; bottom:-40%; left:-10%; width:60%; height:120%;
  background:radial-gradient(circle, rgba(255,255,255,0.08), transparent 70%);
}
.contact-box{
  border:1px solid rgba(255,255,255,0.18);
  margin-top:0;
  padding:64px 56px;
  display:grid; grid-template-columns:1fr 1fr; align-items:start; gap:40px;
}
.contact-box h2{font-size:clamp(2.4rem,6vw,3.6rem); color:#fff; margin-bottom:18px;}
.contact-info .eyebrow{margin-bottom:10px; display:block;}
.contact-info p{color:#d8d6d2; font-size:0.98rem; margin-bottom:6px;}

.contact-form{display:flex; flex-direction:column; gap:14px;}
.contact-form input, .contact-form textarea{
  background:rgba(255,255,255,0.06);
  border:1px solid rgba(255,255,255,0.25);
  color:#fff; padding:14px 16px; font-family:'Archivo'; font-size:0.92rem;
  border-radius:2px;
}
.contact-form input::placeholder, .contact-form textarea::placeholder{color:#9a9a96;}
.contact-form button{
  background:var(--lilac); color:#1c1c1c; border:none; padding:14px 20px;
  font-family:'Archivo'; font-weight:700; letter-spacing:0.05em; text-transform:uppercase;
  font-size:0.85rem; cursor:pointer; border-radius:2px; transition:opacity .2s;
}
.contact-form button:hover{opacity:0.85;}
.form-msg{padding:14px 16px; border-radius:2px; font-size:0.9rem; margin-bottom:14px;}
.form-msg.ok{background:rgba(205,182,218,0.18); border:1px solid var(--lilac);}
.form-msg.err{background:rgba(220,90,90,0.15); border:1px solid #d86c6c;}
@media (max-width:760px){ .contact-box{grid-template-columns:1fr;} }

footer{padding:30px 48px; text-align:center; color:#777; font-size:0.8rem; background:var(--charcoal-soft);}
