/* ==========================================================================
   BABY HAIR - Elementor shim
   The widgets now carry the ORIGINAL class names, so babyhair.css styles them
   directly. This file only bridges the few places where Elementor wraps the
   text in an inner element that the original CSS targeted directly.
   ========================================================================== */

/* ---- Elementor container resets ---- */
.babyhair .e-con,.babyhair .e-con-inner{
  --gap:0px;--grid-gap:0px;--width:100%;--content-width:100%;
  --padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;
  --margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;
}
.babyhair .e-con>.e-con-inner{padding:0;max-width:none;width:100%}
.babyhair .elementor-widget:not(:last-child){margin-block-end:0}
.babyhair .elementor-element{--widgets-spacing:0px;--widgets-spacing-row:0px;--widgets-spacing-column:0px}
.babyhair .elementor-widget-container{margin:0}

/* ---- headings: the original styles the element, Elementor nests an inner h-tag ---- */
.babyhair .eyebrow .elementor-heading-title,
.babyhair .display .elementor-heading-title,
.babyhair .hero__sub .elementor-heading-title,
.babyhair .pillar__no .elementor-heading-title,
.babyhair .bh-h3 .elementor-heading-title,
.babyhair .bh-beatline .elementor-heading-title,
.babyhair .bh-serif-sub .elementor-heading-title{
  font:inherit;color:inherit;letter-spacing:inherit;text-transform:inherit;
  line-height:inherit;margin:0;
}
.babyhair .display em,.babyhair .display .elementor-heading-title em{
  font-style:italic;color:var(--gold);font-weight:400;
}

/* size overrides that were inline in the original build */
.babyhair .bh-h2 .elementor-heading-title,.babyhair .bh-h2{font-size:var(--step-3);line-height:1.08}
.babyhair .bh-h3 .elementor-heading-title,.babyhair .bh-h3{
  font-family:var(--display);font-size:var(--step-2);line-height:1.15;color:var(--ink);font-weight:400;
}
.babyhair .bh-serif-sub{font-family:var(--display);font-size:var(--step-1)}
.babyhair .bh-eyebrow--light,.babyhair .bh-eyebrow--light .elementor-heading-title{color:var(--champagne)}

/* ---- hero ---- */
.babyhair .bh-hero-title .elementor-heading-title{
  font-family:var(--display);font-weight:400;color:#FBF7F1;
  font-size:clamp(2.3rem,5.8vw,5.6rem);line-height:1.02;max-width:16ch;margin:0;
}
.babyhair .hero{align-items:flex-end;padding-bottom:clamp(3rem,7vw,6rem);height:auto;min-height:100svh}
.babyhair .hero .wrap{display:flex;flex-direction:column;align-items:flex-start}
.babyhair .hero__sub{margin:1.3rem 0 0}
.babyhair .hero__sub .elementor-heading-title{
  font-family:var(--display);font-style:italic;font-weight:300;
  font-size:clamp(1.1rem,2vw,1.8rem);color:rgba(251,247,241,.92);
}
.babyhair .hero .btn{margin:0}

/* ---- the quiet beat ---- */
.babyhair .beat{display:flex;flex-direction:column;align-items:center;gap:0}
.babyhair .bh-beatline .elementor-heading-title{
  font-family:var(--display);font-weight:300;font-size:clamp(1.5rem,4vw,3.1rem);
  line-height:1.3;color:var(--ink);max-width:22ch;margin:0 auto;padding-block:.16em;
}
.babyhair .bh-beatline--gold .elementor-heading-title{color:var(--gold);font-style:italic}

/* ---- text widgets ---- */
.babyhair .lede p:last-child,.babyhair .small p:last-child,
.babyhair .serif-quote p:last-child{margin-bottom:0}
.babyhair .serif-quote p{font-family:var(--display);font-style:italic;
  font-size:var(--step-2);line-height:1.4;color:var(--navy);margin:0}
.babyhair .note p{margin:0}

