/* HERO transplanted from supplied prohozhiy.zip; scope prevents interference with other sections. */
.ref-hero{
  --ref-ink:#243522;--ref-paper:#f3ece2;--ref-olive:#646746;
  position:relative;isolation:isolate;overflow:hidden;
  height:160.25vw;max-width:none;color:var(--ref-ink);
  background:var(--ref-paper);font-family:Georgia,"Times New Roman",serif;
}
.ref-hero::before{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:url("assets/paper-texture.webp") center/650px repeat;opacity:.28;
}
.ref-hero .ref-copy{position:relative;z-index:2;padding:2.8vw 5.5vw 0}
.ref-hero h1{
  font-family:"Times New Roman",serif;font-size:14.05vw;
  line-height:.79;letter-spacing:-.055em;font-weight:400;
  margin:0 0 5.6vw;max-width:none;text-wrap:initial;
  color:var(--ref-ink);
}
.ref-hero .ref-rule{width:9.35vw;height:1px;background:#bf8a27;margin:0 0 3.2vw 2vw}
.ref-hero .ref-description{
  font-family:Georgia,"Times New Roman",serif;font-size:4.22vw;
  line-height:1.14;letter-spacing:-.015em;margin:0 0 6.5vw 1.8vw;
  color:var(--ref-ink);max-width:none;
}
.ref-hero .ref-desktop-break{display:initial}
.ref-hero .ref-cta{
  display:flex;align-items:center;justify-content:center;
  font-family:Georgia,"Times New Roman",serif;
  font-weight:400;font-size:4.45vw;line-height:1.2;
  width:51.8vw;min-height:0;height:10.6vw;padding:0;
  border-radius:70px;gap:3.1vw;background:var(--ref-ink);
  color:var(--ref-paper);white-space:nowrap;text-decoration:none;
  transition:background-color .18s ease;box-shadow:none;
}
.ref-hero .ref-cta:hover{background:#41513b}
.ref-hero .ref-cta span{font-size:4.6vw}
.ref-hero .ref-price{
  font-family:Georgia,"Times New Roman",serif;font-size:3.5vw;
  line-height:1.4;margin:2.3vw 0 0 1.8vw;letter-spacing:.025em;
  color:var(--ref-ink);
}
.ref-hero .ref-portrait{
  position:absolute;z-index:1;width:100vw;max-width:none;height:auto;
  right:-24vw;bottom:-1vw;
  mask-image:linear-gradient(to bottom,transparent,#000 7%);
  -webkit-mask-image:linear-gradient(to bottom,transparent,#000 7%);
}
.ref-hero .ref-leaves{
  position:absolute;z-index:4;max-width:none;width:80vw;height:auto;
  left:0;bottom:0;pointer-events:none;display:block;opacity:1;
  mask-image:none!important;-webkit-mask-image:none!important;
  clip-path:none!important;
}
@media(min-width:1001px){
 .ref-hero{height:800px;max-width:1800px;margin:auto}
 .ref-hero .ref-copy{padding:40px 6%}
 .ref-hero h1{font-size:112px;line-height:.87;margin-bottom:35px}
 .ref-hero .ref-rule{width:75px;margin:0 0 25px 5px}
 .ref-hero .ref-description{font-size:28px;line-height:1.15;margin:0 0 35px 5px}
 .ref-hero .ref-cta{width:340px;height:65px;font-size:28px;gap:24px}
 .ref-hero .ref-cta span{font-size:30px}
 .ref-hero .ref-price{font-size:23px;margin:15px 0 0 5px}
 .ref-hero .ref-portrait{width:760px;right:-30px;bottom:-110px}
 .ref-hero .ref-leaves{width:720px;left:-20px;bottom:20px}
}
@media(max-width:600px){
 .ref-hero{height:176vw}
 .ref-hero .ref-portrait{
   content:url("assets/hero-mobile.png");width:122vw;right:-25vw;bottom:-2vw;
   mask-image:linear-gradient(to bottom,transparent,#000 5%);
   -webkit-mask-image:linear-gradient(to bottom,transparent,#000 5%);
 }
 .ref-hero .ref-leaves{width:158vw;left:-15vw;bottom:0}
}
@media(min-width:601px) and (max-width:1000px){
 .ref-hero .ref-portrait{
  content:url("assets/hero-cutout.png");width:112vw;right:-20vw;bottom:-6vw
 }
 .ref-hero .ref-leaves{width:104vw;left:-8vw;bottom:8vw}
}
@media(prefers-reduced-motion:reduce){.ref-hero .ref-cta{transition:none}}

/* V4.1: the left botanical-paper collage is tucked into the HERO bottom edge.
   Keep it beneath the CTA and the price so no decoration masks interactive content. */
@media(min-width:1001px){
  .ref-hero .ref-leaves{bottom:-145px;z-index:1}
}
@media(max-width:1000px){
  .ref-hero .ref-leaves{z-index:1}
}
