/* Home Plaza: menuknop Projecten (site-breed) + kennisblok en projectenband op /totaalrenovatie/ */

/* menuknop in de desktopnavigatie */
.elementor-nav-menu--main .menu-item.hp-nav-projecten > a.elementor-item {
  display:inline-flex; align-items:center; gap:7px;
  margin:0 2px; padding:7px 13px !important; border:1.5px solid #ffd43b; border-radius:999px;
  color:#fff !important; font-weight:600; line-height:1.1;
  transition:background-color 150ms cubic-bezier(.22,1,.36,1), color 150ms cubic-bezier(.22,1,.36,1);
}
.elementor-nav-menu--main .menu-item.hp-nav-projecten > a.elementor-item::before {
  content:"" !important; position:static !important; display:inline-block !important; width:0 !important; height:0 !important;
  opacity:1 !important; transform:none !important; background:none !important; inset:auto !important;
  border-style:solid !important; border-width:5px 0 5px 8px !important; border-color:transparent transparent transparent #ffd43b !important;
  transition:border-color 150ms cubic-bezier(.22,1,.36,1);
}
.elementor-nav-menu--main .menu-item.hp-nav-projecten > a.elementor-item::after { display:none !important; }
.elementor-nav-menu--main .menu-item.hp-nav-projecten > a.elementor-item:hover,
.elementor-nav-menu--main .menu-item.hp-nav-projecten > a.elementor-item:focus-visible,
.elementor-nav-menu--main .menu-item.hp-nav-projecten.current-menu-item > a.elementor-item,
.elementor-nav-menu--main .menu-item.hp-nav-projecten.current-menu-ancestor > a.elementor-item { background:#ffd43b; color:#0d1727 !important; }
.elementor-nav-menu--main .menu-item.hp-nav-projecten > a.elementor-item:hover::before,
.elementor-nav-menu--main .menu-item.hp-nav-projecten > a.elementor-item:focus-visible::before,
.elementor-nav-menu--main .menu-item.hp-nav-projecten.current-menu-item > a.elementor-item::before,
.elementor-nav-menu--main .menu-item.hp-nav-projecten.current-menu-ancestor > a.elementor-item::before { border-color:transparent transparent transparent #0d1727 !important; }
.elementor-nav-menu--main .hp-nav-badge { display:none; }
/* ruimte maken voor de knop waar het menu krap is */
@media (min-width: 1025px) and (max-width: 1700px) {
  header.elementor-location-header[data-elementor-id="9527"] .elementor-nav-menu--main > .elementor-nav-menu > li > a.elementor-item { padding-left:6px !important; padding-right:6px !important; font-size:13px !important; }
  header.elementor-location-header[data-elementor-id="9527"] .elementor-nav-menu--main > .elementor-nav-menu > li.hp-nav-projecten > a.elementor-item { padding:7px 12px !important; margin:0 2px; }
}
header.elementor-location-header[data-elementor-id="9527"] .elementor-nav-menu--main > .elementor-nav-menu > li.hp-nav-projecten > a.elementor-item { padding:7px 13px !important; }
@media (min-width: 1025px) and (max-width: 1439px) {
  header.elementor-location-header[data-elementor-id="9527"] .elementor-nav-menu--main > .elementor-nav-menu > li > a.elementor-item { padding-left:4px !important; padding-right:4px !important; }
  header.elementor-location-header[data-elementor-id="9527"] .elementor-nav-menu--main > .elementor-nav-menu > li.hp-nav-projecten > a.elementor-item { padding:6px 10px !important; }
}
/* in het uitklapmenu (mobiel) */
.elementor-nav-menu--dropdown .menu-item.hp-nav-projecten > a { color:#0d1727 !important; font-weight:700 !important; }
.elementor-nav-menu--dropdown .hp-nav-badge { display:inline-block; margin-left:8px; font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; background:#ffd43b; color:#0d1727; padding:3px 8px; border-radius:999px; vertical-align:middle; }

/* projectenband */
.hp-tb-proj { background:var(--total-ink,#0d1727); color:#fff; padding:var(--total-2xl,5.5rem) 0; }
.hp-tb-proj__grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.25fr); gap:clamp(2rem,5vw,4.5rem); align-items:center; }
.hp-tb-proj .total-kicker { color:var(--total-yellow,#ffd43b); }
.hp-tb-proj h2 { color:#fff; max-width:14ch; margin-bottom:var(--total-md,1.5rem); font-size:clamp(2.4rem,4.2vw,4.2rem); }
.hp-tb-proj__copy p { color:#d9dde3; font-size:1.125rem; line-height:1.6; max-width:46ch; margin:0; }
.hp-tb-proj__actions { display:flex; flex-wrap:wrap; align-items:center; gap:14px 26px; margin-top:var(--total-lg,2.25rem); }
.hp-tb-proj__link { color:#fff; font-weight:600; text-decoration:underline; text-decoration-color:var(--total-yellow,#ffd43b); text-decoration-thickness:2px; text-underline-offset:5px; }
.hp-tb-proj__link:hover { color:var(--total-yellow,#ffd43b); }
.hp-tb-proj__media { position:relative; display:block; }
.hp-tb-proj__media video { display:block; width:100%; aspect-ratio:16 / 9; object-fit:cover; background:#000; }
.hp-tb-proj__badge { position:absolute; left:16px; bottom:16px; background:var(--total-yellow,#ffd43b); color:var(--total-ink,#0d1727); font-size:.8rem; font-weight:600; letter-spacing:.06em; text-transform:uppercase; padding:7px 12px; }
.hp-tb-proj__media:focus-visible { outline:3px solid var(--total-yellow,#ffd43b); outline-offset:4px; }

/* kennisblok onderaan */
.hp-tb { background:var(--total-paper,#fff); color:var(--total-ink,#0d1727); padding:var(--total-2xl,5.5rem) 0; border-top:1px solid var(--total-rule,#d8d9d5); }
.hp-tb__head { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(1.5rem,4vw,4rem); align-items:end; margin-bottom:var(--total-xl,3.5rem); }
.hp-tb__head .total-kicker { grid-column:1 / -1; margin:0; }
.hp-tb h2 { font-family:var(--total-display,Georgia,serif); font-weight:400; letter-spacing:-.03em; line-height:1.04; font-size:clamp(2.3rem,4vw,3.8rem); max-width:14ch; margin:0; }
.hp-tb__head > p { margin:0; color:var(--total-muted,#52606d); font-size:1.125rem; max-width:44ch; }
.hp-tb__list { list-style:none; margin:0; padding:0; border-top:1px solid var(--total-rule,#d8d9d5); }
.hp-tb__item { display:grid; grid-template-columns:3.5rem minmax(0,.9fr) minmax(0,1.4fr); gap:1rem clamp(1.5rem,3vw,3rem); padding:var(--total-lg,2.25rem) 0; border-bottom:1px solid var(--total-rule,#d8d9d5); }
.hp-tb__num { font-family:var(--total-body,Arial,sans-serif); font-size:.85rem; font-weight:600; color:var(--total-muted,#52606d); padding-top:.45rem; font-variant-numeric:tabular-nums; }
.hp-tb__item h3 { font-family:var(--total-display,Georgia,serif); font-weight:400; font-size:clamp(1.5rem,2.2vw,2rem); line-height:1.15; letter-spacing:-.02em; margin:0; max-width:20ch; }
.hp-tb__body { font-family:var(--total-body,Arial,sans-serif); font-size:1.0625rem; line-height:1.65; color:#29323f; }
.hp-tb__body p { margin:0 0 1rem; max-width:62ch; } .hp-tb__body p:last-child { margin-bottom:0; }
.hp-tb__body ul { list-style:none; margin:0 0 1rem; padding:0; }
.hp-tb__body ul li { position:relative; padding:.45rem 0 .45rem 1.6rem; border-top:1px solid #eceae4; }
.hp-tb__body ul li:last-child { border-bottom:1px solid #eceae4; }
.hp-tb__body ul li::before { content:""; position:absolute; left:0; top:.95rem; width:.6rem; height:.6rem; background:var(--total-yellow,#ffd43b); }
.hp-tb__body a:not(.hp-antwoord__button) { color:inherit; text-decoration:underline; text-decoration-color:var(--total-yellow,#ffd43b); text-decoration-thickness:2px; text-underline-offset:3px; }
.hp-tb .hp-tb__body a.hp-antwoord__button { display:inline-flex; margin-top:.5rem; padding:.85rem 1.4rem; background:var(--total-yellow,#ffd43b) !important; color:var(--total-ink,#0d1727) !important; border:0 !important; font-weight:600; text-decoration:none; border-radius:999px; }
.hp-tb .hp-tb__body a.hp-antwoord__button:hover { background:#f5c400 !important; }
.hp-tb__aid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.2fr); gap:clamp(1.5rem,4vw,4rem); margin-top:var(--total-xl,3.5rem); padding:clamp(2rem,4vw,3.5rem); background:var(--total-ink,#0d1727); color:#fff; }
.hp-tb__aid .total-kicker { color:var(--total-yellow,#ffd43b); margin:0 0 .75rem; }
.hp-tb__aid h3 { font-family:var(--total-display,Georgia,serif); font-weight:400; font-size:clamp(1.8rem,2.8vw,2.6rem); line-height:1.08; letter-spacing:-.02em; margin:0 0 1rem; color:#fff; }
.hp-tb__aid p { color:#d9dde3; margin:0; max-width:46ch; }
.hp-tb__aid ol { list-style:none; counter-reset:hpaid; margin:0; padding:0; }
.hp-tb__aid ol li { counter-increment:hpaid; display:grid; grid-template-columns:2.75rem 1fr; gap:.75rem; padding:1rem 0; border-top:1px solid rgba(255,255,255,.16); color:#fff; font-size:1.0625rem; line-height:1.5; }
.hp-tb__aid ol li::before { content:counter(hpaid, decimal-leading-zero); color:var(--total-yellow,#ffd43b); font-weight:600; font-variant-numeric:tabular-nums; }

@media (max-width: 860px) {
  .hp-tb-proj__grid, .hp-tb__head, .hp-tb__aid { grid-template-columns:minmax(0,1fr); }
  .hp-tb__item { grid-template-columns:2.5rem minmax(0,1fr); }
  .hp-tb__item .hp-tb__body { grid-column:2; }
}
@media (prefers-reduced-motion: reduce) {
  .elementor-nav-menu--main .menu-item.hp-nav-projecten > a.elementor-item, .elementor-nav-menu--main .menu-item.hp-nav-projecten > a.elementor-item::before { transition:none !important; }
}
