/* ============================================================
   AIESEC GLOBAL DESIGN SYSTEM — aiesec.hr
   Suffix: 69237c0c
   Reference: Postani član page
   Breakpoints: 375, 390, 430, 768, 1024, 1280, 1440
   ============================================================ */

/* ----------------------------------------------------------
   1. CSS CUSTOM PROPERTIES
   ---------------------------------------------------------- */
:root {
  --aiesec-blue:       #037EF3;
  --aiesec-navy:       #1C244B;
  --aiesec-white:      #FFFFFF;
  --aiesec-light-blue: #EAF5FF;
  --aiesec-font:       'Montserrat', sans-serif;

  --section-pad-desktop: 80px;
  --section-pad-mobile:  48px;
  --container-max:       1280px;
  --card-radius:         12px;
  --btn-radius:          50px;
}

/* ----------------------------------------------------------
   2. KILL ALL GREEN EVERYWHERE
   ---------------------------------------------------------- */
/* Elementor accent / Kit accent colour is #61CE70 — override all usages */
a,
button,
.elementor-button,
.elementor-widget-button .elementor-button,
.elementor-icon,
.elementor-icon-box-icon,
.wp-block-button__link {
  /* only override if currently green */
}

/* Green class overrides — catch-all */
[style*="color: #61CE70"],
[style*="color:#61CE70"],
[style*="background-color: #61CE70"],
[style*="background-color:#61CE70"],
[style*="color: rgb(97, 206, 112)"],
[style*="background: #61CE70"] {
  color:            var(--aiesec-blue) !important;
  background-color: transparent !important;
}

/* Elementor Kit accent override — replaces green globally */
.e-global-color-accent,
.elementor-color-accent {
  color: var(--aiesec-blue) !important;
}

/* ----------------------------------------------------------
   3. HELLO THEME NATIVE HEADER — FULLY HIDDEN
   (our PHP snippet renders the real header)
   ---------------------------------------------------------- */
header#site-header,
header.site-header,
.site-header,
.hfe-header,
.elementor-location-header {
  display: none !important;
}

/* Body offset for our custom fixed header */
body {
  padding-top: 0 !important;
  margin-top:  0 !important;
}

/* ----------------------------------------------------------
   4. HERO SECTIONS — GLOBAL RESPONSIVE
   Every hero on every page gets sane mobile sizing.
   Selector targets Elementor sections with background images
   that serve as hero sections.
   ---------------------------------------------------------- */

/* Give body top padding equal to the custom header height so
   hero content starts below the header (header is position:fixed) */
body:not(.admin-bar) {
  padding-top: 80px !important;
}
body.admin-bar {
  padding-top: calc(80px + var(--wp-admin--admin-bar--height, 32px)) !important;
}

/* First Elementor section on each page = hero — remove the
   forced 100vh so it scales to content on mobile */
.elementor-section:first-of-type,
.elementor-container > .e-con:first-child,
.e-con > .e-con:first-child {
  /* Do not force 100vh */
}

/* Hero sections with background images — identified by
   Elementor class pattern */
.elementor-section[data-element_type="section"] .elementor-background-overlay,
.e-con .elementor-background-overlay {
  background-color: rgba(28, 36, 75, 0.45) !important;
}

/* ----------------------------------------------------------
   5. TYPOGRAPHY — RESPONSIVE clamp()
   ---------------------------------------------------------- */

/* H1 — hero main headline */
.elementor-widget-heading .elementor-heading-title.elementor-size-xxl,
.elementor-widget-heading h1 {
  font-size: clamp(28px, 5.5vw, 68px) !important;
  line-height: 1.15 !important;
  letter-spacing: -0.5px !important;
}

/* H2 — section titles */
.elementor-widget-heading .elementor-heading-title.elementor-size-xl,
.elementor-widget-heading h2 {
  font-size: clamp(22px, 3.8vw, 48px) !important;
  line-height: 1.2 !important;
}

/* H3 — card titles, sub-headings */
.elementor-widget-heading .elementor-heading-title.elementor-size-large,
.elementor-widget-heading h3 {
  font-size: clamp(18px, 2.5vw, 28px) !important;
  line-height: 1.3 !important;
}

/* Body copy */
.elementor-widget-text-editor p,
.elementor-widget-text-editor,
.elementor-text-editor {
  font-size: clamp(14px, 1.6vw, 17px) !important;
  line-height: 1.7 !important;
}

/* ----------------------------------------------------------
   6. BUTTONS — UNIFIED AIESEC STYLE
   ---------------------------------------------------------- */
.elementor-button,
.elementor-widget-button .elementor-button {
  border-radius: var(--btn-radius) !important;
  font-weight:   700 !important;
  font-size:     clamp(13px, 1.4vw, 16px) !important;
  padding:       14px 32px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  transition:    all 0.25s ease !important;
  border:        2px solid transparent !important;
}

/* Primary CTA — blue */
.elementor-button.elementor-button-info,
.elementor-button[style*="background-color: #037EF3"],
.elementor-button[style*="background-color:#037EF3"] {
  background-color: var(--aiesec-blue) !important;
  color:            var(--aiesec-white) !important;
  border-color:     var(--aiesec-blue) !important;
}
.elementor-button.elementor-button-info:hover {
  background-color: #025cc4 !important;
  border-color:     #025cc4 !important;
}

