/* Homepage-specifieke CSS (fase 1 extract uit base.css). */

.page-intro .homeplace-stats__link{
  color: rgba(255,255,255,.95);
  font-weight: 800;
  text-decoration: none;
  border-bottom: 1px solid rgba(255,255,255,.45);
  padding-bottom: 1px;
}

.page-intro .homeplace-stats__link:hover{
  border-bottom-color: rgba(255,255,255,.90);
  filter: brightness(1.05);
}

.home-bottom{
  background: rgba(0,0,0,.35);
  border-top: 1px solid rgba(255,255,255,.06);
  border-bottom: 1px solid rgba(255,255,255,.06);
  padding: 36px 0 42px;
}

.home-bottom__grid{
  display:grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: var(--kv2-space-xl);
  min-width: 0;
  width: 100%;
  max-width: 100%;
}

@media (max-width: 900px){
  .home-bottom__grid{
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 768px){
  .homeplace-stats{
    display:none;
  }

  body.page--home .homeplace-stats{
    display:block;
    border-radius:0;
    margin-left:0;
    margin-right:0;
    width:100%;
    max-width:100%;
    box-sizing:border-box;
  }
}

.homeplace-stats{
  margin-top: 14px;
  display: flex;
  gap: 12px;
  align-items: flex-start;
  padding: 14px 16px;
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.06));
  border: 1px solid rgba(255,255,255,.14);
  box-shadow:
    0 10px 30px rgba(0,0,0,.18),
    inset 0 1px 0 rgba(255,255,255,.18);
  backdrop-filter: blur(10px);
}

.homeplace-stats__text{
  min-width: 0;
}

.homeplace-stats__line{
  font-size: 14px;
  line-height: 1.45;
  opacity: .98;
}

.homeplace-stats__line + .homeplace-stats__line{
  margin-top: 7px;
  opacity: .94;
}

.homeplace-stats strong{
  font-weight: 700;
}

.homeplace-stats__line--muted{
  margin-top: 10px !important;
  padding-top: 10px;
  border-top: 1px solid rgba(255,255,255,.14);
  opacity: .92;
}

.homeplace-stats__link,
.homeplace-stats__countlink{
  text-decoration: none;
  color: inherit;
  border-bottom: 1px solid rgba(255,255,255,.55);
  padding-bottom: 1px;
  transition: border-color .15s ease, opacity .15s ease;
}

.homeplace-stats__link:hover,
.homeplace-stats__countlink:hover{
  border-bottom-color: rgba(255,255,255,.95);
  opacity: 1;
}

.homeplace-stats--pop{
  margin-top: 14px;
  display: flex;
  gap: 14px;
  align-items: flex-start;
  padding: 16px 18px;
  --hp-radius: 18px;
  border-radius: var(--hp-radius);
  border: 1px solid rgba(255,255,255,.18);
  border-left: 4px solid rgba(var(--accent-rgb), .85);
  box-shadow:
    0 16px 40px rgba(0,0,0,.28),
    inset 0 1px 0 rgba(255,255,255,.22);
  backdrop-filter: blur(12px);
  position: relative;
  overflow: hidden;
  isolation: isolate;
}

.homeplace-stats__badge{
  width: 44px;
  height: 44px;
  border-radius: 16px;
  display: grid;
  place-items: center;
  background: linear-gradient(180deg, rgba(255,255,255,.22), rgba(255,255,255,.12));
  border: 1px solid rgba(255,255,255,.22);
  box-shadow:
    0 10px 22px rgba(0,0,0,.28),
    inset 0 1px 0 rgba(255,255,255,.25);
}

.homeplace-stats__pin{
  font-size: 19px;
  line-height: 1;
  transform: translateY(-1px);
  filter: drop-shadow(0 3px 10px rgba(0,0,0,.35));
}

.homeplace-stats__kicker{
  font-size: 12px;
  letter-spacing: .06em;
  text-transform: uppercase;
  opacity: .85;
  margin: 1px 0 6px;
}

@media (max-width: 480px){
  .homeplace-stats--pop{
    --hp-radius: 16px;
    padding: 14px 16px;
  }
  .homeplace-stats__badge{
    width: 34px;
    height: 34px;
    border-radius: 13px;
  }
}

.page-intro__side .homeplace-stats{
  margin-top: 0;
  width: 100%;
  max-width: 396px;
}

