/*
 * Elementor bridge.
 *
 * The pages are Elementor documents (see wordpress/scripts/elementor-seed.php)
 * that reuse the theme's own class names. This sheet maps Elementor's widget
 * markup and flex containers onto the design tokens in main.css so a converted
 * page renders like the hand-coded template it replaced.
 *
 * Loaded only when Elementor is active, after main.css.
 */

/* ---------------------------------------------------------------- *
 * Containers
 * ---------------------------------------------------------------- */

/* Theme grids beat Elementor's flex container. */
.e-con.stats-grid,
.e-con.cards-3,
.e-con.cards-4,
.e-con.contact-grid,
.e-con.edu-ach-grid,
.e-con.about-intro,
.e-con.mini-stats {
  display: grid !important;
}

.e-con.section-head {
  max-width: 48rem;
  margin-inline: auto !important;
  margin-bottom: 2.75rem !important;
  text-align: center;
}
.e-con.section-head.left {
  text-align: left;
  margin-inline: 0 !important;
}

/* Inner pages keep the theme's reading width (.container.narrow). */
.e-con.se-narrow > .e-con-inner {
  max-width: 48rem;
}

/* Hero content sits above the Elementor background overlay. */
.e-con.hero > .e-con-inner {
  position: relative;
  z-index: 1;
}

.e-con.hero-cta {
  margin-bottom: 2.5rem;
}

.e-con.stats-grid {
  margin-bottom: 2rem;
}

.e-con.about-photo-wrap {
  max-width: 360px !important;
  margin-inline: auto !important;
}

.e-con.about-intro {
  margin-bottom: 2.5rem;
}

/* Cards and panels bring their own padding from main.css; Elementor sets it
   per element, so only the shared bits need help here. */
.e-con.card,
.e-con.panel {
  height: 100%;
}

/* ---------------------------------------------------------------- *
 * Headings
 * ---------------------------------------------------------------- */

.se-hero-title .elementor-heading-title {
  font-size: clamp(1.9rem, 5vw, 3.5rem);
  line-height: 1.15;
  font-weight: 800;
  margin: 0 0 1rem;
  color: inherit;
}

.section-head .se-head-title .elementor-heading-title {
  margin: 0 0 0.85rem;
  color: var(--gray-900);
  font-size: clamp(1.85rem, 4vw, 2.85rem);
  line-height: 1.2;
  font-weight: 800;
}

.se-head-title.gradient-title .elementor-heading-title {
  background: linear-gradient(90deg, var(--teal-700), var(--teal-500), #0ea5e9);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.se-head-sub {
  color: var(--gray-600);
  font-size: 1.05rem;
}
.se-head-sub p {
  margin: 0;
}

.se-eyebrow-wrap p {
  margin: 0;
}

.subhead .elementor-heading-title {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--gray-900);
  line-height: 1.3;
}
.e-con .subhead {
  margin-bottom: 1.75rem;
}

/* Stat cards: the wrapper classes carry the type, the heading inherits it. */
.stat-num .elementor-heading-title,
.stat-label .elementor-heading-title {
  font-size: inherit;
  font-weight: inherit;
  color: inherit;
  line-height: 1.3;
}

.se-hero-sub {
  max-width: 42rem;
  margin: 0 auto 2rem;
  color: #d1d5db;
  font-size: clamp(1rem, 2vw, 1.25rem);
  line-height: 1.7;
}
.se-hero-sub p {
  margin: 0;
}

.se-trust p {
  margin: 0;
}

/* ---------------------------------------------------------------- *
 * Buttons
 * ---------------------------------------------------------------- */

.se-btn .elementor-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  padding: 0.75rem 1.35rem;
  border-radius: 0.75rem;
  font-weight: 600;
  font-size: 1rem;
  line-height: 1.4;
  border: 2px solid transparent;
  transition: 0.2s ease;
  text-decoration: none;
}
.se-btn .elementor-button-content-wrapper {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
}
.se-btn .elementor-button-icon {
  margin: 0;
}

.se-btn-primary .elementor-button {
  background-color: var(--teal-600) !important;
  border-color: var(--teal-600) !important;
  color: var(--white) !important;
}
.se-btn-primary .elementor-button:hover {
  background-color: var(--teal-700) !important;
  border-color: var(--teal-700) !important;
}

.se-btn-outline .elementor-button {
  background-color: transparent !important;
  border-color: var(--teal-400) !important;
  color: var(--teal-400) !important;
}
.se-btn-outline .elementor-button:hover {
  background-color: rgba(45, 212, 191, 0.12) !important;
}

