/*
 * Allina Reiki — Contact
 * Alleen laden op /contact/
 * Eigen kleurwereld: aubergine, koper, saliegroen en warm ivoor.
 */

:root {
  --ct-night:#2d2133;
  --ct-aubergine:#47324d;
  --ct-plum:#765b7c;
  --ct-copper:#b4775b;
  --ct-sage:#78968a;
  --ct-sage-dark:#526f66;
  --ct-gold:#b99a61;
  --ct-ivory:#f6f0e7;
  --ct-paper:#fcf9f4;
  --ct-ink:#382f3a;
  --ct-copy:#675f66;
  --ct-light:#fffdf9;
}

body:has(.ct-hero) .title_outer,
body:has(.ct-hero) .title_holder {
  display:none!important;
}
body:has(.ct-hero) .content,
body:has(.ct-hero) .content_inner {
  margin-top:0!important;
  background:var(--ct-paper);
}
.ct-hero,.ct-contact,.ct-quote,
.ct-hero *,.ct-contact *,.ct-quote * {
  box-sizing:border-box;
}
.ct-hero > .full_section_inner,
.ct-contact > .full_section_inner,
.ct-quote > .full_section_inner {
  position:relative;
  z-index:2;
  display:grid;
  align-items:center;
  width:calc(100% - 48px);
  max-width:1180px;
  margin:0 auto;
}
.ct-hero > .full_section_inner > br,
.ct-contact > .full_section_inner > br,
.ct-quote > .full_section_inner > br {
  display:none!important;
}
.ct-hero__copy,.ct-hero__media,
.ct-contact__form,.ct-contact__details,
.ct-quote__copy,.ct-quote__media {
  position:relative!important;
  float:none!important;
  width:auto!important;
  min-width:0;
  padding:0!important;
}
.ct-hero__copy,.ct-contact__form,.ct-quote__media {
  grid-column:1;
  grid-row:1;
}
.ct-hero__media,.ct-contact__details,.ct-quote__copy {
  grid-column:2;
  grid-row:1;
}
.ct-hero .wpb_content_element,
.ct-contact .wpb_content_element,
.ct-quote .wpb_content_element {
  margin:0!important;
}

