/* Niels Portfolio Core 2.4.0 */
:root{
  --niels-copy:#f6cd6d;
  --niels-content:#83c9c3;
  --niels-catalyst:#ef7d78;
  --niels-ink:#111;
  --niels-rule:rgba(17,17,17,.14);
}

/* Work Area labels ------------------------------------------------------ */
.niels-work-areas,
.taxonomy-work_area{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:.45rem .8rem;
}
.niels-work-area-link,
.taxonomy-work_area a{
  display:inline-flex;
  align-items:center;
  gap:.34rem;
  white-space:nowrap;
  text-decoration:none;
}
.niels-work-area-icon{
  display:inline-block;
  width:1.45em;
  height:1.45em;
  flex:0 0 1.45em;
  object-fit:contain;
  vertical-align:-.24em;
  border-radius:50%;
}
.taxonomy-work_area .wp-block-post-terms__separator{display:none}

/* Three Cs Venn --------------------------------------------------------- */
.niels-three-cs{
  --copy:var(--niels-copy);
  --content:var(--niels-content);
  --catalyst:var(--niels-catalyst);
  position:relative;
  width:min(100%,760px);
  margin:2.1rem auto 2rem;
  aspect-ratio:1/1;
  font-family:inherit;
}
.niels-three-cs *{box-sizing:border-box}
.niels-three-cs__circle{
  position:absolute;
  width:56%;
  aspect-ratio:1;
  border-radius:50%;
  border:1px solid rgba(0,0,0,.06);
  mix-blend-mode:multiply;
}
/* Match the clean Services render: Copy left, Content right, Catalyst below. */
.niels-three-cs__copy{left:1%;top:3%;background:rgba(246,205,109,.90)}
.niels-three-cs__content{right:1%;top:3%;background:rgba(131,201,195,.90)}
.niels-three-cs__catalyst{left:22%;top:39%;background:rgba(239,125,120,.90)}
.niels-three-cs__label{
  position:absolute;
  z-index:4;
  width:28%;
  text-align:center;
  color:var(--niels-ink);
  text-transform:uppercase;
  letter-spacing:.18em;
  font-size:clamp(11px,1.45vw,17px);
  line-height:1.1;
}
.niels-three-cs__label strong{display:block;font-weight:600}
.niels-three-cs__area-mark{
  display:block;
  width:clamp(38px,5.8vw,64px);
  height:auto;
  margin:0 auto .45rem;
}
.niels-three-cs__copy-label{left:14%;top:22%}
.niels-three-cs__content-label{right:14%;top:22%}
.niels-three-cs__catalyst-label{left:36%;top:68%}
.niels-three-cs__center-mark{
  position:absolute;
  z-index:6;
  left:50%;
  top:48%;
  width:44px;
  height:44px;
  transform:translate(-50%,-50%);
}
.niels-three-cs__center-mark i{
  position:absolute;
  left:50%;
  top:50%;
  width:3px;
  height:15px;
  border-radius:2px;
  background:#fff;
  transform-origin:50% 0;
}
.niels-three-cs__center-mark i:nth-child(1){transform:rotate(0deg) translateY(-18px)}
.niels-three-cs__center-mark i:nth-child(2){transform:rotate(45deg) translateY(-18px)}
.niels-three-cs__center-mark i:nth-child(3){transform:rotate(90deg) translateY(-18px)}
.niels-three-cs__center-mark i:nth-child(4){transform:rotate(135deg) translateY(-18px)}
.niels-three-cs__center-mark i:nth-child(5){transform:rotate(180deg) translateY(-18px)}
.niels-three-cs__center-mark i:nth-child(6){transform:rotate(225deg) translateY(-18px)}
.niels-three-cs__center-mark i:nth-child(7){transform:rotate(270deg) translateY(-18px)}
.niels-three-cs__center-mark i:nth-child(8){transform:rotate(315deg) translateY(-18px)}

/* Services page --------------------------------------------------------- */
.niels-services-page{
  width:100%;
  max-width:1180px!important;
  margin-left:0!important;
  margin-right:auto!important;
}
.niels-services-columns{
  align-items:flex-start!important;
  gap:clamp(2.5rem,6vw,6rem)!important;
}
.niels-services-headline{
  margin-top:0;
  margin-bottom:1.2rem;
  font-size:clamp(2rem,4.1vw,3.8rem);
  line-height:1.04;
  letter-spacing:-.035em;
}
.niels-services-intro{
  max-width:42rem;
  margin-bottom:.5rem;
  font-size:1.06em;
  line-height:1.55;
}
.niels-services-overlap-title{
  margin-top:1.2rem;
  font-size:.86rem;
  text-transform:uppercase;
  letter-spacing:.22em;
}
.niels-services-left > p{max-width:43rem}
.niels-services-cta{margin-top:1.6rem}
.niels-services-cta .wp-block-button__link{
  padding:.8rem 1.2rem;
  border-radius:0;
  text-transform:uppercase;
  letter-spacing:.16em;
  font-size:.78rem;
}
.niels-services-right{
  padding-top:clamp(.3rem,1.8vw,1.6rem);
}
.niels-service-card{
  display:grid!important;
  grid-template-columns:72px minmax(0,1fr);
  gap:1.2rem;
  align-items:start;
  margin:0!important;
  padding:0 0 2rem!important;
  border-bottom:1px solid var(--niels-rule);
}
.niels-service-card + .niels-service-card{
  margin-top:2rem!important;
}
.niels-service-card:last-child{border-bottom:0}
.niels-service-card__icon{
  margin:0!important;
  width:72px!important;
}
.niels-service-card__icon img{
  display:block;
  width:72px!important;
  height:72px!important;
  border-radius:50%;
}
.niels-service-card__body{margin:0!important}
.niels-service-card__body h3{
  margin:.08rem 0 .55rem;
  font-size:1.05rem;
  text-transform:uppercase;
  letter-spacing:.19em;
}
.niels-service-card__body p{
  margin:.45rem 0 0;
  line-height:1.55;
}
.niels-service-card__lead{font-size:1.02em}

/* Existing About artwork ----------------------------------------------- */
.niels-about-artwork{max-width:760px;margin:2rem auto 0}
.niels-about-artwork img{display:block;width:100%;height:auto}

@media(max-width:960px){
  .niels-services-columns{flex-direction:column!important;gap:2.5rem!important}
  .niels-services-left,.niels-services-right{flex-basis:auto!important;width:100%!important}
  .niels-services-right{padding-top:0}
}

@media(max-width:680px){
  .niels-three-cs{width:100%;margin:1.5rem auto 1.7rem}
  .niels-three-cs__label{font-size:clamp(9px,3.2vw,13px);letter-spacing:.12em}
  .niels-three-cs__area-mark{width:clamp(30px,10vw,44px);margin-bottom:.3rem}
  .niels-three-cs__center-mark{width:32px;height:32px;transform:translate(-50%,-50%) scale(.72)}
  .niels-service-card{grid-template-columns:58px minmax(0,1fr);gap:.9rem}
  .niels-service-card__icon,.niels-service-card__icon img{width:58px!important;height:58px!important}
  .niels-services-headline{font-size:clamp(1.8rem,10vw,2.8rem)}
}
