/* Shared full-bleed page hero — use on home / stores / animals / future pages */
:root{
  --page-hero-min-height:586px;
  --page-hero-min-height-md:716px;
  --page-hero-min-height-sm:746px
}

.page-hero{
  position:relative;
  min-height:var(--page-hero-min-height);
  background:linear-gradient(90deg,#eee9df 0 47%,#c8c8c8 65%,#a9a9a9 100%);
  background-size:cover;
  background-position:center;
  isolation:isolate
}
.page-hero[data-media-state=ready]{background-image:var(--home-background)}
.page-hero-inner{
  position:relative;
  min-height:var(--page-hero-min-height);
  display:flex;
  align-items:center;
  padding-top:86px;
  padding-bottom:36px
}
.page-hero-copy{
  position:relative;
  z-index:3;
  width:52%;
  padding-bottom:20px
}
.page-hero-breadcrumb{
  position:absolute;
  top:102px;
  left:0;
  z-index:4;
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
  margin:0;
  color:#8a8176;
  font-size:.82rem;
  line-height:1.3
}
.page-hero-breadcrumb a{
  display:inline-flex;
  align-items:center;
  gap:6px;
  color:#8a5a28;
  font-weight:500
}
.page-hero-breadcrumb a:hover,
.page-hero-breadcrumb a:focus-visible{color:var(--brand-green)}
.page-hero-breadcrumb-home{
  width:1em;
  height:1em;
  flex:0 0 auto;
  color:#9a6a32
}
.page-hero-breadcrumb-sep{
  color:#b08955;
  font-weight:500
}
.page-hero-breadcrumb [aria-current=page]{
  color:#8a8176;
  font-weight:500
}
.page-hero-eyebrow{
  display:flex;
  align-items:center;
  gap:22px;
  margin:0 0 18px;
  color:#af7430;
  font-size:.82rem;
  font-weight:700;
  letter-spacing:.22em
}
.page-hero-eyebrow span{
  width:44px;
  height:1px;
  background:#c89554
}
.page-hero-copy h1{
  margin:0;
  max-width:none;
  color:#8b491c;
  font-family:Times New Roman,"Songti SC","STSong",serif;
  font-size:clamp(2.35rem,3.05vw,2.9rem);
  line-height:1.18;
  letter-spacing:-.025em;
  white-space:nowrap
}
.page-hero-subtitle{
  margin:.42em 0 .55em;
  max-width:none;
  color:var(--brand-green);
  font-family:Georgia,"Songti SC","STSong",serif;
  font-size:clamp(1.65rem,2.25vw,2.35rem);
  font-weight:700;
  white-space:nowrap
}
.page-hero-body{
  max-width:540px;
  margin:0;
  color:#675f57;
  font-size:1rem;
  line-height:1.75
}
.page-hero-actions{margin-top:26px}
.page-hero-actions .button{min-width:190px}
.page-hero-actions .home-icon{margin-right:7px}
.page-hero-handwriting{
  position:absolute;
  z-index:3;
  right:0;
  top:210px;
  margin:0;
  color:#683a25;
  font-family:"Segoe Print","Bradley Hand","KaiTi",cursive;
  font-style:italic;
  font-size:1.15rem;
  line-height:1.4;
  text-align:left;
  transform:rotate(-10deg)
}
.page-hero .home-background-note{
  right:8%;
  top:58%;
  transform:translateY(-50%);
  width:30%
}
.page-hero[data-media-state=ready] .home-background-note{display:none}

@media(max-width:1439px) and (min-width:961px){
  .page-hero-copy{width:56%}
}
@media(max-width:960px){
  .page-hero,
  .page-hero-inner{min-height:0}
  .page-hero{
    background-position:top center;
    background-repeat:no-repeat
  }
  .page-hero[data-media-state=ready]{
    background-size:100% auto
  }
  .page-hero-inner{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    justify-content:flex-start;
    padding-top:20px;
    padding-bottom:28px
  }
  .page-hero[data-media-state=ready]:not(.store-page-hero) .page-hero-inner{
    padding-top:calc(100vw * 640 / 1920 + 16px)
  }
  .page-hero-breadcrumb{
    position:static;
    top:auto;
    left:auto;
    margin:0 0 10px
  }
  .page-hero-copy{width:100%;max-width:none;padding-bottom:0}
  .page-hero-copy h1{
    font-size:1.95rem;
    white-space:normal
  }
  .page-hero-subtitle{
    font-size:1.48rem;
    white-space:normal
  }
  .page-hero-handwriting{display:none}
  .page-hero .home-background-note{
    right:8%;
    top:auto;
    bottom:40px;
    width:84%;
    transform:none
  }
}
@media(max-width:480px){
  .page-hero-eyebrow{font-size:.68rem}
  .page-hero-copy h1{font-size:1.75rem}
  .page-hero-actions .button{width:100%}
}