@media (min-width: 901px){
  .page-intro__side .homeplace-stats--cards{
    padding:12px 14px;
    gap:10px;
    border-radius:14px;
  }
  .page-intro__side .homeplace-stats__head{
    gap:8px;
  }
  .page-intro__side .homeplace-stats__agenda-btn{
    padding:7px 10px;
    font-size:11px;
  }
  .page-intro__side .homeplace-stats__pin{
    width:34px;
    height:34px;
    font-size:15px;
    flex:0 0 34px;
    border-radius:10px;
  }
  .page-intro__side .homeplace-stats__kicker{
    font-size:12px;
  }
  .page-intro__side .homeplace-stats__place{
    font-size:12px;
  }
  .page-intro__side .homeplace-stats__grid{
    gap:8px;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    grid-template-rows:auto auto;
  }
  .page-intro__side .homeplace-stat--next{
    grid-column:1 / -1;
  }
  .page-intro__side .homeplace-stat{
    padding:10px;
    gap:4px;
  }
  .page-intro__side .homeplace-stat--tile{
    padding:8px 6px;
  }
  .page-intro__side .homeplace-stat__value{
    font-size:clamp(20px, 4vw, 26px);
  }
}

.homeplace-stats__dist{
  display:inline-block;
  margin-left: 6px;
  font-size: 12px;
  opacity: .85;
  padding: 2px 8px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.18);
  background: rgba(255,255,255,.06);
  vertical-align: middle;
}

@media (max-width: 900px){
  .page-intro__side{
    justify-content: stretch;
  }
  .page-intro__side .homeplace-stats{
    max-width: none;
    margin-top: 0;
    margin-bottom: 12px;
  }
  .page-intro__side .homeplace-stats--cards{
    margin-left: -18px;
    margin-right: -18px;
    width: calc(100% + 36px);
    max-width: none;
    border-radius: 0;
    box-sizing: border-box;
  }
}

.homeplace-stats--cards{
  display:grid;
  gap:14px;
  padding:18px;
  border-radius:18px;
  background:
    radial-gradient(120% 80% at 0% 0%, rgba(170,49,174,.20), transparent 55%),
    radial-gradient(90% 70% at 100% 0%, rgba(249,123,10,.12), transparent 50%),
    linear-gradient(180deg, rgba(22,18,32,.96), rgba(18,16,30,.98));
  border:1px solid rgba(180,140,255,.14);
  box-shadow:
    0 16px 40px rgba(0,0,0,.20),
    inset 0 1px 0 rgba(255,255,255,.08);
}

.homeplace-stats--cards--has-bg{
  --hp-mx:50%;
  --hp-my:45%;
  position:relative;
  overflow:hidden;
  overflow:clip;
  contain:paint;
  background:transparent;
  border-color:rgba(180,140,255,.22);
}
.homeplace-stats--cards--has-bg::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  border-radius:inherit;
  background-image:var(--hp-bg-url);
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  filter:blur(2px);
  opacity:0.96;
  pointer-events:none;
  transition:filter .35s ease, opacity .35s ease;
}
.homeplace-stats--cards--has-bg:hover::before{
  filter:blur(0);
  opacity:1;
}
.homeplace-stats--cards--has-bg::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  border-radius:inherit;
  pointer-events:none;
  background:
    radial-gradient(120% 90% at 20% 0%, rgba(120,40,160,.16), transparent 50%),
    radial-gradient(80% 60% at 100% 20%, rgba(249,123,10,.10), transparent 45%),
    linear-gradient(180deg, rgba(14,11,22,.46), rgba(8,6,16,.60));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
  transition:opacity .25s ease;
}
.homeplace-stats--cards--has-bg > .homeplace-stats__edge{
  z-index:1;
}
.homeplace-stats--cards--has-bg > *:not(.homeplace-stats__edge){
  position:relative;
  z-index:2;
}

.homeplace-stats__edge{
  position:absolute;
  inset:0;
  border-radius:inherit;
  pointer-events:none;
  opacity:0;
  transition:opacity .22s ease;
  background:radial-gradient(
    ellipse 95% 75% at var(--hp-mx, 50%) var(--hp-my, 45%),
    rgba(200, 150, 255, .26),
    transparent 62%
  );
  mix-blend-mode:screen;
}
.homeplace-stats--cards:hover .homeplace-stats__edge{
  opacity:1;
}

