/* Molay — componentstijlen bovenop theme.json */

/* Wordmark */
.molay-wordmark a{
  font-family:'EB Garamond',Georgia,serif;
  font-size:26px;letter-spacing:.28em;text-transform:uppercase;
  color:var(--wp--preset--color--paper);text-decoration:none;
}
.molay-wordmark a:hover{color:var(--wp--preset--color--gold)}

/* Navigatie */
.molay-header .wp-block-navigation a{
  font-size:12px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--wp--preset--color--muted);
}
.molay-header .wp-block-navigation a:hover,
.molay-header .wp-block-navigation .current-menu-item a{color:var(--wp--preset--color--gold)}

/* Sticky header */
.molay-header{position:sticky;top:0;z-index:50;border-bottom:1px solid rgba(220,161,36,.28)}

/* Eyebrow-label */
.molay-eyebrow{
  font-size:11px !important;font-weight:500;letter-spacing:.25em;
  text-transform:uppercase;color:var(--wp--preset--color--gold);
}

/* Haarlijn met driehoekje */
.molay-rule{position:relative;height:1px;background:rgba(220,161,36,.28);border:0;margin:28px auto;max-width:420px;width:70%}
.molay-rule::after{
  content:"";position:absolute;left:50%;top:0;transform:translateX(-50%);
  border-left:6px solid transparent;border-right:6px solid transparent;
  border-top:7px solid var(--wp--preset--color--gold);
}

/* Kaarten */
.molay-card{border:1px solid rgba(220,161,36,.18);transition:border-color .35s ease}
.molay-card:hover{border-color:var(--wp--preset--color--gold)}

/* Omlijnde knopvariant */
.wp-block-button.is-style-outline .wp-block-button__link{
  background:transparent;color:var(--wp--preset--color--paper);
  border:1px solid var(--wp--preset--color--gold);
}
.wp-block-button.is-style-outline .wp-block-button__link:hover{
  background:var(--wp--preset--color--gold);color:var(--wp--preset--color--ink);
}

/* FAQ (details-blok) */
.wp-block-details{border-bottom:1px solid rgba(220,161,36,.28);padding:8px 0}
.wp-block-details summary{
  cursor:pointer;list-style:none;position:relative;padding:16px 40px 16px 0;
  font-family:'EB Garamond',Georgia,serif;font-size:20px;letter-spacing:.05em;
}
.wp-block-details summary::-webkit-details-marker{display:none}
.wp-block-details summary::after{
  content:"";position:absolute;right:8px;top:50%;width:9px;height:9px;
  border-right:1px solid var(--wp--preset--color--gold);
  border-bottom:1px solid var(--wp--preset--color--gold);
  transform:translateY(-70%) rotate(45deg);transition:transform .3s ease;
}
.wp-block-details[open] summary::after{transform:translateY(-30%) rotate(-135deg)}
.wp-block-details p{color:var(--wp--preset--color--muted)}

/* Reviews */
.molay-stars{color:var(--wp--preset--color--gold);letter-spacing:.3em;font-size:12px}
.molay-review{border:1px solid rgba(247,247,247,.12);padding:30px}
.molay-review blockquote{font-family:'EB Garamond',Georgia,serif;font-style:italic;font-size:19px;line-height:1.6;margin:0}

/* Projectkaarten in querygrid */
.molay-projectgrid .wp-block-post-title{font-size:20px;letter-spacing:.06em}
.molay-projectgrid .wp-block-post-title a{color:var(--wp--preset--color--paper)}
.molay-projectgrid .wp-block-post-title a:hover{color:var(--wp--preset--color--gold)}

/* Focus zichtbaar houden */
:where(a,button,summary):focus-visible{outline:2px solid var(--wp--preset--color--gold);outline-offset:3px}
