/* Tango Flowers homepage redesign — Base44-inspired structure using existing site images */
.home-hero{
  min-height:600px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  text-align:center;
  background:
    linear-gradient(90deg,rgba(4,16,10,.72),rgba(4,16,10,.42) 52%,rgba(4,16,10,.55)),
    var(--weekly-hero-image, url('../images/home/hero-current.jpg')) center/cover;
  transition:background-image .7s ease;
}
.home-hero .container{max-width:1180px;text-align:center;margin-left:auto;margin-right:auto}
.home-hero .eyebrow{margin:0 auto 16px;color:#c3a64a;text-align:center}
.home-hero h1{
  color:#fff;
  max-width:none;
  margin:0 auto;
  white-space:nowrap;
  text-align:center;
  font-size:clamp(2.7rem,4.6vw,4.7rem);
  line-height:1;
}
.home-hero p{
  max-width:790px;
  margin:22px auto 0;
  color:#f2f4f1;
  text-align:center;
  font-size:clamp(1rem,1.5vw,1.18rem);
  line-height:1.55;
}
.home-actions{display:flex;justify-content:center;align-items:center;gap:14px;margin:30px auto 0}
.home-actions .btn{min-width:185px;padding:15px 22px}

/* Compact Base44-style header proportions on Home only; logo artwork is unchanged */
body:has(.home-hero) .nav{min-height:82px;grid-template-columns:230px minmax(0,1fr);gap:36px}
body:has(.home-hero) .logo{width:230px;max-height:68px}
body:has(.home-hero) .nav a{font-size:.72rem}

.intro-stat{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:0;
  background:#fbfaf6;
  border-bottom:1px solid rgba(16,37,26,.08);
}
.intro-stat div{background:#fbfaf6;padding:42px 24px;text-align:center}
.intro-stat strong{display:block;font:500 clamp(2.2rem,3vw,3rem) var(--serif);color:var(--ink);line-height:1}
.intro-stat span{display:block;margin-top:8px;color:var(--muted);font-size:.95rem}

/* Intro section mirrors the centered editorial treatment in the reference */
.intro-stat + .section{padding:88px 0 76px}
.intro-stat + .section .grid-2{display:block;max-width:900px;margin:0 auto;text-align:center}
.intro-stat + .section .grid-2>div:first-child .eyebrow{display:none}
.intro-stat + .section .grid-2 h2{
  max-width:820px;
  margin:0 auto;
  font-size:clamp(2.25rem,4vw,3.9rem);
  line-height:1.06;
}
.relationship-heading{text-align:center}
.relationship-heading span{display:block;text-align:center}
.intro-stat + .section .grid-2>div:last-child{max-width:820px;margin:22px auto 0}
.intro-stat + .section .grid-2 p{margin:0;font-size:1.05rem;line-height:1.62}

/* Three equal collection cards while preserving the existing three photos and IDs */
.section-soft{padding:0 0 88px;background:#fbfaf6}
.collection-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.collection-stack{display:contents}
.collection-big,.collection-small{
  min-height:310px;
  position:relative;
  border-radius:4px;
  overflow:hidden;
  border:1px solid rgba(16,37,26,.08);
  box-shadow:0 10px 28px rgba(16,37,26,.07);
}
.collection-big img,.collection-small img{height:100%;object-fit:cover;transition:transform .65s ease,opacity .45s ease}
.collection-big:hover img,.collection-small:hover img{transform:scale(1.035)}
.collection-big::after,.collection-small::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.04) 32%,rgba(7,20,13,.78) 100%);pointer-events:none}
.overlay-copy{position:absolute;z-index:1;inset:auto 0 0;padding:28px 24px;color:#fff;background:none;text-align:left}
.overlay-copy .eyebrow{display:none}
.overlay-copy h3{color:#fff;font-size:1.8rem;margin-bottom:6px}
.overlay-copy h3::after{content:"  →";color:#c3a64a;font-family:var(--sans);font-size:1rem;vertical-align:middle}

/* Full-width dark CTA section inspired by the reference */
main>.section:last-of-type{padding:0;background:#171d19}
main>.section:last-of-type .container{width:100%;max-width:none}
.page-cta{
  min-height:340px;
  border-radius:0;
  background:#171d19;
  padding:68px 24px;
  flex-direction:column;
  justify-content:center;
  text-align:center;
  gap:18px;
}
.page-cta .eyebrow{display:none}
.page-cta h2{max-width:760px;margin:0 auto;color:#fff;font-size:clamp(2.2rem,4vw,3.7rem);line-height:1.05}
.page-cta p{max-width:760px;margin:0 auto;color:#cbd1cd;font-size:1.02rem}
.page-cta .btn{margin-top:6px;min-width:200px}

.weekly-image-reveal{animation:weeklyImageReveal .7s ease both}
@keyframes weeklyImageReveal{from{opacity:.35;transform:scale(1.025)}to{opacity:1;transform:scale(1)}}

@media(max-width:980px){
  body:has(.home-hero) .nav{display:flex;min-height:88px}
  body:has(.home-hero) .logo{width:225px;max-height:68px}
  body:has(.home-hero) .nav ul{top:88px}
  .home-hero{min-height:560px}
  .home-hero .container{width:min(100% - 24px,940px)}
  .home-hero h1{font-size:clamp(2.05rem,5.4vw,3.25rem)}
  .intro-stat{grid-template-columns:repeat(3,1fr)}
  .collection-grid{grid-template-columns:1fr}
  .collection-big,.collection-small{min-height:300px}
}

@media(max-width:760px){
  .home-hero{min-height:520px;padding:56px 0;background-position:center}
  .home-hero .container{width:min(100% - 16px,720px);text-align:center}
  .home-hero .eyebrow{font-size:.68rem;letter-spacing:.13em;text-align:center}
  .home-hero h1{font-size:clamp(1.45rem,6.25vw,2.2rem);line-height:1.02;white-space:nowrap;text-align:center}
  .home-hero p{font-size:.98rem;line-height:1.5;margin:18px auto 0;text-align:center}
  .home-actions{flex-direction:row;justify-content:center;align-items:center;gap:12px;max-width:none;margin:26px auto 0}
  .home-actions .btn{width:auto;min-width:145px;padding:13px 14px}
  .intro-stat{grid-template-columns:1fr;gap:0}
  .intro-stat div{padding:24px 18px;border-bottom:1px solid rgba(16,37,26,.07)}
  .intro-stat strong{font-size:2.2rem}
  .intro-stat + .section{padding:62px 0 58px}
  .intro-stat + .section .grid-2 h2{font-size:clamp(2rem,9vw,2.8rem)}
  .intro-stat + .section .grid-2 p{font-size:.98rem}
  .section-soft{padding:0 0 62px}
  .collection-grid{gap:16px}
  .collection-big,.collection-small{min-height:245px}
  .overlay-copy{padding:22px 20px}
  .overlay-copy h3{font-size:1.55rem}
  .page-cta{min-height:300px;padding:54px 24px}
  .page-cta h2{font-size:clamp(2rem,9vw,2.8rem)}
  .page-cta p{font-size:.96rem}
}

@media(max-width:390px){
  .home-hero h1{font-size:1.38rem}
  .home-actions{gap:8px}
  .home-actions .btn{min-width:132px;padding:12px 10px;font-size:.78rem}
}
