*{box-sizing:border-box}
:root{
  --ink:#11110f;
  --sage:#8f9f70;
  --sage-dark:#718057;
  --sage-light:#edf0e6;
  --cream:#fbfaf5;
  --paper:#fffefb;
  --warm:#c06f36;
  --muted:#69685f;
  --line:#dddcd3;
}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--cream);
  color:var(--ink);
  font-family:"DM Sans",sans-serif;
}
a{color:inherit}
img{max-width:100%;display:block}
.site-header{
  min-height:92px;
  padding:10px 4vw;
  display:grid;
  grid-template-columns:240px 1fr auto;
  align-items:center;
  gap:30px;
  position:sticky;
  top:0;
  z-index:50;
  background:rgba(251,250,245,.96);
  border-bottom:1px solid rgba(17,17,15,.08);
  backdrop-filter:blur(15px);
}
.logo-link img{
  width:205px;
  height:64px;
  object-fit:contain;
  object-position:left center;
}
.main-nav{
  justify-self:center;
  display:flex;
  gap:42px;
}
.main-nav a{
  text-decoration:none;
  text-transform:uppercase;
  letter-spacing:.09em;
  font-size:.78rem;
  font-weight:700;
  padding:10px 0;
  position:relative;
}
.main-nav a:hover,.main-nav a.active{color:var(--sage-dark)}
.main-nav a.active:after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:2px;
  height:2px;
  background:var(--sage);
}
.header-actions{display:flex;align-items:center;gap:12px}
.social-icon{
  width:37px;height:37px;
  display:grid;place-items:center;
  border:1px solid var(--line);
  border-radius:50%;
  text-decoration:none;
  font-size:.72rem;
  font-weight:800;
}
.social-icon:hover{border-color:var(--sage);color:var(--sage-dark)}
.work-button,.primary-button,.outline-button,.light-button{
  text-decoration:none;
  font-weight:700;
  border-radius:8px;
  display:inline-flex;
  align-items:center;
  gap:12px;
  transition:.2s ease;
}
.work-button{
  padding:12px 18px;
  background:var(--sage-dark);
  color:white;
  text-transform:uppercase;
  letter-spacing:.05em;
  font-size:.76rem;
}
.work-button:hover,.primary-button:hover{transform:translateY(-2px);background:#66734e}
.menu-button{display:none;border:0;background:none;font-size:1.4rem}
.hero{
  min-height:650px;
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  align-items:center;
  gap:4vw;
  padding:55px 5vw 35px;
}
.hero-copy{padding-left:1vw}
.script-tagline{
  margin:0 0 14px;
  color:var(--sage-dark);
  font-family:"Playfair Display",serif;
  font-style:italic;
  font-weight:700;
  font-size:1.35rem;
}
.hero h1{
  margin:0;
  font-family:"Playfair Display",serif;
  font-size:clamp(4.3rem,7.1vw,7.7rem);
  line-height:.92;
  letter-spacing:-.055em;
}
.sage-stroke{
  width:180px;
  height:8px;
  margin:28px 0 24px;
  border-radius:100%;
  background:var(--sage);
  transform:skewX(-25deg);
}
.hero-text{
  max-width:570px;
  font-size:1.1rem;
  line-height:1.65;
  color:#45443e;
  margin-bottom:30px;
}
.primary-button{
  padding:15px 22px;
  background:var(--sage-dark);
  color:white;
  text-transform:uppercase;
  letter-spacing:.06em;
  font-size:.83rem;
}
.hero-art{
  display:flex;
  justify-content:center;
  align-items:center;
}
.hero-art img{
  width:min(650px,100%);
  mix-blend-mode:multiply;
}
.recipes-section{padding:55px 4vw 80px;background:var(--paper)}
.section-title-row{
  display:flex;
  justify-content:space-between;
  align-items:end;
  gap:30px;
  margin-bottom:30px;
}
.kicker{
  text-transform:uppercase;
  letter-spacing:.16em;
  font-size:.72rem;
  font-weight:800;
  color:var(--sage-dark);
  margin:0 0 8px;
}
.section-title-row h2,.about-copy h2,.drinks-banner h2{
  font-family:"Playfair Display",serif;
  font-size:clamp(2.6rem,4vw,4.6rem);
  line-height:1;
  letter-spacing:-.04em;
  margin:0;
}
.filters{display:flex;gap:8px;flex-wrap:wrap}
.filter{
  border:1px solid var(--line);
  background:white;
  border-radius:999px;
  padding:9px 14px;
  font-family:inherit;
  font-weight:700;
  cursor:pointer;
}
.filter.active,.filter:hover{
  background:var(--sage-dark);
  border-color:var(--sage-dark);
  color:white;
}
.recipe-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:22px;
}
.recipe-card{
  background:white;
  border:1px solid var(--line);
  border-radius:16px;
  overflow:hidden;
  transition:.2s ease;
}
.recipe-card:hover{
  transform:translateY(-5px);
  box-shadow:0 16px 35px rgba(34,38,28,.10);
}
.recipe-image{
  display:block;
  aspect-ratio:4/3;
  overflow:hidden;
  background:#f2f1ea;
}
.recipe-image img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  transition:transform .3s ease;
}
.recipe-card:hover .recipe-image img{transform:scale(1.025)}
.card-placeholder{
  height:100%;
  display:grid;
  place-content:center;
  gap:8px;
  padding:25px;
  text-align:center;
  background:var(--sage-light);
  color:var(--sage-dark);
}
.card-placeholder span{
  font-family:"Playfair Display",serif;
  font-size:1.4rem;
  font-weight:700;
}
.card-placeholder small{text-transform:uppercase;letter-spacing:.1em}
.recipe-card-body{padding:18px 18px 20px}
.category{
  margin:0 0 8px;
  text-transform:uppercase;
  letter-spacing:.12em;
  font-size:.68rem;
  font-weight:800;
  color:var(--sage-dark);
}
.recipe-card h3{
  font-family:"Playfair Display",serif;
  font-size:1.65rem;
  line-height:1.07;
  margin:0 0 10px;
}
.recipe-card h3 a{text-decoration:none}
.recipe-desc{color:var(--muted);line-height:1.5;margin:0 0 14px;font-size:.93rem}
.text-link{font-size:.87rem;font-weight:800;text-decoration:none}
.text-link span{color:var(--sage-dark)}
.feature-strip{
  margin:0 4vw 85px;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:0;
  border:1px solid #dfe3d5;
  border-radius:16px;
  background:linear-gradient(90deg,#f2f4ed,#e8eddf);
}
.feature{
  min-height:110px;
  display:flex;
  gap:14px;
  align-items:center;
  padding:20px 24px;
  border-right:1px solid #d7ddcc;
}
.feature:last-child{border-right:0}
.feature-icon{
  width:46px;height:46px;
  flex:0 0 46px;
  display:grid;place-items:center;
  border:1px solid var(--sage-dark);
  border-radius:50%;
  color:var(--sage-dark);
  font-size:1.25rem;
}
.feature strong{
  text-transform:uppercase;
  letter-spacing:.06em;
  font-size:.75rem;
}
.feature p{margin:4px 0 0;color:var(--muted);font-size:.82rem;line-height:1.4}
.about-section{
  padding:85px 6vw;
  display:grid;
  grid-template-columns:1fr 1fr;
  align-items:center;
  gap:6vw;
  background:#f1f2eb;
}
.about-art img{mix-blend-mode:multiply}
.about-copy p:not(.kicker){
  max-width:610px;
  line-height:1.7;
  font-size:1.04rem;
  color:#4f4e47;
}
.outline-button{
  margin-top:15px;
  padding:13px 19px;
  border:1px solid var(--sage-dark);
  color:var(--sage-dark);
}
.outline-button:hover{background:var(--sage-dark);color:white}
.drinks-banner{
  margin:0;
  padding:65px 6vw;
  display:flex;
  justify-content:space-between;
  align-items:end;
  gap:30px;
  background:var(--sage-dark);
  color:white;
}
.drinks-banner p:not(.kicker){max-width:700px;line-height:1.6;color:#edf0e6}
.light-kicker{color:#eaf0df}
.light-button{
  padding:14px 20px;
  border:1px solid rgba(255,255,255,.8);
  white-space:nowrap;
}
.light-button:hover{background:white;color:var(--sage-dark)}
footer{
  padding:36px 4vw;
  display:grid;
  grid-template-columns:1fr auto auto;
  align-items:center;
  gap:35px;
  background:var(--cream);
  border-top:1px solid var(--line);
}
.footer-brand img{width:165px;height:55px;object-fit:contain;object-position:left}
.footer-brand p{margin:0;color:var(--muted);font-size:.8rem}
.footer-links{display:flex;gap:20px}
.footer-links a{text-decoration:none;font-size:.85rem;font-weight:700}
.copyright{font-size:.8rem;color:var(--muted)}

/* Recipe detail pages */
.recipe-page-wrap{background:var(--paper)}
.recipe-hero{
  max-width:1180px;
  margin:auto;
  padding:65px 5vw 35px;
  display:grid;
  grid-template-columns:1fr .85fr;
  align-items:center;
  gap:60px;
}
.recipe-label{
  text-transform:uppercase;
  letter-spacing:.14em;
  font-size:.72rem;
  color:var(--sage-dark);
  font-weight:800;
}
.recipe-title{
  font-family:"Playfair Display",serif;
  font-size:clamp(3.4rem,6vw,6rem);
  line-height:.96;
  letter-spacing:-.045em;
  margin:12px 0 20px;
}
.recipe-lead{color:var(--muted);line-height:1.65;font-size:1.08rem}
.recipe-cover{
  border-radius:22px;
  overflow:hidden;
  background:var(--sage-light);
  aspect-ratio:4/3;
}
.recipe-cover img{width:100%;height:100%;object-fit:cover}
.recipe-content{
  max-width:1100px;
  margin:auto;
  padding:45px 5vw 100px;
  display:grid;
  grid-template-columns:.75fr 1.25fr;
  gap:80px;
}
.recipe-content h2{
  font-family:"Playfair Display",serif;
  font-size:2.5rem;
}
.ingredient-group{margin-bottom:30px}
.ingredient-group h3{
  font-family:"Playfair Display",serif;
  font-size:1.35rem;
  margin-bottom:10px;
}
.ingredients{padding-left:18px}
.ingredients li{margin-bottom:10px;line-height:1.5}
.method-note{
  padding:25px;
  border-radius:14px;
  background:var(--sage-light);
  border:1px solid #dbe1d0;
  line-height:1.65;
}
.back-link{
  display:inline-block;
  margin-bottom:20px;
  font-weight:800;
  color:var(--sage-dark);
  text-decoration:none;
}

@media(max-width:1050px){
  .site-header{grid-template-columns:200px 1fr auto}
  .main-nav{gap:22px}
  .work-button{display:none}
  .recipe-grid{grid-template-columns:repeat(2,1fr)}
  .feature-strip{grid-template-columns:repeat(2,1fr)}
  .feature:nth-child(2){border-right:0}
  .feature:nth-child(-n+2){border-bottom:1px solid #d7ddcc}
}
@media(max-width:780px){
  .site-header{grid-template-columns:1fr auto;padding:8px 5vw}
  .logo-link img{width:170px}
  .menu-button{display:block}
  .main-nav{
    display:none;
    position:absolute;
    top:82px;left:0;right:0;
    padding:25px 5vw;
    background:var(--cream);
    flex-direction:column;
    border-bottom:1px solid var(--line)
  }
  .main-nav.open{display:flex}
  .header-actions{display:none}
  .hero{grid-template-columns:1fr;padding-top:55px}
  .hero-copy{text-align:center;padding:0}
  .hero-text{margin-left:auto;margin-right:auto}
  .sage-stroke{margin-left:auto;margin-right:auto}
  .hero-art img{width:min(520px,100%)}
  .section-title-row{align-items:flex-start;flex-direction:column}
  .recipe-grid{grid-template-columns:1fr}
  .feature-strip{grid-template-columns:1fr;margin-inline:5vw}
  .feature{border-right:0;border-bottom:1px solid #d7ddcc}
  .feature:last-child{border-bottom:0}
  .about-section{grid-template-columns:1fr}
  .drinks-banner{align-items:flex-start;flex-direction:column}
  footer{grid-template-columns:1fr;align-items:start}
  .recipe-hero,.recipe-content{grid-template-columns:1fr}
}


/* V5.1 — Instagram-linked recipe covers */
.recipe-image {
  position: relative;
  display: block;
  overflow: hidden;
}
.recipe-image img,
.recipe-image .card-placeholder {
  transition: transform .25s ease, filter .25s ease;
}
.recipe-image:hover img,
.recipe-image:hover .card-placeholder {
  transform: scale(1.025);
  filter: brightness(.88);
}
.instagram-cover-label {
  position: absolute;
  left: 14px;
  bottom: 14px;
  z-index: 3;
  padding: 8px 11px;
  border-radius: 999px;
  background: rgba(255,255,255,.94);
  color: #181713;
  font-size: .72rem;
  line-height: 1;
  font-weight: 800;
  letter-spacing: .02em;
  box-shadow: 0 3px 12px rgba(0,0,0,.12);
}
.instagram-recipe-button {
  display: inline-block;
  margin: 14px 0 24px;
  padding: 11px 16px;
  border: 1.5px solid currentColor;
  border-radius: 999px;
  text-decoration: none;
  font-weight: 800;
}
.instagram-recipe-button:hover {
  transform: translateY(-1px);
}