/* Monterosoli's visual identity: original painted label art, EB Garamond headings and DM Sans text. */
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}

.serif,h1,h2,h3,.hero-sub,.product-index .label-link{
  font-family:'EB Garamond',Georgia,serif;
  font-weight:400;
  letter-spacing:-.035em;
}

/* Both wordmarks use a true transparent cutout of the actual bottle-label lettering. */
.brand{
  display:inline-flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
  width:185px;
  min-width:0;
  text-align:center;
  line-height:1;
  letter-spacing:normal;
}
.wordmark-window{
  position:relative;
  display:block;
  overflow:hidden;
  aspect-ratio:2172/270;
  flex:none;
}
.wordmark-window img{
  display:block;
  width:100%;
  height:auto;
  max-width:none;
  object-fit:contain;
  transform:translateY(-30.5%);
  filter:brightness(0) invert(1);
}
.wordmark-small{width:185px;max-width:100%}
.brand small{
  display:block;
  margin-top:4px;
  font:500 8px/1.2 'DM Sans',sans-serif;
  letter-spacing:.31em;
}
.brand small.brand-est{
  font-size:7px;
  margin-top:3px;
  letter-spacing:.25em;
  opacity:.78;
}

/* Restore the original elegant homepage title; only the navigation retains the painted label wordmark. */
.hero .hero-site-title{
  display:block;
  width:100%;
  max-width:none;
  font-family:'EB Garamond',Georgia,serif;
  font-weight:400;
  font-size:clamp(74px,11.2vw,166px);
  line-height:.98;
  letter-spacing:-.037em;
  margin:28px auto 20px;
}
.hero .wordmark-large{width:min(84vw,1010px)}
.hero .hero-sub{font-size:clamp(23px,2.7vw,38px);letter-spacing:-.025em}

/* The original hillside poppies photograph accompanies the estate's story. */
.intro.intro-poppy{
  display:grid;
  grid-template-columns:minmax(0,1.30fr) minmax(0,.70fr);
  align-items:center;
  column-gap:clamp(36px,5vw,85px);
  text-align:left;
  padding:100px 0 112px;
}
.intro-poppy .intro-text{min-width:0}
.intro-poppy h2{
  font-size:clamp(45px,5.7vw,83px);
  line-height:1.12;
  margin:23px 0 28px;
  max-width:none;
  letter-spacing:-.05em;
}
.intro-poppy .rule{margin:27px 0}
.intro-poppy p{margin:0;max-width:590px;line-height:1.85}
.poppy-art{display:flex;align-items:center;justify-content:center;min-width:0}
.poppy-art img{display:block;width:100%;height:auto;max-height:570px;object-fit:cover;aspect-ratio:4/5;border-radius:2px}

/* Keep long editorial headings balanced across desktop and mobile. */
.hero h1:not(.hero-site-title){font-size:clamp(52px,7vw,111px);line-height:1.08}
.feature-copy h2{font-size:clamp(48px,5vw,82px);line-height:1.13}
.product .copy h2{font-size:clamp(57px,5.5vw,89px);line-height:1.1}

@media(max-width:900px){
  .brand{width:170px}
  .wordmark-small{width:170px}
  .intro.intro-poppy{column-gap:28px}
}
@media(max-width:700px){
  .brand{width:152px}
  .wordmark-small{width:152px}
  .brand small{font-size:8px;margin-top:3px}
  .hero .wordmark-large{width:min(92vw,850px)}
  .hero .hero-site-title{margin:24px auto 28px}
  .hero .hero-site-title{font-size:clamp(58px,12.5vw,96px)}
  .intro.intro-poppy{display:flex;flex-direction:column;align-items:stretch;text-align:left;padding:76px 0 75px;gap:22px}
  .intro-poppy h2{font-size:clamp(43px,9vw,69px)}
  .intro-poppy p{font-size:15px;line-height:1.8}
  .poppy-art{width:min(75vw,330px);margin:0 auto}
  .poppy-art img{max-height:440px}
  .hero h1:not(.hero-site-title){font-size:clamp(47px,10vw,78px)}
  .feature-copy h2{font-size:clamp(48px,10vw,72px)}
}

/* EB Garamond creates one consistent editorial voice across all pages.
   The hand-painted label wordmark and DM Sans supporting text stay unchanged. */
.serif,h1,h2,h3,.hero-sub,.hero p,.product-index .label-link,
.hero .hero-site-title,.film-copy h2,.quote-section blockquote,
.stat strong,.facts strong,.three a,.honey-visual .mark strong,
.exp-card .number,.journal h2,.journal-card h3,.contact h2{
  font-family:'EB Garamond',Georgia,serif!important;
  font-weight:400;
  letter-spacing:-.028em;
}
.hero .hero-site-title{
  font-size:clamp(76px,10.9vw,165px);
  line-height:.96;
  letter-spacing:-.044em;
}
.intro-poppy h2{line-height:1.075}