.se-btn-dark .elementor-button {
  background-color: transparent !important;
  border-color: #d1d5db !important;
  color: var(--gray-800) !important;
}
.se-btn-dark .elementor-button:hover {
  border-color: var(--teal-600) !important;
  color: var(--teal-700) !important;
}

.se-btn-block .elementor-button {
  width: 100%;
}
.se-btn-block {
  margin-top: 0.75rem;
}
.se-btn-spaced {
  margin-top: 1.5rem;
}

/* ---------------------------------------------------------------- *
 * Icon boxes: service cards and panel headings
 * ---------------------------------------------------------------- */

/* Elementor re-centres icon boxes at mobile breakpoints; the cards are
   left-aligned at every size in this design. */
.se-service-box .elementor-icon-box-wrapper {
  text-align: left !important;
}
.se-service-box .elementor-icon {
  width: 3.5rem;
  height: 3.5rem;
  border-radius: 0.85rem;
  background: var(--teal-50);
  display: grid;
  place-items: center;
  color: var(--teal-600);
  font-size: 1.4rem;
  transition: transform 0.25s;
}
.se-service-box .elementor-icon-box-icon {
  margin-bottom: 1.15rem;
}
.service-card:hover .se-service-box .elementor-icon {
  transform: scale(1.08);
}
.se-service-box .elementor-icon-box-title,
.se-service-box .elementor-icon-box-title > span {
  margin: 0 0 0.55rem;
  color: var(--gray-900);
  font-size: 1.15rem;
  font-weight: 700;
  line-height: 1.4;
}
.se-service-box .elementor-icon-box-description {
  margin: 0 0 1rem;
  color: var(--gray-600);
  font-size: 0.95rem;
  line-height: 1.6;
}
.se-card-link p {
  margin: 0;
}

.se-panel-head {
  padding-bottom: 1rem;
  margin-bottom: 1.25rem;
  border-bottom: 1px solid var(--gray-200);
}
.se-panel-head .elementor-icon-box-wrapper {
  display: flex;
  align-items: center;
  gap: 1rem;
  text-align: left !important;
  flex-direction: row !important;
}
.se-panel-head .elementor-icon-box-icon {
  margin: 0;
  flex-shrink: 0;
}
.se-panel-head .elementor-icon {
  width: 3.25rem;
  height: 3.25rem;
  border-radius: 0.75rem;
  display: grid;
  place-items: center;
  color: var(--white);
  box-shadow: var(--shadow);
  font-size: 1.25rem;
}
.se-panel-teal .elementor-icon {
  background: var(--teal-600);
}
.se-panel-amber .elementor-icon {
  background: var(--amber);
}
.se-panel-head .elementor-icon-box-title,
.se-panel-head .elementor-icon-box-title > span {
  margin: 0;
  font-size: 1.35rem;
  color: var(--gray-900);
  font-weight: 700;
  line-height: 1.3;
}
.se-panel-head .elementor-icon-box-description {
  display: none;
}

.se-panel-title .elementor-heading-title {
  margin: 0 0 1rem;
  font-size: 1.35rem;
  color: var(--gray-900);
  font-weight: 700;
}

/* ---------------------------------------------------------------- *
 * Media
 * ---------------------------------------------------------------- */

.se-about-photo img {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 400px;
  object-fit: cover;
  object-position: center top;
  border-radius: 1rem;
  box-shadow: var(--shadow-lg);
}

.se-video .elementor-wrapper {
  border-radius: 0.75rem;
  overflow: hidden;
  background: #000;
}
.se-video {
  margin-bottom: 0.85rem;
}
.se-video-title .elementor-heading-title {
  margin: 0 0 0.55rem;
  color: var(--gray-900);
  font-size: 1.15rem;
  font-weight: 700;
  line-height: 1.4;
}
.se-video-desc {
  color: var(--gray-600);
  font-size: 0.95rem;
}
.se-video-desc p {
  margin: 0;
}

/* ---------------------------------------------------------------- *
 * Rich-text blocks that carry the theme's own markup
 * ---------------------------------------------------------------- */

.se-rich > *:first-child {
  margin-top: 0;
}
.se-rich > *:last-child {
  margin-bottom: 0;
}
.se-rich .academic-box {
  margin-top: 0;
}

.card.testimonial p:last-child {
  margin-bottom: 0;
}

/* Elementor's editor preview lacks the theme's body wrapper, so keep the
   section rhythm visible while editing. */
.elementor-editor-active .e-con.section-head {
  margin-bottom: 2.75rem !important;
}

@media (max-width: 900px) {
  .e-con.about-intro,
  .e-con.edu-ach-grid,
  .e-con.mini-stats {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 720px) {
  .e-con.stats-grid {
    grid-template-columns: 1fr;
  }
  .se-about-photo img {
    height: 320px;
  }
}