

/* ===== Contact page ===== */
.ct-hero{position:relative;overflow:clip;padding-block:clamp(28px,4vw,56px) clamp(40px,5vw,72px)}
.ct-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,5vw,72px);align-items:center}
.ct-copy{display:flex;flex-direction:column;gap:22px;min-width:0}
.crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:14px;font-weight:600;color:var(--ink-2);animation:fadeup .6s var(--ease) both}
.crumbs a{color:var(--ink-2);text-decoration:none}
.crumbs a:hover{color:var(--royal)}
.crumbs .sep{width:14px;height:14px;color:#AFC0DA;transform:rotate(-90deg)}
.ct-hero h1{font-family:var(--font-display);font-size:var(--fs-display);font-weight:700;letter-spacing:-.03em;line-height:1.02}
.ct-hero h1 .line{display:block;overflow:hidden;padding-bottom:.08em;margin-bottom:-.08em}
.ct-hero h1 .line > span{display:inline-block;animation:rise .9s var(--ease) both}
.ct-hero h1 .line:nth-child(2) > span{animation-delay:.12s}
.ct-hero h1 mark{color:var(--royal);background:linear-gradient(var(--cyan-tint),var(--cyan-tint)) no-repeat 0 88%/0% 28%;padding:0 .04em;animation:highlight .9s .85s var(--ease) forwards}
.ct-intro{color:var(--ink-2);font-size:18px;max-width:50ch;animation:fadeup .8s .35s var(--ease) both}
.c-hero-cta{display:flex;flex-wrap:wrap;gap:14px;animation:fadeup .8s .45s var(--ease) both}

/* Paper plane art */
.ct-art{position:relative;width:min(100%,520px);aspect-ratio:8/7;margin-inline:auto;container-type:inline-size;animation:photo-in 1s .15s var(--ease) both}
.ct-art > svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.ct-halo{fill:var(--bg-soft);transform-box:fill-box;transform-origin:center;animation:breathe 6s ease-in-out infinite}
.ct-ring{fill:none;stroke:#BCCDEA;stroke-width:1.5;stroke-dasharray:6 8;transform-box:fill-box;transform-origin:center;animation:spin 70s linear infinite}
.fly-track{fill:none;stroke:#C9D6EA;stroke-width:2.5;stroke-dasharray:3 9;stroke-linecap:round}
.fly-draw{fill:none;stroke:var(--royal);stroke-width:3;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1;animation:flydraw 5s cubic-bezier(.45,0,.2,1) infinite}
.env-body{fill:#fff;stroke:var(--ink);stroke-width:3;stroke-linejoin:round}
.env-flap{fill:var(--cyan-tint);stroke:var(--ink);stroke-width:3;stroke-linejoin:round;transform-box:fill-box;transform-origin:50% 0;animation:flap 5s ease-in-out infinite}
.env-letter{fill:#fff;stroke:var(--ink);stroke-width:2.5;animation:letter 5s ease-in-out infinite}
.env-g{animation:envbump 5s ease-in-out infinite;transform-box:fill-box;transform-origin:center}
.env-ring{fill:none;stroke:var(--cyan);stroke-width:3;transform-box:fill-box;transform-origin:center;opacity:0;animation:envring 5s ease-out infinite}
.ct-chip{position:absolute;z-index:3;display:inline-flex;align-items:center;gap:1.8cqw;background:#fff;border:1.5px solid var(--ink);border-radius:999px;padding:1.6cqw 3cqw;font-size:3cqw;font-weight:700;white-space:nowrap;box-shadow:.9cqw .9cqw 0 var(--ink);animation:bob 5s ease-in-out infinite;color:var(--ink);text-decoration:none}
.ct-chip:hover{color:var(--royal)}
.ct-chip .i{width:3.6cqw;height:3.6cqw;color:var(--royal)}
.ct-chip .dot{width:2cqw;height:2cqw;border-radius:50%;background:#22C55E;animation:blink 1.4s ease-in-out infinite}
@keyframes flydraw{0%{stroke-dashoffset:1}78%{stroke-dashoffset:0}100%{stroke-dashoffset:0;opacity:0}}
@keyframes flap{0%,74%{transform:none}84%,94%{transform:scaleY(-1)}100%{transform:none}}
@keyframes letter{0%,78%{transform:translateY(0)}88%,94%{transform:translateY(-22px)}100%{transform:translateY(0)}}
@keyframes envbump{0%,76%,100%{transform:none}80%{transform:scale(1.08) rotate(-3deg)}86%{transform:scale(1)}}
@keyframes envring{0%,76%{opacity:0;transform:scale(.6)}80%{opacity:.9}100%{opacity:0;transform:scale(1.7)}}
@keyframes blink{50%{opacity:.25}}

/* Ways to reach us */
.ways{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.way{position:relative;display:flex;flex-direction:column;gap:8px;padding:24px;border-radius:24px;background:#fff;border:1.5px solid var(--line);text-decoration:none;color:var(--ink);min-width:0;transition:transform .3s var(--ease), border-color .25s, box-shadow .3s}
.way:hover{color:var(--ink);transform:translateY(-6px);border-color:var(--ink);box-shadow:6px 6px 0 var(--ink)}
.w-ic{width:52px;height:52px;border-radius:16px;background:var(--cyan-tint);color:var(--royal);display:grid;place-items:center;margin-bottom:8px}
.w-ic .i,.w-ic .wa-ic{width:26px;height:26px}
.way.is-wa .w-ic{background:#DCFCE7;color:#15803D}
.way small{font-size:12.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-2)}
.way b{font-family:var(--font-display);font-size:19px;font-weight:700;letter-spacing:-.01em;line-height:1.3;overflow-wrap:anywhere}
.w-go{margin-top:auto;padding-top:10px;display:inline-flex;align-items:center;gap:8px;font-weight:700;font-size:15px;color:var(--royal)}
.w-go .i{width:18px;height:18px;transition:transform .3s var(--ease)}
.way:hover .w-go .i{transform:translateX(4px)}
.way.is-call:hover .w-ic .i{animation:ringring .6s ease-in-out 2}
.way.is-mail:hover .w-ic .i{animation:numhit .5s var(--ease)}
.way.is-visit:hover .w-ic .i{animation:pinjump .6s var(--ease)}
.way.is-wa:hover .w-ic{animation:wa-pulse 1s ease-out}
@keyframes ringring{0%,100%{transform:rotate(0)}20%{transform:rotate(-14deg)}40%{transform:rotate(12deg)}60%{transform:rotate(-10deg)}80%{transform:rotate(8deg)}}
@keyframes pinjump{0%,100%{transform:translateY(0)}40%{transform:translateY(-7px)}70%{transform:translateY(1px)}}
@keyframes numhit{0%{transform:scale(1)}40%{transform:scale(1.18)}100%{transform:scale(1)}}
@keyframes wa-pulse{0%{box-shadow:0 0 0 0 rgba(37,211,102,.5)}100%{box-shadow:0 0 0 16px rgba(37,211,102,0)}}

/* Form + next steps */
.ct-form-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(28px,5vw,72px);align-items:start}
.next{display:flex;flex-direction:column;gap:0;margin-top:30px;position:relative}
.next li{position:relative;display:grid;grid-template-columns:52px minmax(0,1fr);gap:18px;padding-bottom:26px}
.next li:last-child{padding-bottom:0}
.next li::before{content:"";position:absolute;left:25px;top:52px;bottom:0;width:2px;background:var(--line)}
.next li:last-child::before{display:none}
.next .n{width:52px;height:52px;border-radius:50%;background:#fff;border:2px solid var(--ink);display:grid;place-items:center;font-family:var(--font-display);font-weight:800;font-size:18px;box-shadow:3px 3px 0 var(--ink);position:relative;z-index:1}
.next li:nth-child(1) .n{background:var(--cyan-tint)}
.next li:nth-child(3) .n{background:var(--ink);color:#fff;box-shadow:3px 3px 0 var(--cyan)}
.next h3{font-size:19px;font-weight:700;margin:4px 0 6px}
.next p{color:var(--ink-2);font-size:15.5px}
.next.reveal-in li{animation:rise-soft .6s var(--ease) both}
.next.reveal-in li:nth-child(2){animation-delay:.12s}.next.reveal-in li:nth-child(3){animation-delay:.24s}
.ct-form{border:2px solid var(--ink);box-shadow:8px 8px 0 var(--ink)}
.field textarea{min-height:110px;border:1.5px solid #C9D6EA;border-radius:12px;padding:12px 14px;background:#fff;font:inherit;font-size:16px;color:inherit;resize:vertical;transition:border-color .2s, box-shadow .2s}
.field textarea:focus{outline:none;border-color:var(--royal);box-shadow:0 0 0 4px var(--cyan-tint)}
.field .opt{font-weight:600;color:var(--ink-2)}
.f-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px}

@media (max-width: 980px){
  .ct-grid,.ct-form-grid{grid-template-columns:minmax(0,1fr)}
  .ways{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width: 640px){
  .ways{grid-template-columns:minmax(0,1fr)}
  .f-row{grid-template-columns:minmax(0,1fr)}
  .c-hero-cta .btn{flex:1 1 auto}
}