@media (prefers-reduced-motion: reduce){
  .homeplace-stats--cards--has-bg::before{
    transition:none;
  }
  .homeplace-stats--cards--has-bg:hover::before{
    filter:blur(2px);
    opacity:0.96;
  }
  .homeplace-stats__edge{
    transition:none;
    opacity:0 !important;
  }
  .homeplace-stat--clickable{
    transition:none;
    transform:none !important;
  }
}

.homeplace-stats__head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}

.homeplace-stats__agenda-btn{
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  margin:0;
  flex:0 0 auto;
  white-space:nowrap;
  padding:10px 16px;
  font-size:12px;
  background: linear-gradient(90deg, rgba(255, 122, 26, 0.95), rgba(255, 122, 26, 0.72));
}
.homeplace-stats__agenda-btn.btn--favlink:hover{
  background: linear-gradient(90deg, #e65f00, rgba(230, 95, 0, 0.82));
}

.homeplace-stats__titlewrap{
  display:flex;
  align-items:flex-start;
  gap:12px;
  min-width:0;
}

.homeplace-stats__pin{
  display:inline-grid;
  place-items:center;
  width:40px;
  height:40px;
  border-radius:12px;
  background:linear-gradient(180deg, rgba(249,123,10,.18), rgba(170,49,174,.18));
  color:#fff;
  font-size:18px;
  flex:0 0 40px;
}

.homeplace-stats__kicker{
  display:flex;
  align-items:center;
  gap:6px;
  font-size:13px;
  font-weight:800;
  color:#fff;
  line-height:1.2;
}

.homeplace-stats__place{
  margin-top:3px;
  font-size:13px;
  color:#d3d4e6;
}

.homeplace-stats__grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:10px;
}

.homeplace-stat{
  min-width:0;
  display:grid;
  gap:6px;
  padding:14px;
  border-radius:14px;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08);
}

.homeplace-stat--tile{
  padding:10px 8px;
  gap:4px;
  background:linear-gradient(165deg, rgba(170,49,174,.14), rgba(255,255,255,.05));
  border:1px solid rgba(174,68,177,.20);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
  min-height:0;
}

a.homeplace-stat--tile,
a.homeplace-stat--next{
  text-decoration:none;
  color:inherit;
  -webkit-tap-highlight-color:transparent;
  position:relative;
  z-index:3;
  align-self:stretch;
  min-height:100%;
}

.homeplace-stat--clickable{
  cursor:pointer;
  transition:border-color .2s ease, box-shadow .2s ease, transform .18s ease, background .2s ease;
}
.homeplace-stat--clickable:hover{
  border-color:rgba(200, 140, 255, .48);
  box-shadow:
    0 8px 22px rgba(0, 0, 0, .28),
    inset 0 1px 0 rgba(255, 255, 255, .12);
  transform:translateY(-1px);
}
.homeplace-stat--clickable:focus-visible{
  outline:2px solid rgba(255, 122, 26, .9);
  outline-offset:2px;
}

.homeplace-stat__value-num{
  display:inline-block;
  font:inherit;
  font-family:var(--font-event);
  color:inherit;
}

.homeplace-stat__figure{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  gap:2px;
  width:100%;
  min-width:0;
  text-align:center;
}

