/* Melaaura Homepage v2 — shared base (rey-child). Loaded by every melaaura_home_* widget. */
.mh{ font-family:'DM Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif; color:#16130F;
  --mh-ink:#16130F; --mh-gold:#B28C3F; --mh-ivory:#FBF9F5; --mh-stone:#6B655B; --mh-mute:#8B8174; --mh-dark:#0A0A09; --mh-line:rgba(22,19,15,0.1);
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }
.mh *{ box-sizing:border-box; }
.mh img{ display:block; max-width:100%; }
/* Standing rule: every section/card image fills its frame (cover, never letterboxed).
   Scoped to BEM image elements so logos/icons are untouched; no !important so per-widget rules still win. */
.mh [class*="__img"], .mh [class*="__image"], .mh [class*="__media"] img{ object-fit:cover; width:100%; height:100%; transform:scale(1.04); }

/* Unified primary CTA — white pill, ink text, ink border (matches header “Request a Quote”). */
.mh-brands__index, .mh-about-snip__btn{ background:#FFFFFF !important; color:#16130F !important; border:1px solid #16130F !important; border-radius:999px !important; }
.mh-brands__index:hover, .mh-about-snip__btn:hover{ background:#16130F !important; color:#FFFFFF !important; border-color:#16130F !important; }
.mh a:not([class]){ color:inherit; }
.mh-serif{ font-family:'Cormorant Garamond',Georgia,serif; }

/* ── Beat Rey theme overrides ──────────────────────────────────────────
   Rey forces heading TAGS (h1–h6) to the body sans-serif + near-black ink,
   which clobbers our serif section headings. Force them back. In this design
   every section heading is Cormorant; eyebrows/labels stay in DM Sans. */
.mh h1, .mh h2, .mh h3, .mh h4, .mh .mh-serif{
  font-family:'Cormorant Garamond',Georgia,'Times New Roman',serif !important;
}
.mh [class*="eyebrow"], .mh [class*="kicker"], .mh [class*="__num"], .mh [class*="__tag"], .mh .mh-sans{
  font-family:'DM Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif !important;
}

@keyframes mela-rise{ from{ opacity:0; transform:translateY(34px); } to{ opacity:1; transform:translateY(0); } }
@keyframes mela-fade{ from{ opacity:0; } to{ opacity:1; } }
@keyframes mela-kenburns{ from{ transform:scale(1.02); } to{ transform:scale(1.16); } }
@keyframes mela-marquee{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }
@keyframes mela-pin{ 0%{ transform:translateY(-16px); opacity:0; } 60%{ transform:translateY(3px); opacity:1; } 100%{ transform:translateY(0); opacity:1; } }
@keyframes mela-pulse{ 0%{ transform:scale(1); opacity:0.5; } 70%{ transform:scale(2.6); opacity:0; } 100%{ transform:scale(2.6); opacity:0; } }
@keyframes mela-wordrise{ from{ transform:translateY(112%); } to{ transform:translateY(0); } }
@keyframes mela-caprise{ from{ opacity:0; transform:translateY(16px); } to{ opacity:1; transform:translateY(0); } }
@keyframes mela-slidezoom{ from{ transform:scale(1.03); } to{ transform:scale(1.11); } }
@keyframes mela-hfill{ from{ transform:scaleX(0); } to{ transform:scaleX(1); } }

/* scroll reveal — gated on .mh-js so content stays visible if JS/observer never runs (e.g. editor) */
.mh.mh-js [data-reveal]{ opacity:0; transition:opacity .7s cubic-bezier(.22,.61,.36,1), transform .8s cubic-bezier(.22,.61,.36,1); }
.mh.mh-js [data-reveal="up"]{ transform:translateY(20px); }
.mh.mh-js [data-reveal][data-in]{ opacity:1 !important; transform:none !important; }

/* horizontal scrollers */
.mh [data-hscroll]{ scrollbar-width:none; -ms-overflow-style:none; }
.mh [data-hscroll]::-webkit-scrollbar{ display:none; }

@media (prefers-reduced-motion: reduce){
  .mh.mh-js [data-reveal]{ transition:none !important; }
  .mh [data-hzoom], .mh [data-proj] img{ transition:none !important; }
}
