/* Contact page */
.ct-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(28px,5vw,72px);align-items:center;padding-top:72px;padding-bottom:56px}
.ct-title{font-family:'Syne',sans-serif;font-weight:800;text-transform:uppercase;letter-spacing:-.02em;line-height:.95;font-size:clamp(48px,7.4vw,110px);margin:0 0 24px}
.ct-title span{color:var(--c3)}
.ct-lead{font-size:clamp(17px,1.6vw,21px);line-height:1.65;color:var(--muted);margin:0 0 30px;max-width:520px}
.ct-actions{display:flex;flex-wrap:wrap;gap:12px}

/* the hand of contact cards */
.ct-hand{list-style:none;margin:0;padding:20px 0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.ct-c{--c:var(--c1);--r:-2.5deg}
.ct-c2{--c:var(--c2);--r:2deg}.ct-c3{--c:var(--c3);--r:1.5deg}.ct-c4{--c:var(--c4);--r:-2deg}
.ct-card{position:relative;display:flex;flex-direction:column;justify-content:space-between;gap:26px;min-height:210px;padding:20px 22px;border-radius:24px;
  background:var(--c);color:#0D0B14;rotate:var(--r);
  box-shadow:-4px 6px 14px rgba(0,0,0,.5),inset 0 3px 0 rgba(255,255,255,.4),inset 0 -6px 0 rgba(0,0,0,.14);
  transition:rotate .3s ease,translate .3s cubic-bezier(.3,1.6,.5,1),box-shadow .3s ease}
.ct-card:hover,.ct-card:focus-visible{rotate:0deg;translate:0 -10px;box-shadow:0 26px 34px -14px var(--c),inset 0 3px 0 rgba(255,255,255,.5)}
.ct-card:focus-visible{outline:3px solid #fff;outline-offset:4px}
.ct-top{display:flex;justify-content:space-between;align-items:center}
.ct-k{font-family:'Syne',sans-serif;font-weight:800;font-size:13px;letter-spacing:.1em;text-transform:uppercase}
.ct-mt{width:26px;height:26px;opacity:.85}
.ct-v{font-family:'Syne',sans-serif;font-weight:800;font-size:clamp(17px,1.7vw,23px);line-height:1.15;overflow-wrap:anywhere}
.ct-v-mail{font-size:clamp(13px,1.15vw,16px);overflow-wrap:normal;word-break:break-all}
.ct-go{font-weight:800;font-size:14px;opacity:.8}

/* message panel */
.ct-message{padding-top:40px;padding-bottom:40px;scroll-margin-top:110px}
.ct-panel{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(24px,4vw,64px);align-items:start;
  border-radius:32px;background:var(--c3);color:#0D0B14;padding:clamp(26px,4.4vw,56px);box-shadow:inset 0 3px 0 rgba(255,255,255,.4)}
.ct-panel .eyebrow{color:#0D0B14}
.ct-panel-title{font-family:'Zilla Slab',Georgia,serif;font-weight:700;text-transform:uppercase;font-size:clamp(34px,4.4vw,62px);line-height:1;margin:0 0 16px}
.ct-panel-text p{font-size:clamp(16px,1.4vw,19px);line-height:1.65;margin:0;max-width:420px}
.ct-form{display:flex;flex-direction:column;gap:8px}
.ct-form label{font-weight:800;font-size:13px;letter-spacing:.08em;text-transform:uppercase;margin-top:10px}
.ct-form input,.ct-form select,.ct-form textarea{width:100%;font:inherit;font-weight:600;color:#0D0B14;background:#FFF8E7;border:2px solid #0D0B14;border-radius:14px;padding:13px 16px;
  box-shadow:inset 0 2px 0 rgba(0,0,0,.06)}
.ct-form textarea{resize:vertical;min-height:140px}
.ct-form input:focus,.ct-form select:focus,.ct-form textarea:focus{outline:3px solid #fff;outline-offset:2px;border-color:#0D0B14;background:#fff}
.ct-error{margin:10px 0 0;font-weight:800;color:#8A1020}
.ct-form-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:18px}

/* quick links */
.ct-quick{padding-top:24px;padding-bottom:96px}
.ct-quick ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.ct-q{display:flex;flex-direction:column;gap:6px;min-height:190px;justify-content:flex-end;padding:22px 24px;border-radius:24px;color:#0D0B14;background:var(--c);rotate:var(--r,0deg);
  box-shadow:-3px 5px 12px rgba(0,0,0,.45),inset 0 3px 0 rgba(255,255,255,.4);transition:rotate .3s ease,translate .3s cubic-bezier(.3,1.6,.5,1)}
.ct-q1{--c:var(--c1);--r:-1.5deg}.ct-q2{--c:var(--c5);--r:1deg}.ct-q3{--c:var(--c4);--r:-1deg}
.ct-q:hover,.ct-q:focus-visible{rotate:0deg;translate:0 -8px}
.ct-q:focus-visible{outline:3px solid #fff;outline-offset:4px}
.ct-q-k{font-family:'Syne',sans-serif;font-weight:800;font-size:12px;letter-spacing:.12em;text-transform:uppercase}
.ct-q strong{font-family:'Syne',sans-serif;font-weight:800;font-size:clamp(22px,2.4vw,32px);line-height:1.05;text-transform:uppercase}
.ct-q span:last-child{font-weight:700;font-size:15px;opacity:.85}

/* arrive */
.ct-intro > *{animation:ct-in .7s cubic-bezier(.2,.9,.25,1) both}
.ct-intro > :nth-child(2){animation-delay:.08s}.ct-intro > :nth-child(3){animation-delay:.16s}.ct-intro > :nth-child(4){animation-delay:.24s}
.ct-c{animation:ct-deal .8s cubic-bezier(.2,.9,.25,1.1) both}
.ct-c2{animation-delay:.12s}.ct-c3{animation-delay:.24s}.ct-c4{animation-delay:.36s}
@keyframes ct-in{from{opacity:0;translate:-40px 0}to{opacity:1;translate:0 0}}
@keyframes ct-deal{from{opacity:0;translate:120px -40px;rotate:18deg;scale:.8}to{opacity:1;translate:0 0;scale:1}}

@media (max-width:1000px){
  .ct-hero{grid-template-columns:1fr;padding-top:40px}
  .ct-panel{grid-template-columns:1fr}
  .ct-quick ul{grid-template-columns:1fr}
  .ct-q{min-height:140px}
}
@media (max-width:520px){.ct-hand{grid-template-columns:1fr}.ct-card{min-height:150px}}
@media (prefers-reduced-motion:reduce){.ct-intro > *,.ct-c{animation:none}.ct-card,.ct-q{transition:none}}
