:root{--cream:#fff4dc;--gold:#e6aa55;--dark:#1b0f0c}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--dark)}body{font-family:Arial,Helvetica,sans-serif;color:#fff}
.hero{position:relative;isolation:isolate;min-height:100svh;overflow:hidden;display:flex;align-items:center;padding:clamp(28px,5vw,88px)}
.hero__art{position:absolute;inset:0;z-index:-3;background-image:url('assets/juana-sip-hero.png');background-size:cover;background-position:center center;transform:scale(1.002)}
.hero__shade{position:absolute;inset:0;z-index:-2;background:linear-gradient(90deg,rgba(20,10,6,.78) 0%,rgba(20,10,6,.52) 27%,rgba(20,10,6,.08) 53%,rgba(20,10,6,.04) 100%)}
.announcement{width:min(560px,42vw);padding:clamp(22px,3vw,42px);background:linear-gradient(135deg,rgba(20,10,7,.50),rgba(20,10,7,.18));border:1px solid rgba(255,255,255,.16);backdrop-filter:blur(9px);-webkit-backdrop-filter:blur(9px);box-shadow:0 20px 70px rgba(0,0,0,.22)}
.announcement__logo{display:block;width:clamp(104px,10vw,145px);height:auto;margin:0 auto 20px;object-fit:contain}
.eyebrow{margin:0 0 12px;text-transform:uppercase;letter-spacing:.28em;font-size:12px;font-weight:700;color:var(--gold)}
h1{font-family:Georgia,'Times New Roman',serif;font-weight:400;font-size:clamp(48px,5.6vw,88px);line-height:.91;letter-spacing:-.045em;margin:0 0 24px;color:var(--cream);text-wrap:balance}
.lead{font-size:clamp(15px,1.2vw,19px);line-height:1.6;margin:0;color:rgba(255,255,255,.9);max-width:48ch}.lead strong{color:#fff}
.products{display:flex;align-items:center;gap:12px;margin-top:26px;text-transform:uppercase;letter-spacing:.12em;font-size:11px;font-weight:700;color:var(--cream)}.products i{width:24px;height:1px;background:var(--gold)}
.coming{font-family:Georgia,'Times New Roman',serif;font-style:italic;font-size:22px;color:var(--gold);margin:18px 0 0}
footer{position:absolute;left:clamp(28px,5vw,88px);right:clamp(28px,5vw,88px);bottom:24px;display:flex;justify-content:space-between;align-items:center;font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:rgba(255,255,255,.7)}
@media (max-width:900px){
  .hero{min-height:0;display:flex;flex-direction:column;align-items:stretch;padding:0;overflow:visible}
  .hero__art{position:relative;inset:auto;z-index:auto;flex:none;width:100%;aspect-ratio:3/2;background-size:cover;background-position:center;transform:none}
  .hero__shade{display:none}
  .announcement{width:100%;max-width:none;padding:clamp(26px,6vw,48px);background:#26140f;border:0;backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:none}
  .announcement__logo{width:125px;margin:0 auto 20px}
  .announcement h1{font-size:clamp(44px,9vw,68px)}
  footer{position:static;padding:18px clamp(26px,6vw,48px) 24px;background:#26140f}
}
@media (max-width:560px){.lead{font-size:15px}.products{flex-wrap:wrap;gap:8px}.products i{width:14px}footer span:last-child{display:none}}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}

/* Contact page */
a{color:inherit}
footer a{text-decoration:none;color:rgba(255,255,255,.88);font-size:12px;letter-spacing:.14em}
a:hover{text-decoration:underline}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.contact-page{min-height:100svh;position:relative;isolation:isolate;background:#26140f;color:var(--cream)}
.contact-page::before{content:"";position:fixed;z-index:-2;inset:0;background:url('assets/juana-sip-hero.png') center/cover no-repeat;filter:blur(11px) brightness(.42);transform:scale(1.04)}
.contact-page::after{content:"";position:fixed;z-index:-1;inset:0;background:linear-gradient(110deg,rgba(25,12,8,.62),rgba(25,12,8,.35))}
.contact-header{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;padding:26px clamp(24px,5vw,88px)}
.contact-brand{display:block;width:74px;flex:none}.contact-brand img{display:block;width:100%;height:auto}
.home-link{margin-top:10px;text-decoration:none;text-transform:uppercase;letter-spacing:.16em;font-weight:700;font-size:12px}
.contact-main{width:min(1200px,100%);min-height:calc(100svh - 200px);margin:auto;padding:28px clamp(24px,5vw,64px) 72px;display:grid;grid-template-columns:minmax(0,1fr) minmax(360px,520px);align-items:center;gap:clamp(35px,6vw,100px)}
.contact-intro h1,.thanks-main h1{font-size:clamp(56px,7vw,104px);margin:0 0 22px}
.contact-intro>p:last-child{max-width:400px;font-size:clamp(17px,1.5vw,21px);line-height:1.6;color:#fff9ef}
.contact-card{padding:clamp(27px,4vw,46px);background:rgba(27,15,12,.78);border:1px solid rgba(255,255,255,.20);box-shadow:0 25px 70px rgba(0,0,0,.25);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:18px}.field{margin:0 0 20px}.field label{display:block;margin-bottom:9px;font-size:13px;font-weight:700;letter-spacing:.09em;text-transform:uppercase}
.field input,.field textarea{display:block;width:100%;border:1px solid #ad9a8c;border-radius:0;background:rgba(255,250,242,.95);color:#21120e;padding:13px 14px;font:inherit;font-size:16px;line-height:1.4}
.field textarea{min-height:140px;resize:vertical}.field input:focus,.field textarea:focus{border-color:var(--gold)}
.honeypot{position:absolute;left:-9999px;overflow:hidden;width:1px;height:1px}
button,.button-link{display:inline-block;border:1px solid var(--gold);border-radius:0;background:var(--gold);padding:15px 24px;color:#25130d;font:700 13px Arial,Helvetica,sans-serif;letter-spacing:.15em;text-decoration:none;text-transform:uppercase;cursor:pointer}
button:hover,.button-link:hover{background:var(--cream);border-color:var(--cream);text-decoration:none}
.contact-footer{position:static;padding:24px clamp(24px,5vw,88px);background:transparent}
.thanks-main{min-height:calc(100svh - 200px);display:grid;place-items:center;padding:25px}.thanks-main .contact-card{max-width:650px;width:100%}.thanks-main h1{font-size:clamp(42px,6vw,76px)}.thanks-main p:not(.eyebrow){font-size:18px;line-height:1.5}.thanks-main .button-link{margin-top:16px}
@media(max-width:900px){.contact-main{grid-template-columns:1fr;gap:25px;padding-top:15px}.contact-intro h1{font-size:clamp(48px,10vw,76px)}.contact-footer{display:flex;background:transparent}}
@media(max-width:560px){.contact-header{padding-top:18px}.contact-brand{width:62px}.field-row{grid-template-columns:1fr;gap:0}.contact-main{padding-bottom:45px}.contact-card{padding:25px}.contact-footer span:last-child{display:block}}
