
:root{
  --wine:#8f1515;
  --wine-dark:#6e1010;
  --ink:#34271f;
  --brown:#5c3b2b;
  --sand:#efe1ce;
  --cream:#fffaf2;
  --paper:#fbf4e9;
  --line:#dcc9b0;
  --muted:#76685d;
  --max:1260px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--cream);color:var(--ink);font-family:Arial,Helvetica,sans-serif;line-height:1.55}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.topbar{background:#f7ecdc;border-bottom:1px solid var(--line);font-size:13px;color:#5f4a3d}
.topbar-inner{max-width:var(--max);margin:auto;padding:10px 24px;display:flex;gap:13px;align-items:center}
.topbar i{color:var(--wine);font-style:normal}
.topbar-right{margin-left:auto;display:flex;gap:26px;font-weight:700}
.site-header{position:sticky;top:0;z-index:30;background:rgba(255,250,242,.97);border-bottom:1px solid var(--line);backdrop-filter:blur(8px)}
.header-inner{max-width:var(--max);margin:auto;height:96px;padding:0 24px;display:grid;grid-template-columns:170px 1fr auto;align-items:center;gap:25px}
.brand{align-self:start;position:relative;z-index:4}
.brand img{width:150px;height:150px;object-fit:contain;background:#fff;border-radius:50%;padding:4px;box-shadow:0 5px 22px rgba(73,48,31,.10)}
.nav{display:flex;justify-content:center;gap:42px;font-family:Georgia,"Times New Roman",serif;font-size:17px;font-weight:700}
.nav a:hover{color:var(--wine)}
.menu-btn{display:none;border:0;background:transparent;font-size:28px;color:var(--wine)}
.btn{display:inline-flex;align-items:center;justify-content:center;padding:14px 24px;background:var(--wine);color:white;border:1px solid var(--wine);border-radius:3px;font-family:Georgia,"Times New Roman",serif;font-weight:700;text-transform:uppercase;letter-spacing:.3px;transition:.2s;cursor:pointer}
.btn:hover{background:var(--wine-dark);transform:translateY(-1px)}
.btn-header{min-width:170px}
.btn-outline{background:transparent;color:var(--wine);border-color:var(--wine)}
.btn-outline:hover{background:#fff1ea;color:var(--wine)}
.hero{display:grid;grid-template-columns:44% 56%;min-height:580px;border-bottom:1px solid var(--line);background:#fffaf2}
.hero-copy-wrap{display:flex;align-items:center;background:linear-gradient(90deg,#fffaf2 0%,#fffaf2 78%,rgba(255,250,242,.9) 90%,rgba(255,250,242,0) 100%);position:relative;z-index:2}
.hero-copy{padding:78px 46px 54px max(34px,calc((100vw - var(--max))/2 + 24px));max-width:650px}
.kicker{display:flex;align-items:center;gap:12px;color:var(--wine);font:700 12px Georgia,serif;letter-spacing:3px;margin-bottom:18px}
.kicker span{width:44px;height:1px;background:var(--wine)}
.hero h1{font-family:Georgia,"Times New Roman",serif;font-size:clamp(52px,5.6vw,84px);line-height:.92;margin:0 0 22px;text-transform:uppercase;letter-spacing:-2px;color:#372219}
.hero h1 em{font-style:normal;color:var(--wine)}
.hero-copy>p{font-family:Georgia,"Times New Roman",serif;font-size:18px;max-width:540px;color:#544235}
.hero-actions{display:flex;gap:14px;margin:28px 0 30px}
.hero-benefits{display:flex;gap:38px;border-top:1px solid #e4d7c7;padding-top:22px}
.hero-benefits div{display:flex;flex-direction:column}
.hero-benefits b{font-family:Georgia,serif;font-size:16px}
.hero-benefits span{font-size:13px;color:var(--muted)}
.hero-image{min-height:580px;background:url("assets/hero-rancho41.jpg") center/cover no-repeat;position:relative}
.hero-image:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(255,250,242,.88) 0%,rgba(255,250,242,.15) 18%,transparent 38%)}
.freshness{position:absolute;right:7%;bottom:5%;z-index:2;width:150px;height:150px;border-radius:50%;background:rgba(143,21,21,.94);color:white;border:5px double #f4d9cf;display:grid;place-items:center;text-align:center;font:700 15px Georgia,serif;line-height:1.5;box-shadow:0 9px 25px rgba(61,23,18,.24);transform:rotate(-4deg)}
.freshness strong{font-size:17px}
.freshness span{font-size:20px}
.catalog-section{padding:58px 24px 78px;max-width:var(--max);margin:auto}
.section-title{text-align:center;margin-bottom:34px}
.section-title p,.eyebrow{font:700 12px Georgia,serif;letter-spacing:3px;color:var(--wine);text-transform:uppercase;margin:0 0 8px}
.section-title h2,.story h2,.distributor h2,.contact h2{font-family:Georgia,"Times New Roman",serif;font-size:clamp(34px,4vw,54px);line-height:1.02;margin:0;color:#3a271d}
.catalog-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:16px}
.product-card{background:#f9eddc;border:1px solid var(--line);border-radius:9px;overflow:hidden;transition:.2s;box-shadow:0 8px 25px rgba(90,62,42,.05)}
.product-card:hover{transform:translateY(-4px);box-shadow:0 13px 30px rgba(90,62,42,.10)}
.product-name{font-family:Georgia,serif;font-weight:700;font-size:17px;padding:15px 16px;color:#4a2d20}
.product-name span{color:var(--wine);margin-right:7px}
.product-card img{width:100%;height:180px;object-fit:cover}
.product-link{padding:12px 16px;font-size:13px;font-weight:700;color:var(--wine)}
.story{background:#f1e2cf;border-block:1px solid #ddc8ad}
.story-inner{max-width:var(--max);margin:auto;padding:75px 24px;display:grid;grid-template-columns:270px 1fr;gap:70px;align-items:center}
.story-mark{width:235px;height:235px;border-radius:50%;display:grid;place-items:center;border:1px solid #cda98b;outline:12px solid rgba(143,21,21,.035);font:700 78px Georgia,serif;color:var(--wine);background:#fff8ef}
.story-inner>div:last-child p:last-child{font-family:Georgia,serif;font-size:19px;color:#645042;max-width:760px}
.section{max-width:var(--max);margin:auto;padding:82px 24px}
.steps-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-top:35px}
.steps-grid article{background:#fffaf2;border:1px solid var(--line);padding:28px;min-height:190px}
.steps-grid span{font:700 40px Georgia,serif;color:#caa98d}
.steps-grid h3{font:700 23px Georgia,serif;margin:5px 0;color:#3d281d}
.steps-grid p{color:#6f5d51}
.recipes{background:#fffdf8}
.recipe-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.recipe-strip article{padding:32px;border-top:3px solid var(--wine);background:#f8ecdc}
.recipe-strip span{font:700 12px Georgia,serif;color:var(--wine);letter-spacing:2px}
.recipe-strip h3{font:700 25px Georgia,serif;margin:10px 0 8px}
.distributor{display:grid;grid-template-columns:1fr .9fr;gap:60px;align-items:center}
.distributor>div:first-child>p:not(.eyebrow){font-family:Georgia,serif;font-size:18px;color:#665145}
.distributor ul{padding:0;list-style:none;margin:25px 0 30px}
.distributor li{padding:9px 0;border-bottom:1px solid #e5d5c4}
.distributor li:before{content:"✦";color:var(--wine);margin-right:10px}
.dist-card{min-height:430px;background:linear-gradient(140deg,#f1dfc9,#fff8ef);border:1px solid var(--line);padding:48px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.dist-card img{width:180px;margin-bottom:28px}
.dist-card h3{font:700 38px/1.1 Georgia,serif;color:#4b2d20;margin:0}
.contact{display:grid;grid-template-columns:.8fr 1.2fr;gap:70px;align-items:start;background:#f2e2cf;max-width:none;padding-left:max(24px,calc((100vw - var(--max))/2));padding-right:max(24px,calc((100vw - var(--max))/2))}
.contact>div>p:not(.eyebrow){font-family:Georgia,serif;font-size:18px;color:#665145}
.contact-form{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.contact-form label{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:#5b4438}
.contact-form .full{grid-column:1/-1}
.contact-form input,.contact-form select,.contact-form textarea{width:100%;margin-top:7px;padding:13px;border:1px solid #cdb79e;background:#fffdf9;font:inherit}
.contact-form button{width:max-content}
.form-status{grid-column:1/-1;color:var(--wine);margin:0}
footer{background:#4a2b20;color:#eadbce;text-align:center;padding:55px 24px}
footer img{width:100px;margin:0 auto 14px;background:white;border-radius:50%;padding:3px}
footer p{font-family:Georgia,serif}
.footer-links{display:flex;justify-content:center;gap:28px;margin:22px 0}
footer a:hover{color:white}
footer small{color:#cdb7a7}
@media(max-width:1000px){
  .header-inner{grid-template-columns:130px 1fr auto}
  .brand img{width:120px;height:120px}
  .nav{gap:22px;font-size:15px}
  .catalog-grid{grid-template-columns:repeat(3,1fr)}
  .hero{grid-template-columns:1fr}
  .hero-copy{max-width:none;padding-right:34px}
  .hero-image{min-height:430px}
  .hero-image:after{background:linear-gradient(180deg,rgba(255,250,242,.35),transparent 35%)}
}
@media(max-width:760px){
  .topbar{display:none}
  .header-inner{height:76px;grid-template-columns:72px 1fr auto;padding:0 16px}
  .brand img{width:82px;height:82px}
  .menu-btn{display:block;justify-self:end}
  .nav{display:none;position:absolute;top:76px;left:0;right:0;background:#fffaf2;border-bottom:1px solid var(--line);padding:22px;flex-direction:column;gap:15px}
  .nav.open{display:flex}
  .btn-header{display:none}
  .hero-copy{padding:66px 20px 42px}
  .hero h1{font-size:50px}
  .hero-actions,.hero-benefits{flex-direction:column;align-items:flex-start}
  .hero-benefits{gap:12px}
  .catalog-grid{grid-template-columns:1fr 1fr}
  .story-inner{grid-template-columns:1fr;text-align:center}
  .story-mark{margin:auto}
  .steps-grid,.recipe-strip,.distributor,.contact{grid-template-columns:1fr}
}
@media(max-width:480px){
  .catalog-grid{grid-template-columns:1fr}
  .hero h1{font-size:42px}
  .freshness{width:120px;height:120px;font-size:12px}
  .contact-form{grid-template-columns:1fr}
  .contact-form .full{grid-column:auto}
}