/* Hero */
.ct-hero {
  position:relative;
  isolation:isolate;
  overflow:hidden;
  min-height:650px;
  padding:76px 24px 84px;
  background:
    radial-gradient(circle at 84% 17%,rgba(180,119,91,.23),transparent 26%),
    radial-gradient(circle at 61% 84%,rgba(120,150,138,.16),transparent 31%),
    linear-gradient(112deg,var(--ct-ivory) 0%,var(--ct-paper) 53%,var(--ct-aubergine) 53%,var(--ct-night) 100%);
}
.ct-hero::before {
  content:"";
  position:absolute;
  left:53%;
  top:-110px;
  bottom:-110px;
  width:124px;
  border-left:1px solid rgba(185,154,97,.50);
  border-right:1px solid rgba(180,119,91,.34);
  border-radius:49% 51% 43% 57% / 22% 25% 75% 78%;
  transform:rotate(5deg);
}
.ct-hero::after {
  content:"";
  position:absolute;
  right:-175px;
  bottom:-210px;
  width:510px;
  height:510px;
  border:1px solid rgba(185,154,97,.22);
  border-left-color:transparent;
  border-radius:50%;
  box-shadow:0 0 0 42px rgba(120,150,138,.035),0 0 0 84px rgba(118,91,124,.025);
}
.ct-hero > .full_section_inner {
  grid-template-columns:minmax(0,1.16fr) minmax(0,.84fr);
  gap:clamp(48px,8vw,105px);
}
.ct-hero__copy {
  z-index:3;
  padding:38px 0 38px 10px!important;
}
.ct-hero__copy::before {
  content:"";
  position:absolute;
  left:-14px;
  top:0;
  width:120px;
  height:82px;
  border-top:1px solid rgba(185,154,97,.76);
  border-left:1px solid rgba(180,119,91,.58);
  border-radius:48px 0 0;
  transform:skewY(-7deg);
}
.ct-eyebrow,.ct-section-label {
  display:block;
  color:var(--ct-copper);
  font-family:"Fraunces",Georgia,serif;
  font-size:18px;
  font-style:italic;
  letter-spacing:.035em;
}
.ct-hero h1 {
  max-width:660px;
  margin:10px 0 29px!important;
  color:var(--ct-ink)!important;
  font-family:"Fraunces",Georgia,serif!important;
  font-size:clamp(44px,5vw,68px)!important;
  font-weight:400!important;
  letter-spacing:-.045em!important;
  line-height:1.06!important;
  text-transform:none!important;
}
.ct-hero__copy p {
  max-width:620px;
  margin:0 0 18px;
  color:var(--ct-copy);
  font-size:16px;
  line-height:1.82;
}
.ct-hero__copy p:first-of-type {
  color:#514653;
  font-family:"Fraunces",Georgia,serif;
  font-size:21px;
  line-height:1.66;
}
.ct-hero__media {
  z-index:2;
}
.ct-hero__media::before,
.ct-quote__media::before {
  content:"";
  position:absolute;
  z-index:3;
  inset:-21px;
  padding:1px;
  border-radius:50%;
  background:conic-gradient(from 25deg,rgba(185,154,97,.72) 0 13%,transparent 13% 32%,rgba(120,150,138,.60) 32% 50%,transparent 50% 70%,rgba(180,119,91,.61) 70% 85%,transparent 85%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;
  mask-composite:exclude;
  pointer-events:none;
}
.ct-hero__media img {
  display:block;
  width:100%!important;
  height:465px!important;
  object-fit:cover;
  border-radius:125px 36px 125px 36px;
  filter:saturate(.82) contrast(1.02) brightness(.86);
  box-shadow:0 34px 72px rgba(17,10,20,.40);
}

/* Formulier en contactinformatie */
.ct-contact {
  position:relative;
  isolation:isolate;
  overflow:hidden;
  padding:100px 24px 108px;
  background:
    radial-gradient(circle at 16% 82%,rgba(118,91,124,.11),transparent 28%),
    radial-gradient(circle at 86% 16%,rgba(120,150,138,.14),transparent 29%),
    var(--ct-ivory);
}
.ct-contact::before {
  content:"";
  position:absolute;
  left:67%;
  top:-80px;
  bottom:-80px;
  width:86px;
  border-left:1px solid rgba(120,150,138,.34);
  border-right:1px solid rgba(185,154,97,.28);
  border-radius:48% 52% 57% 43% / 70% 66% 34% 30%;
  transform:rotate(-4deg);
}
.ct-contact > .full_section_inner {
  grid-template-columns:minmax(0,1.38fr) minmax(0,.62fr);
  align-items:start;
  gap:clamp(52px,8vw,108px);
}
.ct-section-label {
  margin-bottom:26px;
  color:var(--ct-aubergine);
  font-size:25px;
}
.ct-contact__form {
  padding:44px!important;
  background:rgba(255,253,249,.80);
  border:1px solid rgba(71,50,77,.09);
  border-radius:40px 10px 40px 10px;
  box-shadow:0 25px 65px rgba(45,33,51,.10);
}
.ct-contact__form form p {
  margin:0 0 19px;
  color:var(--ct-copy);
}
.ct-contact__form label {
  display:block;
  color:var(--ct-ink);
  font-size:13px;
  font-weight:650;
  letter-spacing:.02em;
}
.ct-contact__form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]),
.ct-contact__form textarea,
.ct-contact__form select {
  width:100%!important;
  margin-top:8px!important;
  padding:13px 15px!important;
  color:var(--ct-ink)!important;
  background:rgba(246,240,231,.72)!important;
  border:1px solid rgba(71,50,77,.16)!important;
  border-radius:14px 4px 14px 4px!important;
  box-shadow:none!important;
  font-family:inherit!important;
  font-size:14px!important;
  line-height:1.5!important;
  transition:border-color .2s ease,box-shadow .2s ease,background .2s ease;
}
.ct-contact__form input:focus,
.ct-contact__form textarea:focus,
.ct-contact__form select:focus {
  outline:none!important;
  background:#fffdf9!important;
  border-color:var(--ct-sage)!important;
  box-shadow:0 0 0 3px rgba(120,150,138,.13)!important;
}
.ct-contact__form textarea {
  min-height:155px;
  resize:vertical;
}
.ct-contact__form input[type="submit"] {
  display:inline-flex!important;
  min-width:170px;
  height:auto!important;
  padding:14px 28px!important;
  color:#fff!important;
  background:linear-gradient(135deg,var(--ct-aubergine),var(--ct-sage-dark))!important;
  border:1px solid rgba(255,255,255,.20)!important;
  border-radius:999px!important;
  box-shadow:0 15px 34px rgba(45,33,51,.24)!important;
  font-size:13px!important;
  font-weight:650!important;
  text-transform:none!important;
  letter-spacing:0!important;
  cursor:pointer;
}
.ct-contact__form .wpcf7-spinner {
  margin:0 0 0 12px;
}
.ct-contact__form .wpcf7-not-valid-tip {
  margin-top:6px;
  color:#9c4e43;
  font-size:12px;
}
.ct-contact__form .wpcf7-response-output {
  margin:20px 0 0!important;
  padding:14px 16px!important;
  border:1px solid var(--ct-sage)!important;
  border-radius:12px 4px 12px 4px;
}
.ct-details {
  display:flex;
  flex-direction:column;
  gap:17px;
}
.ct-detail {
  position:relative;
  padding:26px 24px 25px 58px;
  background:linear-gradient(145deg,var(--ct-aubergine),var(--ct-night));
  border:1px solid rgba(255,253,249,.10);
  border-radius:30px 8px 30px 8px;
  box-shadow:0 18px 38px rgba(45,33,51,.16);
}
.ct-detail:nth-child(even) {
  background:linear-gradient(145deg,var(--ct-sage-dark),#38574f);
  border-radius:8px 30px 8px 30px;
}
.ct-detail span {
  position:absolute;
  left:20px;
  top:25px;
  color:var(--ct-gold);
  font-family:"Fraunces",Georgia,serif;
  font-size:13px;
}
.ct-detail h3 {
  margin:0 0 9px!important;
  color:var(--ct-light)!important;
  font-family:"Fraunces",Georgia,serif!important;
  font-size:21px!important;
  font-weight:400!important;
  text-transform:none!important;
}
.ct-detail p {
  margin:0;
  color:rgba(255,253,249,.74);
  font-size:13px;
  line-height:1.65;
}
.ct-detail a {
  color:rgba(255,253,249,.88)!important;
  text-decoration:none!important;
  overflow-wrap:anywhere;
}
.ct-detail a:hover {
  color:#fff!important;
}

/* Gedicht */
.ct-quote {
  position:relative;
  isolation:isolate;
  overflow:hidden;
  padding:100px 24px 108px;
  background:
    radial-gradient(circle at 82% 18%,rgba(180,119,91,.25),transparent 27%),
    radial-gradient(circle at 17% 84%,rgba(120,150,138,.20),transparent 30%),
    linear-gradient(145deg,var(--ct-night),var(--ct-aubergine));
}
.ct-quote::before {
  content:"";
  position:absolute;
  left:47%;
  top:-80px;
  bottom:-80px;
  width:92px;
  border-left:1px solid rgba(185,154,97,.28);
  border-right:1px solid rgba(180,119,91,.22);
  border-radius:54% 46% 47% 53% / 24% 28% 72% 76%;
  transform:rotate(-4deg);
}
.ct-quote > .full_section_inner {
  grid-template-columns:minmax(0,.68fr) minmax(0,1.32fr);
  gap:clamp(54px,9vw,120px);
}
.ct-quote__media {
  padding:28px!important;
  background:rgba(255,253,249,.08);
  border-radius:50%;
}
.ct-quote__media img {
  display:block;
  width:100%!important;
  height:340px!important;
  object-fit:cover;
  border-radius:50%;
  filter:saturate(.73) brightness(.75);
  box-shadow:0 28px 62px rgba(10,7,13,.44);
}
.ct-quote blockquote {
  position:relative;
  margin:0!important;
  padding:38px 32px!important;
  color:var(--ct-light)!important;
  background:transparent!important;
  border:0!important;
  font-family:"Fraunces",Georgia,serif!important;
  font-size:clamp(20px,2.2vw,29px)!important;
  font-style:italic!important;
  line-height:1.65!important;
  white-space:pre-line;
}
.ct-quote blockquote::before,
.ct-quote blockquote::after {
  content:"";
  position:absolute;
  width:105px;
  height:66px;
}
.ct-quote blockquote::before {
  left:0;
  top:0;
  border-top:1px solid var(--ct-gold);
  border-left:1px solid var(--ct-copper);
  border-radius:40px 0 0;
}
.ct-quote blockquote::after {
  right:0;
  bottom:0;
  border-right:1px solid var(--ct-sage);
  border-bottom:1px solid var(--ct-gold);
  border-radius:0 0 40px;
}
.ct-quote__copy p {
  margin:22px 0 0;
  color:#d3c3ad;
  font-family:"Fraunces",Georgia,serif;
  font-size:16px;
  font-style:italic;
  text-align:right;
}

@media(max-width:960px) {
  .ct-hero > .full_section_inner,
  .ct-contact > .full_section_inner,
  .ct-quote > .full_section_inner {
    grid-template-columns:1fr 1fr;
    gap:42px;
  }
  .ct-contact__form {padding:34px!important;}
}
@media(max-width:760px) {
  .ct-hero,.ct-contact,.ct-quote {
    padding:58px 20px 66px;
  }
  .ct-hero {
    min-height:0;
    background:linear-gradient(160deg,var(--ct-ivory) 0 56%,var(--ct-aubergine) 56% 100%);
  }
  .ct-hero > .full_section_inner,
  .ct-contact > .full_section_inner,
  .ct-quote > .full_section_inner {
    display:flex;
    width:100%;
    flex-direction:column;
    gap:38px;
  }
  .ct-hero__copy,.ct-contact__form,.ct-quote__copy {order:1;}
  .ct-hero__media,.ct-contact__details,.ct-quote__media {order:2;}
  .ct-hero__copy,.ct-hero__media,
  .ct-contact__form,.ct-contact__details,
  .ct-quote__copy,.ct-quote__media {
    grid-column:auto;
    grid-row:auto;
  }
  .ct-hero h1 {font-size:41px!important;}
  .ct-hero__media img {height:330px!important;border-radius:76px 28px 76px 28px;}
  .ct-contact__form {width:100%!important;padding:27px 20px!important;}
  .ct-contact__details {width:100%!important;}
  .ct-quote__media {width:100%!important;max-width:390px;margin:auto;}
}
@media(prefers-reduced-motion:no-preference) {
  .ct-hero__media::before,
  .ct-quote__media::before {
    animation:ct-contact-breathe 9s ease-in-out infinite;
  }
}
@keyframes ct-contact-breathe {
  0%,100% {opacity:.56;transform:rotate(-4deg) scale(.98);}
  50% {opacity:.92;transform:rotate(2deg) scale(1.02);}
}