.page-intro .homeplace-stats--cards .homeplace-stat__caption,
.homeplace-stats--cards .homeplace-stat__caption{
  margin:0;
  max-width:100%;
  font-size:10px;
  font-weight:800;
  letter-spacing:.03em;
  text-transform:uppercase;
  line-height:1.1;
  color:#ececf5;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.page-intro .homeplace-stats--cards .homeplace-stat__caption--multiline,
.homeplace-stats--cards .homeplace-stat__caption--multiline{
  white-space:normal;
  overflow:visible;
  text-overflow:clip;
  line-height:1.2;
  hyphens:none;
}

.homeplace-stat__caption--next-label{
  text-align:center;
}

.homeplace-stat--tile .homeplace-stat__value,
.homeplace-stat--pair .homeplace-stat__value{
  font-size:46px;
  font-family:var(--font-event);
  font-weight:900;
  letter-spacing:.02em;
  line-height:1;
}

.homeplace-stat--tile .homeplace-stats__countlink,
.homeplace-stat--pair .homeplace-stats__countlink{
  border-bottom:0;
  padding-bottom:0;
}

.homeplace-stat__label{
  font-size:11px;
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:#bfc1d9;
}

.homeplace-stat__value{
  font-size:34px;
  line-height:1;
  font-weight:900;
  color:#fff;
}

.homeplace-stat__value a{
  color:#fff;
  text-decoration:none;
}

.homeplace-stat__value a:hover{
  color:var(--accent);
}

.homeplace-stat__meta{
  font-size:13px;
  line-height:1.45;
  color:#d8d8e8;
}

.homeplace-stat--next .homeplace-stat__meta{
  font-size:9px;
  line-height:1.35;
  letter-spacing:.02em;
  color:rgba(220,222,235,.88);
  text-transform:none;
  font-weight:600;
}

.homeplace-stat__nexttitle{
  font-size:14px;
  line-height:1.2;
  font-weight:800;
  color:#fff;
}

.homeplace-stat__nexttitle a{
  color:#fff;
  text-decoration:none;
}

.homeplace-stat__nexttitle a:hover{
  color:var(--accent);
}

.homeplace-stat--next{
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  justify-content:flex-start;
  background:linear-gradient(165deg, rgba(170,49,174,.14), rgba(255,255,255,.05));
  border:1px solid rgba(174,68,177,.20);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
  padding:10px 8px 14px;
}

.homeplace-stat--next.homeplace-stat--clickable .homeplace-stat__nexttitle{
  color:#fff;
}

.homeplace-stat--next .homeplace-stat__caption--next-label{
  margin-bottom:2px;
}

.homeplace-stat--next .homeplace-stat__nexttitle,
.homeplace-stat--next .homeplace-stat__meta{
  width:100%;
  max-width:100%;
  text-align:center;
  box-sizing:border-box;
}

.homeplace-stats__countlink,
.homeplace-stats__link{
  color:inherit;
  text-decoration:none;
}

.homeplace-stats__countlink:hover,
.homeplace-stats__link:hover{
  text-decoration:none;
}

.homeplace-favs{
  display:flex;
  flex-direction:column;
  gap:6px;
  margin-top:2px;
  padding-top:8px;
  border-top:1px solid rgba(255,255,255,.08);
  min-width:0;
}

.homeplace-favs__line{
  font-size:12px;
  line-height:1.35;
  color:#e7e8f8;
}

.homeplace-favs__line strong{
  color:#fff;
}

.homeplace-favs__note{
  margin-top:6px;
}

.homeplace-favs .alert{
  margin:0;
  padding:7px 9px;
  border-width:2px;
  background:rgba(255,255,255,.05);
}

.homeplace-favs .alert__text{
  font-size:12px;
  line-height:1.3;
}

.homeplace-favs__more{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  align-self:stretch;
  width:100%;
  max-width:100%;
  box-sizing:border-box;
  margin-top:0;
  padding:8px 10px;
  border-radius:8px;
  border:1px solid rgba(255,255,255,.16);
  background:rgba(255,255,255,.06);
  font-size:11px;
  color:#e7eaff;
  text-decoration:none;
  line-height:1.25;
  white-space:normal;
  text-align:center;
}

.homeplace-favs__more:hover{
  background:linear-gradient(90deg, rgba(255, 122, 26, 0.92), rgba(255, 122, 26, 0.68));
  border-color:rgba(255, 160, 90, 0.55);
  color:#fff;
}

.homeplace-favs__more i{
  font-size:11px;
  line-height:1;
}

@media (max-width: 640px){
  .page-intro__side .homeplace-stats--cards{
    margin-left:-20px;
    margin-right:-20px;
    width:calc(100% + 40px);
    max-width:none;
    border-radius:0;
    padding:14px 16px;
    box-sizing:border-box;
  }

  .homeplace-stats--cards{
    padding:10px;
    gap:12px;
  }

  .homeplace-stats__titlewrap{
    gap:10px;
  }

  .homeplace-stats__head{
    align-items:flex-start;
    gap:8px;
  }

  .homeplace-stats__agenda-btn{
    padding:10px 16px;
    font-size:12px;
  }

  .homeplace-stats__pin{
    width:34px;
    height:34px;
    flex-basis:34px;
    font-size:16px;
    border-radius:10px;
  }

  .homeplace-stats__grid{
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:6px;
    margin-top:6px;
  }

  .homeplace-stat{
    padding:8px 4px;
    gap:4px;
  }

  .homeplace-stat--tile{
    padding:8px 4px;
  }

  .homeplace-stat__label{
    font-size:10px;
    line-height:1.2;
  }

  .homeplace-stat__caption{
    font-size:9px;
    line-height:1.2;
  }

  .homeplace-stat__value{
    font-size:22px;
  }

  .homeplace-stat--tile .homeplace-stat__value,
  .homeplace-stat--pair .homeplace-stat__value{
    font-size:34px;
  }

  .homeplace-stat__nexttitle{
    font-size:12px;
    line-height:1.2;
  }

  .homeplace-stat__meta{
    font-size:11px;
    line-height:1.3;
  }

  .homeplace-stat--next .homeplace-stat__meta{
    font-size:8.5px;
  }

  .homeplace-stats__place{
    font-size:12px;
    line-height:1.35;
  }
}

@media (max-width: 380px){
  .homeplace-stat__label{
    font-size:9px;
  }

  .homeplace-stat__caption{
    font-size:8.5px;
  }

  .homeplace-stat__value{
    font-size:20px;
  }

  .homeplace-stat--tile .homeplace-stat__value,
  .homeplace-stat--pair .homeplace-stat__value{
    font-size:28px;
  }
}

/* Eventkaarten op home. */
body.page--home .eventTextItem {
  --et-hover-shadow:0 12px 32px rgba(0,0,0,.22);
  border-radius: var(--kv2-radius-card);
  padding: 8px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.10);
  backdrop-filter: blur(6px);
  transform: none;
  animation: none;
  font-family: var(--font-event);
  transition: box-shadow .22s ease, border-color .22s ease, background .22s ease;
}