/* Three shades drawn from the Tuscan landscape. The original dark olive
   sections, photography and painted product labels remain untouched. */
:root{
  --ivory:#f7f2e7;
  --white:#f7f2e7;
  --cream:#eee2d1;
  --monterosoli-sage:#e6ebe1;
  --monterosoli-limestone:#eee2d1;
}
body,
.quote-section,
.location,
.image-pair,
.opening,
.details{
  background-color:var(--ivory);
}

/* Homepage: parchment and sage alternate between editorial sections. */
.feature,
.journal,
.rooms{
  background:var(--monterosoli-limestone);
}
.feature.reverse,
.film-section,
.contact{
  background:var(--monterosoli-sage);
}
.journal-card{background:var(--ivory)}
.location-map{background:var(--monterosoli-sage)}

/* Repeat the estate's real historic survey on the two land-history panels.
   Each panel shows a different rotated portion of the map, underneath the copy. */
.feature .feature-copy{
  position:relative;
  isolation:isolate;
  overflow:hidden;
}
.feature .feature-copy::before{
  content:'';
  position:absolute;
  z-index:0;
  inset:-18%;
  background:url('monterosoli-historic-map-restored.png') left center/cover no-repeat;
  opacity:.17;
  transform:rotate(-6deg) scale(1.05);
  pointer-events:none;
}
.feature.reverse .feature-copy::before{
  background-position:right center;
  opacity:.18;
  transform:rotate(7deg) scale(1.05);
}
.feature .feature-copy > *{position:relative;z-index:1}

/* The homepage uses its original hero photograph and original framing.
   Only the longer new tagline needs a little typographic accommodation. */
.hero .hero-sub{
  max-width:960px;
  margin:0 auto 36px;
  font-size:clamp(23px,2.4vw,34px);
  line-height:1.16;
  text-wrap:balance;
}
@media(max-width:800px){
  .hero .hero-sub{
    font-size:clamp(21px,5.3vw,28px);
    margin-bottom:28px;
  }
}

/* Products: the three label artworks remain the brightest colors. */
.pledge,
.image-pair{background:var(--monterosoli-sage)}
.wine .copy,
.honey .copy{background:var(--monterosoli-limestone)}
.oil .copy{background:var(--monterosoli-sage)}
.product-index .label-image,
.product-index .wine-label-frame{background:var(--monterosoli-limestone)}

/* Experiences and the apartment: warm intervals with gentle green accents. */
.experiences{background:var(--monterosoli-limestone)}
.exp-card{background:var(--ivory)}
.exp-card:nth-child(2){background:var(--monterosoli-sage)}
.exp-card:nth-child(3){background:var(--monterosoli-limestone)}
.exp-card:nth-child(4){background:var(--ivory)}
.end{background:var(--monterosoli-sage)}

/* Apartment: explicit image height prevents the portrait photo expanding the whole row. */
.pool.pool-compact{height:470px;min-height:0}
.pool.pool-compact .pool-copy{padding:clamp(32px,3.7vw,54px)}
.pool.pool-compact h2{font-size:clamp(44px,4.2vw,64px);margin:14px 0}
.pool.pool-compact p{line-height:1.75;margin:0}
.pool.pool-compact img{height:100%;min-height:0;object-position:center 60%}
@media(max-width:800px){
  .pool.pool-compact{height:auto;min-height:0}
  .pool.pool-compact .pool-copy{padding:42px 26px 46px}
  .pool.pool-compact img{height:320px;min-height:0;max-height:none}
}

/* Experiences: explicitly crop the tall original photo around the flowers. */
.experiences-page .land{height:520px;min-height:0}
.experiences-page .land img{height:100%;min-height:0;object-position:center 54%}
.experiences-page .land-copy{padding:44px clamp(30px,3.5vw,54px)}
.experiences-page .land h2{font-size:clamp(48px,4.1vw,63px)}
@media(max-width:800px){
  .experiences-page .land{height:auto;min-height:0}
  .experiences-page .land img{height:340px;min-height:0}
  .experiences-page .land-copy{padding:44px 28px}
}

/* Unique hero imagery for the products and experiences pages. */
.products-page .hero:before{
  background:linear-gradient(180deg,rgba(11,29,39,.40),rgba(11,29,39,.48) 46%,rgba(11,29,39,.57)),url('monterosoli-misty-valdera-hero.jpeg') center 53%/cover;
  filter:none;
}
@media(max-width:700px){
  .products-page .hero:before{
    background:linear-gradient(180deg,rgba(11,29,39,.36),rgba(11,29,39,.61) 53%,rgba(11,29,39,.66)),url('monterosoli-misty-valdera-hero.jpeg') center 56%/cover;
  }
}
.experiences-page .land img{
  object-position:center 54%;
  filter:brightness(1.035) saturate(1.05);
}
/* Keep the farmhouse plan and the original 'Monterosoli P.' name legible
   behind the story; the modern scan overlay was removed from this image. */
