/* TDE Studio Suite site-wide responsive guardrails, v2.25.39 */

/* Let flex/grid children actually shrink instead of forcing text outside the viewport. */
body :where(
  [class^="tde-"], [class*=" tde-"],
  [class^="tdecc"], [class*=" tdecc"],
  [class^="tdep"], [class*=" tdep"]
){
  min-width:0;
  box-sizing:border-box;
}

/* Media embedded by Suite modules should never be wider than the space available. */
body :where(
  [class^="tde-"], [class*=" tde-"],
  [class^="tdecc"], [class*=" tdecc"],
  [class^="tdep"], [class*=" tdep"]
) :where(img,video,iframe){
  max-width:100%;
}

/* Long user-entered copy must wrap instead of being clipped by a card or column. */
body :where(
  [class^="tde-"], [class*=" tde-"],
  [class^="tdecc"], [class*=" tdecc"],
  [class^="tdep"], [class*=" tdep"]
) :where(h1,h2,h3,h4,h5,h6,p,blockquote,li,dd,dt,strong,small){
  overflow-wrap:break-word;
  word-break:normal;
}

body :where(
  [class^="tde-"], [class*=" tde-"],
  [class^="tdecc"], [class*=" tdecc"],
  [class^="tdep"], [class*=" tdep"]
) :where(input,select,textarea){
  max-width:100%;
}

/* Tablet/narrow-desktop protection. This is the range where several two-column
   layouts technically fit, but the copy becomes cramped or clipped. */
@media (max-width:1100px){
  .tde-staff-featured-card{
    grid-template-columns:minmax(0,1fr)!important;
  }
  .tde-staff-featured-photo{
    width:100%!important;
    min-height:0!important;
    height:auto!important;
    aspect-ratio:16/9!important;
  }
  .tde-staff-featured-copy{
    width:100%!important;
    min-width:0!important;
    padding:30px 30px 28px!important;
    overflow:visible!important;
  }
  .tde-staff-featured-name,
  .tde-staff-featured-role,
  .tde-staff-featured-quote,
  .tde-staff-featured-read,
  .tde-staff-featured-details,
  .tde-staff-featured-details>span{
    width:auto!important;
    max-width:100%!important;
    min-width:0!important;
    white-space:normal!important;
    overflow:visible!important;
    overflow-wrap:break-word!important;
  }
  .tde-staff-featured-details{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:0 24px!important;
  }
  .tde-staff-featured-details>span{
    margin-right:0!important;
  }

  .leadership-grid .tde-staff-card.is-large,
  .tde-staff-card.is-large{
    min-width:0!important;
  }
  .leadership-grid .tde-staff-card-copy,
  .tde-staff-card.is-large .tde-staff-card-copy,
  .tde-staff-text-stack{
    min-width:0!important;
  }

  /* Headings that were intentionally locked to one line on desktop may wrap
     before they hit the viewport edge. */
  .tde-paths__header h2,
  .tde-staff-section-title h2,
  .tdecc-toolbar h3,
  .tde-happy-birthday{
    white-space:normal!important;
  }
}

@media (max-width:760px){
  .tde-staff-featured-copy{padding:26px 20px 24px!important}
  .tde-staff-featured-details{grid-template-columns:minmax(0,1fr)!important}
  .tde-staff-featured-photo{aspect-ratio:4/4.6!important}

  /* Flex controls can wrap instead of pushing the whole page wider. */
  .tde-campaign__inner,
  .tde-campaign__actions,
  .tde-family-toolbar,
  .tde-dancer-heading,
  .tde-planner-item,
  .tdecc-toolbar,
  .filters{
    min-width:0!important;
    max-width:100%!important;
  }
}


/* v2.25.39 shared public-page hero alignment
   All image heroes use the Homepage Builder's left content edge. Image crop,
   vertical placement and each page's typography remain page-specific. */

/* Heroes that already have an inner wrapper can share the homepage's
   1640px content frame directly. */
.tde-enroll-page .tde-hero-inner,
.tde-consignment .tde-cs-hero-inner,
.tde-gallery-page .tde-gallery-hero-inner,
.tde-blog-page .tde-blog-hero-inner,
.tde-contact-page .tde-contact-hero>div{
  width:min(1640px,calc(100% - 32px))!important;
  max-width:1640px!important;
  margin-left:auto!important;
  margin-right:auto!important;
  padding-left:0!important;
  padding-right:0!important;
  text-align:left!important;
  justify-content:flex-start!important;
}

/* Pages whose hero copy is positioned independently use the exact same
   calculated left edge as the homepage inner wrapper. */
.tde-company-page .tde-co-hero-copy,
.tde-staff-page .tde-staff-hero-copy,
.tdep-page .tdep-hero-copy{
  left:max(16px,calc((100vw - 1640px) / 2))!important;
  right:auto!important;
  text-align:left!important;
  align-items:flex-start!important;
}

.tde-why-page .tde-why-hero-copy{
  margin-left:max(16px,calc((100vw - 1640px) / 2))!important;
  margin-right:0!important;
  text-align:left!important;
}

/* Reinforce left alignment down through the actual copy so inherited
   Elementor/theme alignment cannot recenter an individual heading or line. */
.tde-enroll-page .tde-hero-copy,
.tde-consignment .tde-cs-hero-inner>*,
.tde-gallery-page .tde-gallery-hero-inner>*,
.tde-blog-page .tde-blog-hero-inner>*,
.tde-contact-page .tde-contact-hero>div>*,
.tde-company-page .tde-co-hero-copy>*,
.tde-staff-page .tde-staff-hero-copy>*,
.tdep-page .tdep-hero-copy>*,
.tde-why-page .tde-why-hero-copy>*{
  text-align:left!important;
  margin-left:0;
}

@media (max-width:1200px){
  .tde-enroll-page .tde-hero-inner,
  .tde-consignment .tde-cs-hero-inner,
  .tde-gallery-page .tde-gallery-hero-inner,
  .tde-blog-page .tde-blog-hero-inner,
  .tde-contact-page .tde-contact-hero>div{
    width:calc(100% - 40px)!important;
  }

  .tde-company-page .tde-co-hero-copy,
  .tde-staff-page .tde-staff-hero-copy,
  .tdep-page .tdep-hero-copy{
    left:20px!important;
  }

  .tde-why-page .tde-why-hero-copy{
    margin-left:20px!important;
  }
}

@media (max-width:767px){
  /* The homepage also settles at a 20px mobile gutter. Keep every public
     image hero on that same line while preserving each hero's mobile height. */
  .tde-enroll-page .tde-hero-inner,
  .tde-consignment .tde-cs-hero-inner,
  .tde-gallery-page .tde-gallery-hero-inner,
  .tde-blog-page .tde-blog-hero-inner,
  .tde-contact-page .tde-contact-hero>div{
    width:calc(100% - 40px)!important;
    padding-left:0!important;
    padding-right:0!important;
  }

  .tde-company-page .tde-co-hero-copy,
  .tde-staff-page .tde-staff-hero-copy,
  .tdep-page .tdep-hero-copy{
    left:20px!important;
    max-width:calc(100% - 40px)!important;
  }

  .tde-why-page .tde-why-hero-copy{
    margin-left:20px!important;
    width:calc(100% - 40px)!important;
    max-width:590px!important;
  }
}