body.page--home .eventTextItem:hover {
  transform: none;
  border-color: rgba(255,255,255,.20);
  background: rgba(255,255,255,.09);
}

body.page--home .eventTextItem .iconfield,
body.page--home .eventTextItem .placefield {
  background: transparent;
}

body.page--home .eventTextItem .iconfield {
  width: 40px;
  border-left-width: 5px;
  padding-left: 10px;
}

body.page--home .eventTextItem .placefield .placespan {
  color: rgba(255,255,255,.92);
  font-size: 17px;
  letter-spacing: .3px;
}

body.page--home .eventTextItem .placefield .placespan .km{
  font-size: 14px;
}

body.page--home .eventTextItem .placefield .eventname {
  color: rgba(255,255,255,.78);
  font-style: normal;
  font-size: 13px;
}

body.page--home .eventTextItem .placefield .eventname--with-eti{
  color: rgba(255,255,255,.78);
  font-style: normal;
}
@media (min-width:901px){
  body.page--home .eventTextItem .placefield .eventname,
  body.page--home .eventTextItem .placefield .eventname--with-eti{
    font-size:14px;
  }
}
body.page--home .eventTextItem .placefield .eti-distance--inline{
  color: rgba(255,255,255,.62);
}
body.page--home .eventTextItem .placefield .eti-distance--inline .distance-km{
  color: inherit;
}

body.page--home .eventTextItem .datefield {
  background: rgba(255,255,255,.08);
  border-radius: 10px;
  margin-top: 6px;
  padding: 6px 10px;
  color: rgba(255,255,255,.86);
  font-weight: 600;
  font-size: 15px;
}
body.page--home .eventTextItem .datefield strong{
  color:#ae44b1;
  font-weight:800;
}

body.page--home .eventTextItem .daysleftfield {
  border-left: 0;
  border-radius: 12px;
  width: 60px;
  font-size: 11px;
  background: linear-gradient(135deg, rgba(170,49,174,.95), rgba(108,42,163,.95));
}

body.page--home .eventTextItem .daysleftfield:after {
  display: none;
}

body.page--home .eventTextItem .daysleftfield .counting{
  font-size: 20px;
  font-weight: 800;
}

body.page--home .eventTextItem .daysleftfield .days__prefix,
body.page--home .eventTextItem .daysleftfield .days__unit,
body.page--home .eventTextItem .daysleftfield .days__suffix{
  font-size: 12px;
}

body.page--home .eventTextItem .daysleftfield .days__num{
  font-size: 21px;
}

body.page--home .eventTextItem::after,
body.page--home .eventTextItem::before{
  content: none !important;
  display: none !important;
}