.intro.intro-poppy.intro-history-map{position:relative;isolation:isolate}
.intro-history-map::before{
  content:'';
  position:absolute;
  z-index:-1;
  top:0;
  bottom:0;
  left:50%;
  width:100vw;
  transform:translateX(-50%);
  background:linear-gradient(90deg,rgba(247,242,231,.77) 0%,rgba(247,242,231,.56) 52%,rgba(247,242,231,.66) 100%),url('monterosoli-historic-map-restored.png') 88% 95%/auto 120% no-repeat;
  pointer-events:none;
}
html,body{overflow-x:clip}

/* The Experiences opening features the real truffle-pasta dinner photo. */
.experiences-page .hero{
  background-image:url('monterosoli-truffle-pasta-hero-clean.png');
  background-position:center bottom;
}
.experiences-page .hero::before{
  background:linear-gradient(180deg,rgba(11,26,28,.36),rgba(11,26,28,.10) 43%,rgba(11,26,28,.39));
}
.experiences-page .hero h1,
.experiences-page .hero p{text-shadow:0 2px 15px rgba(8,24,20,.72)}
/* On phones, the three estate product labels should read as one collection. */
@media(max-width:520px){
  .three.product-index{
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:7px;
    margin-top:32px;
  }
  .product-index a{gap:8px;padding:0 0 8px}
  .product-index .label-image,
  .product-index .wine-label-frame{
    height:auto;
    aspect-ratio:1;
    min-height:0;
    padding:5px;
  }
  .product-index .label-link{
    align-items:flex-start;
    gap:2px;
    padding:8px 0 0;
    line-height:1.2;
    font-size:clamp(11px,3vw,14px);
  }
  .product-index .label-link .arrow{font-size:12px}
}
.contact{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  min-height:610px;
  padding:100px 24px 110px;
  background:#445450;
  color:#fff;
}
.contact::before,
.contact::after{
  content:'';
  position:absolute;
  inset:0;
  pointer-events:none;
}
.contact::before{
  z-index:0;
  background:url('monterosoli-terrace-sunset.jpeg') center 53%/cover no-repeat;
  filter:brightness(1.08) saturate(1.05);
}
.contact::after{
  z-index:1;
  background:linear-gradient(180deg,rgba(12,29,32,.15),rgba(12,29,32,.23) 56%,rgba(12,29,32,.30));
}
.contact > *{position:relative;z-index:2}
.contact h2,.contact .eyebrow,.contact p,.contact .text-link{
  color:#fff;
  text-shadow:0 2px 10px rgba(8,22,26,.55);
}
.contact .eyebrow{color:#fff5db}
.contact p{font-weight:500}
.contact .dark-btn{
  background:#f7f2e7;
  border-color:#f7f2e7;
  color:#28392d;
  text-shadow:none;
}
.contact .dark-btn:hover{background:transparent;color:#fff}
.contact .text-link{border-bottom-color:#fff9}
@media(max-width:700px){
  .contact{min-height:650px;padding:90px 24px 100px}
  .contact::before{background-position:center 48%}
  .experiences-page .hero{background-position:center bottom}
  /* Keep the Experiences title and its small introductory line truly centered
     inside a narrow phone viewport, regardless of the long title width. */
  .experiences-page .hero > div{
    width:100%;
    max-width:100%;
    min-width:0;
    box-sizing:border-box;
    padding:110px 18px 12px;
    text-align:center;
  }
  .experiences-page .hero .eyebrow{
    display:block;
    width:100%;
    margin:0 auto;
    font-size:10px;
    line-height:1.6;
    letter-spacing:.14em;
    text-align:center;
  }
  .experiences-page .hero h1{
    font-size:clamp(42px,10.5vw,68px);
    margin:18px auto 22px;
  }
}

@media(max-width:520px){
  /* All three label tiles share identical outer and inner square dimensions. */
  .products-page .product-index .label-image,
  .products-page .product-index .wine-label-frame{
    display:block;
    width:100%;
    height:auto;
    aspect-ratio:1 / 1;
    min-width:0;
    min-height:0;
    padding:5px;
    margin:0;
    box-sizing:border-box;
  }
  .products-page .product-index .wine-label-art{
    display:block;
    width:100%;
    height:100%;
    aspect-ratio:1 / 1;
    max-width:none;
  }
}

/* Reveal a little more of the genuine blue sky in the original Rosso photo. */
.products-page .wine .visual > img{object-position:center 27%}