/* ---- buttons: original .btn styles the element, Elementor nests <a> ---- */
.babyhair .btn{display:inline-flex;padding:0;border:0;background:none}
.babyhair .btn .elementor-button{
  display:inline-flex;align-items:center;justify-content:center;gap:.7rem;
  padding:1.05rem 2rem;font-family:var(--sans);font-size:.7rem;font-weight:600;
  letter-spacing:.16em;text-transform:uppercase;border-radius:2px;border:1px solid transparent;
  transition:.3s var(--ease);
}
.babyhair .btn--navy .elementor-button{background:var(--ink);color:#FBF7F1;border-color:var(--ink)}
.babyhair .btn--navy .elementor-button:hover{background:#000;color:#FBF7F1}
.babyhair .btn--gold .elementor-button{background:var(--gold);color:#FBF7F1;border-color:var(--gold)}
.babyhair .btn--gold .elementor-button:hover{background:#9d6f2c;border-color:#9d6f2c}
.babyhair .btn--ghost .elementor-button{background:transparent;color:var(--ink);border-color:var(--ink)}
.babyhair .btn--ghost .elementor-button:hover{background:var(--ink);color:#FBF7F1}
.babyhair .btn--light .elementor-button{background:transparent;color:#FBF7F1;border-color:rgba(251,247,241,.55)}
.babyhair .btn--light .elementor-button:hover{background:#FBF7F1;color:var(--ink)}
.babyhair .link-arrow{display:inline-flex;border:0;padding:0}
.babyhair .link-arrow .elementor-button{
  background:none;border:0;padding:0;color:var(--gold);font-family:var(--sans);
  font-size:.68rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;
}
.babyhair .link-arrow .elementor-button:hover{background:none;color:var(--gold);gap:.9rem}
.babyhair .chip{display:inline-flex;border:0;padding:0;background:none}
.babyhair .chip .elementor-button{
  background:transparent;border:1px solid var(--taupe);border-radius:99px;color:var(--charcoal);
  font-family:var(--sans);font-size:.72rem;letter-spacing:.06em;text-transform:none;
  font-weight:400;padding:.6rem 1.15rem;
}
.babyhair .chip .elementor-button:hover{border-color:var(--ink);color:var(--ink)}

/* ---- media placeholder rendered by a heading widget ---- */
.babyhair .media{width:100%}
.babyhair .media .elementor-widget-container{height:100%}
.babyhair .media .elementor-heading-title{
  position:absolute;left:1rem;bottom:.9rem;font-family:var(--sans);font-size:.58rem;
  letter-spacing:.18em;text-transform:uppercase;color:rgba(23,23,23,.38);font-weight:500;margin:0;
}
.babyhair .media--deep .elementor-heading-title,
.babyhair .media--green .elementor-heading-title{color:rgba(251,247,241,.5)}
.babyhair .bh-fill{height:100%;min-height:320px}

/* ---- icon lists mapped onto .checks ---- */
.babyhair .checks .elementor-icon-list-items{display:grid;gap:.7rem;margin:0;padding:0}
.babyhair .checks .elementor-icon-list-item{align-items:flex-start;font-size:.9rem;color:var(--charcoal);margin:0}
.babyhair .checks .elementor-icon-list-item:before{content:none}
.babyhair .checks .elementor-icon-list-icon{color:var(--gold);padding-top:.3rem}
.babyhair .checks .elementor-icon-list-icon svg{fill:var(--gold);width:13px;height:13px}

/* ---- layout grids ---- */
.babyhair .bh-2col{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,4.5rem);align-items:center}
.babyhair .bh-3col{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1.25rem,2vw,1.75rem);align-items:stretch}
.babyhair .bh-4col{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(1.25rem,2vw,1.75rem);align-items:start}
.babyhair .bh-5col{display:grid;grid-template-columns:repeat(5,1fr);gap:clamp(1.25rem,2vw,2rem);align-items:start;
  border-block:1px solid var(--line-c);padding-block:2.5rem}
.babyhair .bh-2col>.e-con,.babyhair .bh-3col>.e-con,
.babyhair .bh-4col>.e-con,.babyhair .bh-5col>.e-con{width:100%;min-width:0}
@media(max-width:1024px){.babyhair .bh-4col,.babyhair .bh-5col{grid-template-columns:repeat(2,1fr);gap:2rem 1.5rem}}
@media(max-width:900px){.babyhair .bh-2col,.babyhair .bh-3col{grid-template-columns:1fr;gap:2.25rem}}
@media(max-width:600px){.babyhair .bh-4col,.babyhair .bh-5col{grid-template-columns:1fr;gap:1.75rem}}

/* ---- pillars ---- */
.babyhair .pillar{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,5rem);
  align-items:center;padding-block:clamp(3rem,6vw,5rem);border-top:1px solid var(--line-c)}
.babyhair .pillar>.e-con{width:100%;min-width:0}
.babyhair .pillar__meta{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;
  border-top:1px solid var(--line-c);padding-top:1.35rem;margin-top:1.75rem}
@media(max-width:900px){.babyhair .pillar{grid-template-columns:1fr}
  .babyhair .pillar__meta{margin-top:1.25rem}}

/* ---- education hub cards ---- */
.babyhair .hub__card{display:flex;flex-direction:column;align-items:flex-start;
  background:var(--navy);min-height:0;padding-bottom:1.75rem;height:100%}
.babyhair .hub__card .media{margin-bottom:1.35rem}
.babyhair .hub__card>.elementor-element:not(.media){padding-inline:1.6rem}
.babyhair .hub__card .elementor-heading-title{color:#FBF7F1}
.babyhair .hub__card .small{color:rgba(251,247,241,.82)}

/* ---- page hero ---- */
.babyhair .pagehero{display:grid;grid-template-columns:1.02fr .98fr;align-items:stretch;
  background:var(--cream);position:relative;overflow:hidden}
.babyhair .pagehero__body{position:static;display:flex;flex-direction:column;
  align-items:flex-start;justify-content:center;
  padding:clamp(3rem,6vw,5rem) clamp(1.5rem,3vw,3rem) clamp(3rem,6vw,5rem)
    max(var(--gut),calc((100vw - var(--max))/2 + var(--gut)));
  min-height:clamp(320px,34vw,440px)}
.babyhair .pagehero__media{position:static;inset:auto}
.babyhair .pagehero__media::before{display:none}
.babyhair .pagehero__media .media{height:100%;min-height:clamp(320px,34vw,440px)}
@media(max-width:900px){.babyhair .pagehero{grid-template-columns:1fr}
  .babyhair .pagehero__body{padding:clamp(2.5rem,6vw,3.5rem) var(--gut);min-height:0}
  .babyhair .pagehero__media{margin:0}
  .babyhair .pagehero__media .media{min-height:240px}}

/* ---- professional gateway ---- */
.babyhair .gate{display:grid;grid-template-columns:.95fr 1.05fr;align-items:stretch;
  background:var(--ivory);border-top:1px solid var(--line-c)}
.babyhair .gate>.e-con{width:100%;min-width:0}
.babyhair .gate__body{display:flex;flex-direction:column;align-items:flex-start;
  justify-content:center;padding:clamp(2.25rem,4.5vw,3.75rem) clamp(1.5rem,3vw,3rem)}
.babyhair .gate .media{min-height:clamp(280px,30vw,420px);height:100%}
@media(max-width:900px){.babyhair .gate{grid-template-columns:1fr}}

/* ---- quote band ---- */
.babyhair .quoteband{background:var(--botanical);padding-block:clamp(2.75rem,5vw,4.25rem)}
.babyhair .bh-quoteband-text p{font-family:var(--display);font-size:clamp(1.15rem,2.2vw,1.75rem);
  color:#FBF7F1;line-height:1.45;margin:0 0 .75rem;max-width:52ch}
.babyhair .bh-quoteband-cite .elementor-heading-title{color:var(--champagne);
  font-family:var(--sans);font-size:.85rem}

/* ---- forms ---- */
.babyhair .formcard .elementor-form-fields-wrapper{margin:0 -8px}
.babyhair .formcard .elementor-field-group{padding:0 8px;margin-bottom:1rem}
.babyhair .formcard .elementor-field-group>label{font-size:.62rem;letter-spacing:.15em;
  text-transform:uppercase;color:var(--charcoal);font-weight:600;margin-bottom:.4rem}
.babyhair .formcard .elementor-field-textual{padding:.9rem 1rem;border:1px solid var(--taupe);
  background:var(--ivory);border-radius:2px;font-size:.9rem;height:auto}
.babyhair .formcard .elementor-field-textual:focus{border-color:var(--gold);background:#fff;box-shadow:none}
.babyhair .formcard .elementor-button[type=submit]{background:var(--ink);color:#FBF7F1;
  border-radius:2px;font-size:.7rem;font-weight:600;letter-spacing:.16em;
  text-transform:uppercase;padding:1.05rem 2rem}

/* ---- vertical rhythm inside text columns ---- */
.babyhair .pagehero__body>.elementor-element+.elementor-element,
.babyhair .gate__body>.elementor-element+.elementor-element{margin-top:1rem}
.babyhair .eyebrow+.elementor-element{margin-top:.35rem}
.babyhair .display+.elementor-element{margin-top:1.1rem}
.babyhair .lede+.elementor-element,.babyhair .small+.elementor-element{margin-top:1.5rem}
.babyhair .rule,.babyhair .elementor-widget-divider{margin-block:1.25rem}
.babyhair .elementor-widget-divider .elementor-divider{padding-block:0}
.babyhair .elementor-widget-divider .elementor-divider-separator{
  border-top-color:var(--gold);border-top-width:2px}

/* ---- button rows ---- */
.babyhair .bh-btnrow{display:flex;flex-direction:row;flex-wrap:wrap;gap:.9rem;
  align-items:center;margin-top:1.75rem}
.babyhair .bh-btnrow.center{justify-content:center}
.babyhair .bh-btnrow .elementor-element{margin:0}

/* ---- centred blocks ---- */
.babyhair .center{text-align:center}
.babyhair .center .lede,.babyhair .center .small{margin-inline:auto}
.babyhair .e-con.center{align-items:center}

/* ---- section rhythm ---- */
.babyhair .bh-sec-sm{padding-block:clamp(2.5rem,5vw,4rem)}
.babyhair .bh-sec-xs{padding-block:clamp(1.75rem,3vw,2.5rem)}

/* ---- product grid from Woodmart inside our sections ---- */
.babyhair .wd-products-element{margin-top:1.75rem}