/* Override any green button */
.elementor-button[style*="background-color: #61CE70"],
.elementor-button[style*="background-color:#61CE70"],
.elementor-button[style*="background: #61CE70"] {
  background-color: var(--aiesec-blue) !important;
  border-color:     var(--aiesec-blue) !important;
  color:            var(--aiesec-white) !important;
}

/* ----------------------------------------------------------
   7. SECTION SPACING — MOBILE COMPACTION
   ---------------------------------------------------------- */
@media screen and (max-width: 767px) {
  /* Remove massive min-heights from Elementor sections */
  .elementor-section,
  .e-con {
    min-height: unset !important;
  }

  /* Compact section padding */
  .elementor-section > .elementor-container,
  .elementor-section.elementor-section-boxed > .elementor-container {
    padding-left:  20px !important;
    padding-right: 20px !important;
  }

  .elementor-section {
    padding-top:    48px !important;
    padding-bottom: 48px !important;
  }

  /* Hero first section — less top padding since header covers it */
  .elementor-section:first-of-type {
    padding-top:    60px !important;
    padding-bottom: 60px !important;
    min-height:     unset !important;
  }

  /* Card grid — single column */
  .elementor-column.elementor-col-33,
  .elementor-column.elementor-col-25 {
    width: 100% !important;
  }

  /* Card padding */
  .elementor-widget-wrap {
    padding: 24px !important;
  }

  /* Remove huge spacers */
  .elementor-widget-spacer .elementor-spacer-inner {
    height: 20px !important;
  }

  /* Image not too tall on mobile */
  .elementor-widget-image img {
    max-height: 280px;
    width:      100%;
    object-fit: cover;
  }

  /* Testimonial/member cards */
  .elementor-widget-testimonial,
  .elementor-testimonial-wrapper {
    min-height: unset !important;
    height:     auto !important;
  }

  /* Remove 100vh sections on mobile */
  [style*="min-height: 100vh"],
  [style*="min-height:100vh"] {
    min-height: 60vh !important;
  }
}

/* Tablet — 768px */
@media screen and (min-width: 768px) and (max-width: 1023px) {
  .elementor-section {
    padding-top:    64px !important;
    padding-bottom: 64px !important;
  }
  .elementor-section:first-of-type {
    padding-top:    80px !important;
    padding-bottom: 80px !important;
  }
}

/* ----------------------------------------------------------
   8. CARDS — CONSISTENT DESIGN
   ---------------------------------------------------------- */
.elementor-widget-image-box .elementor-image-box-wrapper,
.elementor-widget-icon-box .elementor-icon-box-wrapper {
  border-radius:    var(--card-radius) !important;
  background-color: var(--aiesec-white) !important;
  padding:          28px !important;
  box-shadow:       0 4px 20px rgba(3, 126, 243, 0.08) !important;
  height:           auto !important;
  min-height:       unset !important;
}

/* ----------------------------------------------------------
   9. IMAGES / HERO OVERLAY CONSISTENCY
   ---------------------------------------------------------- */
/* Ensure hero backgrounds have overlay for text legibility */
.elementor-section[data-settings*='background_background":"classic"'] {
  position: relative;
}

/* ----------------------------------------------------------
   10. MOBILE HORIZONTAL SCROLL PREVENTION
   ---------------------------------------------------------- */
html, body {
  overflow-x: hidden !important;
  max-width:  100vw !important;
}
.elementor {
  overflow-x: hidden;
}

/* ----------------------------------------------------------
   11. CONTACT PAGE — Kontakt
   ---------------------------------------------------------- */
.page-id-30 .elementor-section:first-of-type {
  background-color: var(--aiesec-navy) !important;
}

/* ----------------------------------------------------------
   12. LC PAGES — consistent hero Navy overlay
   ---------------------------------------------------------- */
.page-id-1614 .elementor-section:first-of-type .elementor-background-overlay,
.page-id-1651 .elementor-section:first-of-type .elementor-background-overlay,
.page-id-1445 .elementor-section:first-of-type .elementor-background-overlay,
.page-id-1714 .elementor-section:first-of-type .elementor-background-overlay,
.page-id-1465 .elementor-section:first-of-type .elementor-background-overlay {
  background-color: rgba(28, 36, 75, 0.5) !important;
}

/* ----------------------------------------------------------
   13. FOOTER PADDING UNDER FIXED HEADER
   ---------------------------------------------------------- */
footer.site-footer,
#colophon {
  margin-top: 0;
}

/* ----------------------------------------------------------
   14. REMOVE BODY TOP PADDING FROM OLD SNIPPETS
   Overwrite any leftover body padding that creates whitespace
   ---------------------------------------------------------- */
@media screen and (max-width: 767px) {
  body:not(.admin-bar) {
    padding-top: 72px !important;
  }
  body.admin-bar {
    padding-top: calc(72px + 46px) !important;
  }
}