/* ==========================================================================
   Dare Tale — Elementor bridge
   --------------------------------------------------------------------------
   The design system in style.css expects grids whose direct children are the
   cards. Elementor wraps every widget in its own containers, which breaks that
   relationship. This file re-points the layout rules at Elementor's DOM so a
   column tagged .card-grid behaves exactly like the coded .card-grid does.

   Loaded only when Elementor is active.
   ========================================================================== */

/* ---- strip Elementor's default spacing so our own spacing survives ------ */
.elementor-section.dt-section > .elementor-container { max-width: var(--container); padding-inline: var(--gutter); }
.elementor-widget-wrap { padding: 0 !important; }
.elementor-section.dt-section .elementor-widget:not(:last-child) { margin-bottom: 0; }
.elementor-inner-section > .elementor-container { padding: 0; }

/* ---- section backgrounds ------------------------------------------------ */
.elementor-section.section--dark { background: var(--dark); color: var(--cream-2); }
.elementor-section.section--red  { background: var(--red);  color: var(--white); }
.elementor-section.dt-section    { padding-block: var(--section-y); }
.elementor-section.dt-section--flush-top { padding-top: 0; }

/* ---- grid columns: make widget-wrap the grid, not the column ------------ */
.dt-grid > .elementor-widget-wrap {
  display: grid;
  gap: clamp(16px, 1.6vw, 22px);
  align-items: stretch;
  align-content: start;
}
/* Elementor sets inline widths on elements; grid items must fill their cell */
.dt-grid > .elementor-widget-wrap > .elementor-element,
.dt-grid > .elementor-widget-wrap > .elementor-section {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
}
.dt-grid > .elementor-widget-wrap > .elementor-element > .elementor-widget-container { height: 100%; }
.dt-grid > .elementor-widget-wrap > .elementor-element .svc-card,
.dt-grid > .elementor-widget-wrap > .elementor-element .conf-card,
.dt-grid > .elementor-widget-wrap > .elementor-element .journal-card,
.dt-grid > .elementor-widget-wrap > .elementor-element .video-card { height: 100%; }

/* column counts, matching style.css */
.dt-grid--3 > .elementor-widget-wrap { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.dt-grid--2 > .elementor-widget-wrap { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(20px, 2.6vw, 40px); }
.dt-grid--4 > .elementor-widget-wrap { grid-template-columns: repeat(4, minmax(0, 1fr)); }

/* the staggered Services layout */
.dt-grid--stagger > .elementor-widget-wrap {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(18px, 2vw, 30px);
}
.dt-grid--stagger > .elementor-widget-wrap > *:nth-child(even) { margin-top: clamp(28px, 3.5vw, 56px) !important; }

/* the offset Manifesto / Founders layouts */
.dt-grid--pledge > .elementor-widget-wrap { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(16px, 2vw, 26px); }
.dt-grid--pledge > .elementor-widget-wrap > *:nth-child(2) { margin-top: clamp(26px, 3vw, 44px) !important; }
.dt-grid--people > .elementor-widget-wrap { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(20px, 2.6vw, 40px); }
.dt-grid--people > .elementor-widget-wrap > *:nth-child(2) { margin-top: clamp(30px, 4vw, 64px) !important; }
.dt-grid--steps > .elementor-widget-wrap { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(14px, 1.6vw, 22px); }
.dt-grid--steps > .elementor-widget-wrap > *:nth-child(even) { margin-top: clamp(20px, 2.4vw, 38px) !important; }
.dt-grid--contact > .elementor-widget-wrap { grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr); gap: clamp(22px, 3vw, 44px); align-items: start; }

/* ---- native Elementor widgets, wearing our type styles ------------------ */
.elementor-widget-heading .elementor-heading-title { font-family: var(--font-display); font-weight: 700; letter-spacing: -.025em; line-height: 1.06; }
.elementor-widget-heading .elementor-heading-title .accent { font-family: var(--font-serif); font-style: italic; font-weight: 500; color: var(--red); }
.section--dark .elementor-widget-heading .elementor-heading-title,
.section--dark .elementor-widget-text-editor { color: var(--cream-2); }
.section--red .elementor-widget-heading .elementor-heading-title,
.section--red .elementor-widget-text-editor { color: var(--white); }
.elementor-widget-text-editor { font-family: var(--font-body); font-size: .95rem; line-height: 1.62; color: var(--muted); }
.section--dark .elementor-widget-text-editor { color: #c9c9c9; }
.section--red .elementor-widget-text-editor { color: rgba(255, 255, 255, .92); }

/* Elementor button wearing the .btn look */
.elementor-button-wrapper .elementor-button { border-radius: var(--radius-pill); font-family: var(--font-body); font-weight: 600; padding: 13px 22px; }

/* ---- editor-only affordances ------------------------------------------- */
/* give empty/short sections a clickable height while editing */
.elementor-editor-active .elementor-section.dt-section { min-height: 60px; }

/* ---- responsive: mirror style.css breakpoints -------------------------- */
@media (max-width: 1080px) {
  .dt-grid--3 > .elementor-widget-wrap { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 960px) {
  .dt-grid--2 > .elementor-widget-wrap,
  .dt-grid--people > .elementor-widget-wrap,
  .dt-grid--contact > .elementor-widget-wrap { grid-template-columns: 1fr; }
  .dt-grid--people > .elementor-widget-wrap > *:nth-child(2) { margin-top: 0 !important; }
  .dt-grid--steps > .elementor-widget-wrap { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
  .dt-grid--3 > .elementor-widget-wrap,
  .dt-grid--4 > .elementor-widget-wrap,
  .dt-grid--stagger > .elementor-widget-wrap,
  .dt-grid--pledge > .elementor-widget-wrap { grid-template-columns: 1fr; }
  .dt-grid--stagger > .elementor-widget-wrap > *:nth-child(even),
  .dt-grid--pledge > .elementor-widget-wrap > *:nth-child(2) { margin-top: 0 !important; }
}
@media (max-width: 520px) {
  .dt-grid--steps > .elementor-widget-wrap { grid-template-columns: 1fr; }
  .dt-grid--steps > .elementor-widget-wrap > *:nth-child(even) { margin-top: 0 !important; }
}

/* hero: headline column beside the illustration */
.dt-grid--hero > .elementor-widget-wrap {
  grid-template-columns: minmax(0, 1fr) minmax(0, .95fr);
  gap: clamp(28px, 4vw, 60px);
  align-items: center;
}
@media (max-width: 960px) {
  .dt-grid--hero > .elementor-widget-wrap { grid-template-columns: 1fr; }
  .dt-grid--hero > .elementor-widget-wrap > *:first-child { order: 2; }
}