/* PreIPO Pro Replacement — baseline styles for the stand-in widgets.
   Brand accent taken from the header menu hover colour. */
:root {
  --pp-accent: #D4FF58;
  --pp-ink: #111827;
  --pp-muted: #6b7280;
  --pp-radius: 10px;
}

/* ------------------------------------------------------------ nav menu */
.pp-nav { position: relative; }
.pp-nav__list, .pp-nav__list ul { list-style: none; margin: 0; padding: 0; }
.pp-nav__list { display: flex; align-items: center; gap: clamp(14px, 2vw, 32px); }
.pp-nav--vertical .pp-nav__list { flex-direction: column; align-items: flex-start; gap: 10px; }
.pp-nav__list li { position: relative; }
.pp-nav__list a {
  display: inline-flex; align-items: center; gap: 6px; padding: 8px 0;
  font-size: var(--pp-nav-size, 14px); font-weight: var(--pp-nav-weight, 500); line-height: 1.2;
  color: var(--pp-nav-color, inherit); text-decoration: none; transition: color .18s ease;
}
.pp-nav__list a:hover, .pp-nav__list a:focus-visible,
.pp-nav__list .current-menu-item > a, .pp-nav__list .current-menu-ancestor > a { color: var(--pp-nav-hover, var(--pp-accent)); }
.pp-nav__list .current-menu-item > a { color: var(--pp-nav-active, var(--pp-nav-hover, var(--pp-accent))); }
.pp-nav--horizontal .pp-nav__list > li > a::after {
  content: ""; position: absolute; left: 0; bottom: 0; width: 0; height: 1px;
  background: var(--pp-nav-hover, var(--pp-accent)); transition: width .22s ease;
}
.pp-nav--horizontal .pp-nav__list > li:hover > a::after,
.pp-nav--horizontal .pp-nav__list > li.current-menu-item > a::after { width: 100%; }
.pp-nav__list .menu-item-has-children > a::before {
  content: ""; order: 2; width: 6px; height: 6px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor;
  transform: translateY(-2px) rotate(45deg);
}
.pp-nav__list ul.sub-menu {
  position: absolute; top: 100%; left: 0; z-index: 60; min-width: 220px; padding: 8px 0;
  background: #fff; border-radius: var(--pp-radius); box-shadow: 0 10px 30px rgba(0,0,0,.14);
  opacity: 0; visibility: hidden; transform: translateY(8px); transition: opacity .18s, transform .18s, visibility .18s;
}
.pp-nav__list li:hover > ul.sub-menu, .pp-nav__list li:focus-within > ul.sub-menu { opacity: 1; visibility: visible; transform: none; }
.pp-nav__list ul.sub-menu a { display: block; padding: 10px 18px; color: var(--pp-ink); white-space: nowrap; }
.pp-nav__list ul.sub-menu a:hover { background: #f4f6fb; color: var(--pp-ink); }
.pp-nav .pp-nav__toggle { display: none; line-height: 0; width: 44px; height: 44px; padding: 0; background: transparent; border: 1px solid var(--pp-nav-toggle, var(--pp-nav-color, currentColor)); border-radius: 4px; cursor: pointer; align-items: center; justify-content: center; }
.pp-nav__toggle span, .pp-nav__toggle span::before, .pp-nav__toggle span::after { display: block; width: 22px; height: 2px; background: var(--pp-nav-toggle, var(--pp-nav-color, currentColor)); position: relative; transition: transform .2s, top .2s, background .2s; }
.pp-nav__toggle span::before, .pp-nav__toggle span::after { content: ""; position: absolute; left: 0; }
.pp-nav__toggle span::before { top: -7px; } .pp-nav__toggle span::after { top: 7px; }
.pp-nav.is-open .pp-nav__toggle span { background: transparent; }
.pp-nav.is-open .pp-nav__toggle span::before { top: 0; transform: rotate(45deg); }
.pp-nav.is-open .pp-nav__toggle span::after { top: 0; transform: rotate(-45deg); }
@media (max-width: 1024px) {
  .elementor-widget.elementor-widget-nav-menu { min-width: 44px !important; flex: 0 0 auto; }
  .pp-nav.pp-nav--horizontal { display: flex; justify-content: flex-end; width: 100%; }
  .pp-nav.pp-nav--horizontal .pp-nav__toggle { display: inline-flex; flex: 0 0 auto; }
  .pp-nav--horizontal .pp-nav__list {
    display: none; position: absolute; top: calc(100% + 12px); right: 0; z-index: 70; flex-direction: column; align-items: stretch; gap: 0;
    width: min(320px, calc(100vw - 32px)); max-height: min(70vh, 520px); overflow-y: auto; padding: 10px 0;
    background: #fff; border-radius: var(--pp-radius); box-shadow: 0 10px 30px rgba(0,0,0,.18);
  }
  .pp-nav--horizontal.is-open .pp-nav__list { display: flex; }
  .pp-nav--horizontal .pp-nav__list a { padding: 12px 20px; color: var(--pp-ink); }
  .pp-nav--horizontal .pp-nav__list a:hover, .pp-nav--horizontal .pp-nav__list .current-menu-item > a { color: #000; }
  .pp-nav--horizontal .pp-nav__list > li > a::after { display: none; }
  .pp-nav--horizontal .pp-nav__list ul.sub-menu { position: static; opacity: 1; visibility: visible; transform: none; box-shadow: none; background: #f7f8fb; border-radius: 0; display: none; padding: 0 0 6px; }
  .pp-nav--horizontal .pp-nav__list li.is-open > ul.sub-menu { display: block; }
  .pp-nav--horizontal .pp-nav__list ul.sub-menu a { padding-left: 34px; }
}

/* ---------------------------------------------------------------- logo */
.pp-logo { display: inline-block; line-height: 0; }
.pp-logo__img { max-width: 100%; height: auto; }
.pp-logo__text { font-weight: 700; font-size: 20px; line-height: 1; }

/* -------------------------------------------------------------- search */
.pp-search {
  display: flex; align-items: center; gap: 4px; height: 44px; max-width: 100%; padding: 0 10px 0 6px;
  border: 1px solid currentColor; border-radius: 999px; background: transparent; box-sizing: border-box;
}
.pp-search__btn {
  flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; padding: 0;
  color: inherit; background: transparent !important; border: 0 !important; border-radius: 50%; cursor: pointer; opacity: .85;
}
.pp-search__input {
  flex: 1 1 auto; min-width: 0; height: 100%; padding: 0 6px; font: inherit; font-size: 14px;
  color: inherit; background: transparent !important; border: 0 !important; outline: none; box-shadow: none !important;
}
.pp-search__input::placeholder { color: currentColor; opacity: .7; }
.pp-search:focus-within { opacity: 1; }
.pp-search-results__inner { max-width: 1200px; margin: 0 auto; padding: 48px 16px; }
.pp-search-results__title { font-size: clamp(24px, 3vw, 36px); margin: 0 0 20px; }
.pp-search--page { max-width: 520px; margin: 0 0 32px; color: var(--pp-ink); }

/* ---------------------------------------------------------------- forms */
.pp-form .elementor-form-fields-wrapper { display: flex; flex-wrap: wrap; margin: 0 -8px; }
.pp-form .elementor-field-group { display: flex; flex-direction: column; padding: 0 8px; margin-bottom: 16px; width: 100%; box-sizing: border-box; }
.pp-form .elementor-col-50 { width: 50%; } .pp-form .elementor-col-33 { width: 33.333%; } .pp-form .elementor-col-25 { width: 25%; } .pp-form .elementor-col-66 { width: 66.666%; } .pp-form .elementor-col-75 { width: 75%; }
@media (max-width: 767px) { .pp-form .elementor-field-group { width: 100% !important; } }
.pp-form .elementor-field-label { display: block; width: 100%; font-size: 15px; margin-bottom: 8px; }
/* labels always above the field, whatever Elementor's label-position CSS says */
.pp-form .elementor-form-fields-wrapper .elementor-field-group { flex-direction: column; align-items: stretch; flex-wrap: nowrap; }
.pp-form .elementor-form-fields-wrapper .elementor-field-group > .elementor-field { flex: 0 0 auto; width: 100%; max-width: none; }
.pp-req { color: #e63946; }
.pp-form .pp-input {
  width: 100%; padding: 12px 14px; font: inherit; font-size: 15px; color: var(--pp-ink);
  background: #fff; border: 1px solid #d9dee9; border-radius: 6px; outline: none; box-sizing: border-box;
  transition: border-color .18s, box-shadow .18s;
}
.pp-form textarea.pp-input { min-height: 110px; resize: vertical; }
.pp-form .pp-input:focus { border-color: var(--pp-ink); box-shadow: 0 0 0 3px rgba(17,24,39,.12); }
.pp-form .has-error .pp-input { border-color: #e63946; box-shadow: 0 0 0 3px rgba(230,57,70,.12); }
.pp-form__error { display: none; margin-top: 5px; font-size: 13px; color: #e63946; }
.pp-form .has-error .pp-form__error { display: block; }
.pp-form__hp { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.pp-form__submit { width: 100%; cursor: pointer; border-radius: 999px; }
.pp-form .elementor-field-type-submit { display: flex; }
.pp-form__submit[disabled] { opacity: .6; cursor: progress; }
.pp-form__note { display: none; margin-top: 12px; padding: 12px 14px; font-size: 15px; border-radius: var(--pp-radius); }
.pp-form__note.is-visible { display: block; }
.pp-form__note.is-ok { color: #0f5132; background: #d6f3e3; }
.pp-form__note.is-fail { color: #842029; background: #fbdcdc; }
.pp-check { display: flex; gap: 8px; align-items: flex-start; font-size: 14px; }

/* ------------------------------------------------------- loop grid / carousel */
.pp-loop, .pp-carousel {
  display: grid; grid-template-columns: repeat(var(--pp-cols, 3), minmax(0, 1fr));
  column-gap: var(--pp-gap, 24px); row-gap: var(--pp-rgap, var(--pp-gap, 24px));
}
.pp-loop__item > .elementor, .pp-carousel__item > .elementor { height: 100%; }
@media (max-width: 1024px) { .pp-loop, .pp-carousel { grid-template-columns: repeat(var(--pp-cols-t, 2), minmax(0, 1fr)); } }
@media (max-width: 767px) { .pp-loop, .pp-carousel { grid-template-columns: repeat(var(--pp-cols-m, 1), minmax(0, 1fr)); } }
.pp-loop__empty { color: var(--pp-muted); }
.pp-loop__pagination { margin-top: 32px; }
.pp-loop__pagination ul { list-style: none; display: flex; flex-wrap: wrap; gap: 6px; padding: 0; margin: 0; justify-content: center; }
.pp-loop__pagination a, .pp-loop__pagination span { display: inline-block; min-width: 38px; padding: 8px 12px; text-align: center; border: 1px solid #d9dee9; border-radius: 8px; text-decoration: none; color: var(--pp-ink); }
.pp-loop__pagination .current { background: var(--pp-ink); color: #fff; border-color: var(--pp-ink); }

/* ------------------------------------------------------- post widgets */
.pp-post-title a { color: inherit; text-decoration: none; }
.pp-post-image img { width: 100%; height: auto; display: block; border-radius: var(--pp-radius); }
.pp-post-info { display: flex; flex-wrap: wrap; gap: 6px 18px; list-style: none; padding: 0; margin: 0; font-size: 14px; color: var(--pp-muted); }
.pp-post-info .elementor-icon-list-icon { margin-right: 6px; }
.pp-post-nav { display: flex; justify-content: space-between; gap: 20px; margin: 40px 0; padding-top: 24px; border-top: 1px solid #e5e7eb; }
.pp-post-nav__next { text-align: right; margin-left: auto; }
.pp-post-nav a { display: inline-flex; flex-direction: column; gap: 4px; text-decoration: none; color: inherit; }
.pp-post-nav__label { font-size: 12px; text-transform: uppercase; letter-spacing: .06em; color: var(--pp-muted); }
.pp-post-nav__title { font-weight: 600; }
.pp-share { display: flex; gap: 10px; }
.pp-share__btn { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 50%; background: #f1f3f7; color: var(--pp-ink); text-decoration: none; transition: background .18s, color .18s; }
.pp-share__btn:hover { background: var(--pp-ink); color: #fff; }

/* -------------------------------------------------------------- popups */
.pp-modal[hidden] { display: none; }
.pp-modal { position: fixed; inset: 0; z-index: 9999; display: flex; align-items: center; justify-content: center; padding: 16px; }
.pp-modal__backdrop { position: absolute; inset: 0; background: rgba(0,0,0,.6); }
.pp-modal__box { position: relative; width: min(560px, 100%); max-height: 92vh; overflow: auto; background: #fff; border-radius: 14px; box-shadow: 0 24px 60px rgba(0,0,0,.35); animation: pp-pop .22s ease; }
.pp-modal__close { position: absolute; top: 8px; right: 8px; z-index: 2; width: 36px; height: 36px; border: 0; border-radius: 50%; background: #111; color: #fff; font-size: 22px; line-height: 1; cursor: pointer; }
body.pp-modal-open { overflow: hidden; }
@keyframes pp-pop { from { transform: translateY(12px); opacity: 0; } to { transform: none; opacity: 1; } }

/* ---------------------------------------- theme overrides (Hello underlines) */
.page-content .pp-loop a, .page-content .pp-carousel a, .page-content .pp-post-title a,
.elementor .pp-loop a, .elementor .pp-carousel a, .elementor .pp-post-title a,
.elementor-widget-theme-post-title .elementor-heading-title > a { text-decoration: none; }
.elementor .pp-post-title a, .elementor-widget-theme-post-title .elementor-heading-title > a { color: inherit; }
.pp-loop__item .elementor-widget-heading .elementor-heading-title > a { color: inherit; }

/* On our templates the Turbo header/footer replace the theme ones */
body.pp-turbo #site-header, body.pp-turbo #site-footer { display: none !important; }
/* Hello limits non-Elementor pages to 800px; our templates are full Elementor layouts */
body.pp-turbo .site-main, body.pp-turbo #content.site-main { max-width: none; width: 100%; margin: 0; padding: 0; }
