/* ============================================================
   Heritage Material Godown — brand kit
   Earthen palette + reusable components. All classes are namespaced
   .hmg-* so they never fight Elementor's own styles.

   HOW TO USE IN ELEMENTOR:
   Select a widget/container -> Advanced tab -> CSS Classes ->
   add the class name (e.g. hmg-btn-solid). That's it.
   ============================================================ */

:root{
  --hmg-rust:     #B7410E;  /* primary accent (confirmed brand colour) */
  --hmg-ochre:    #C8813B;  /* secondary warm accent */
  --hmg-sienna:   #8A4B2F;  /* deep accent / hover */
  --hmg-cream:    #F6EFE4;  /* page background */
  --hmg-espresso: #2C2118;  /* headings + body text */
  --hmg-sand:     #E0D3BE;  /* borders / dividers / muted */
  --hmg-card:     #FBF7F0;  /* card surface */
  --hmg-line:     rgba(44,33,24,0.12);
}

/* ---------- eyebrow label ---------- */
.hmg-eyebrow{
  font-family:"Mulish",sans-serif; font-weight:700;
  text-transform:uppercase; letter-spacing:.18em; font-size:.8rem;
  color:var(--hmg-rust);
}

/* ---------- buttons (add class to an Elementor Button widget) ---------- */
.hmg-btn-solid.hmg-btn-solid{
  background:var(--hmg-rust); color:#fff; border:1px solid var(--hmg-rust);
  border-radius:4px; letter-spacing:.03em; transition:background .18s ease, transform .18s ease;
}
.hmg-btn-solid.hmg-btn-solid:hover{ background:var(--hmg-sienna); border-color:var(--hmg-sienna); transform:translateY(-2px); }

.hmg-btn-ghost.hmg-btn-ghost{
  background:transparent; color:var(--hmg-espresso); border:1px solid var(--hmg-espresso);
  border-radius:4px; letter-spacing:.03em; transition:.18s ease;
}
.hmg-btn-ghost.hmg-btn-ghost:hover{ background:var(--hmg-espresso); color:var(--hmg-cream); }

/* ---------- badge / tag ---------- */
.hmg-badge{
  display:inline-block; font-family:"Mulish",sans-serif; font-weight:700;
  font-size:.7rem; text-transform:uppercase; letter-spacing:.08em;
  color:var(--hmg-sienna); background:rgba(183,65,14,.10);
  padding:.3rem .6rem; border-radius:3px;
}

/* ---------- stat strip (add hmg-stat-strip to a container of columns) ---------- */
.hmg-stat-strip{ border-block:1px solid var(--hmg-line); }
.hmg-stat b, .hmg-stat .hmg-num{
  font-family:"Fraunces",serif; font-weight:700; font-size:clamp(2rem,1.4rem+2vw,3rem);
  color:var(--hmg-rust); display:block; line-height:1;
}
.hmg-stat span, .hmg-stat .hmg-label{
  font-family:"Mulish",sans-serif; text-transform:uppercase; letter-spacing:.1em;
  font-size:.78rem; color:var(--hmg-espresso); opacity:.75;
}

/* ---------- product / material card (add hmg-card to an Image Box or container) ---------- */
.hmg-card{
  background:var(--hmg-card); border:1px solid var(--hmg-line); border-radius:6px;
  overflow:hidden; transition:transform .2s ease, box-shadow .2s ease;
}
.hmg-card:hover{ transform:translateY(-4px); box-shadow:0 18px 40px -28px rgba(44,33,24,.5); }
.hmg-card img{ transition:transform .4s ease; }
.hmg-card:hover img{ transform:scale(1.04); }

/* ---------- section rhythm + heading treatment ---------- */
.hmg-section{ padding-block:clamp(3rem,2rem+4vw,5.5rem); }
.hmg-heading{ font-family:"Fraunces",serif; font-weight:700; color:var(--hmg-espresso); line-height:1.1; }
.hmg-lede{ color:var(--hmg-espresso); opacity:.8; font-size:1.1rem; max-width:60ch; }

/* ---------- numbered process chip (add hmg-step-num to a Heading holding "01" etc.) ---------- */
.hmg-step-num{
  font-family:"Fraunces",serif; font-weight:700; color:var(--hmg-ochre);
  font-size:2.2rem; line-height:1; opacity:.9;
}
.hmg-step{ border-left:2px solid var(--hmg-sand); padding-left:1.25rem; }

/* ---------- CTA band (add hmg-cta-band to a full-width container) ---------- */
.hmg-cta-band{ background:var(--hmg-espresso); }
.hmg-cta-band .hmg-heading, .hmg-cta-band h1, .hmg-cta-band h2{ color:var(--hmg-cream); }
.hmg-cta-band p{ color:var(--hmg-sand); }

/* ---------- accessibility + polish ---------- */
.hmg-btn-solid:focus-visible, .hmg-btn-ghost:focus-visible{ outline:3px solid var(--hmg-ochre); outline-offset:2px; }
@media (prefers-reduced-motion: reduce){
  .hmg-card, .hmg-card img, .hmg-btn-solid, .hmg-btn-ghost{ transition:none; }
}

/* ============================================================
   COMPONENT LIBRARY additions (counter, supply cards, chips, quotes)
   ============================================================ */

/* animated counter strip (Elementor free Counter widget) */
.hmg-counter .elementor-counter-number-wrapper{
  font-family:"Fraunces",serif; font-weight:700; color:var(--hmg-rust);
}
.hmg-counter .elementor-counter-title{
  font-family:"Mulish",sans-serif; text-transform:uppercase; letter-spacing:.1em;
  font-size:.8rem; color:var(--hmg-espresso); opacity:.75; margin-top:.4rem;
}

/* supply-format / tier card */
.hmg-price-card{
  background:var(--hmg-card); border:1px solid var(--hmg-line); border-top:3px solid var(--hmg-rust);
  border-radius:6px; padding:1.75rem 1.5rem; height:100%;
  transition:transform .2s ease, box-shadow .2s ease;
}
.hmg-price-card:hover{ transform:translateY(-4px); box-shadow:0 18px 40px -28px rgba(44,33,24,.5); }
.hmg-price{ font-family:"Fraunces",serif; font-weight:700; color:var(--hmg-rust); font-size:1.5rem; }

/* inline chips (drop into a Text Editor as spans) */
.hmg-chip{
  display:inline-block; background:rgba(183,65,14,.09); color:var(--hmg-sienna);
  font-family:"Mulish",sans-serif; font-size:.72rem; font-weight:700;
  text-transform:uppercase; letter-spacing:.06em; padding:.28rem .55rem;
  border-radius:3px; margin:.2rem .25rem 0 0;
}

/* testimonial (Elementor free Testimonial widget) */
.hmg-quote .elementor-testimonial-content{ font-family:"Fraunces",serif; font-style:italic; color:var(--hmg-espresso); }
.hmg-quote .elementor-testimonial-name{ color:var(--hmg-rust); font-weight:700; }
.hmg-quote .elementor-testimonial-job{ color:var(--hmg-espresso); opacity:.7; }
