/* mucept — contact page (extends style.css) */

/* ---------- form ---------- */
.cform{padding:clamp(60px,7vw,100px) 0 clamp(50px,5vw,80px);background:#fff}
.cform__inner{display:grid;grid-template-columns:minmax(0,.4fr) minmax(0,.6fr);gap:clamp(30px,4.500vw,72px);align-items:center;max-width:1100px}
.cform__photo{border-radius:16px;overflow:hidden;aspect-ratio:.69;box-shadow:0 30px 60px -30px rgba(17,25,61,.5)}
.cform__photo img{width:100%;height:100%;object-fit:cover;transform:scale(1.03);transition:transform 1.2s var(--ease)}
.cform__photo:hover img{transform:scale(1.09)}
.cf{display:grid;grid-template-columns:1fr 1fr;gap:26px 34px;margin-top:38px}
.fld{position:relative;display:block}
.fld--full{grid-column:1/-1}
.fld span{position:absolute;left:0;top:16px;font:500 11.500px var(--ff-h);letter-spacing:.04em;text-transform:uppercase;color:var(--ink);pointer-events:none;transition:.3s var(--ease);transform-origin:0 0}
.fld input,.fld select,.fld textarea{display:block;width:100%;padding:16px 0 12px;border:0;border-bottom:1.5px solid #8d91ac;border-radius:0;background:transparent;outline:0;font:500 14px var(--ff-b);color:var(--ink);appearance:none;-webkit-appearance:none;resize:none;transition:border-color .3s}
.fld textarea{min-height:92px;padding-top:30px}
.fld::after{content:"";position:absolute;left:0;bottom:0;height:2px;width:100%;background:linear-gradient(90deg,#7048ee,#16d6a6);transform:scaleX(0);transform-origin:0 50%;transition:transform .5s var(--ease)}
.fld:focus-within::after{transform:scaleX(1)}
.fld:focus-within span,.fld.has-val span{top:-8px;transform:scale(.85);color:#7048ee}
.fld.is-bad input,.fld.is-bad select,.fld.is-bad textarea{border-color:#ee4a6b}
.fld.is-bad span{color:#ee4a6b}
.fld--sel select{cursor:pointer;padding-right:24px}
.fld__chev{position:absolute;right:2px;top:20px;width:12px;height:12px;pointer-events:none;transform:rotate(180deg);transition:transform .3s}
.fld--sel:focus-within .fld__chev{transform:none}
.cf__foot{grid-column:1/-1;display:flex;align-items:center;gap:22px;flex-wrap:wrap;margin-top:6px}
.cf__msg{font-size:14px;font-weight:500;color:#16a37f;opacity:0;transition:opacity .4s}
.cf__msg.is-on{opacity:1}
.cf__msg.is-err{color:#ee4a6b}

/* info cards */
.icards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px;max-width:1100px;margin:clamp(50px,5.500vw,84px) auto 0}
.icard{display:flex;align-items:center;gap:16px;padding:18px 22px;border-radius:8px;background:#fff;box-shadow:0 4px 14px rgba(17,25,61,.16),0 1px 2px rgba(17,25,61,.2);transition:translate .4s var(--ease),box-shadow .4s}
.icard:hover{translate:0 -8px;box-shadow:0 24px 40px -16px rgba(17,25,61,.35)}
.icard__ico{flex:none;display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:var(--navy);transition:transform .6s var(--ease)}
.icard__ico--p{background:#7a4df0}
.icard__ico svg{width:22px;height:22px}
.icard:hover .icard__ico{transform:rotateY(360deg)}
.icard small{display:block;font-size:10.500px;letter-spacing:.08em;color:#80849e}
.icard strong{display:block;margin-top:2px;font:600 15.500px/1.3 var(--ff-h);color:var(--ink)}

/* ---------- map ---------- */
.findus{background:#fff;padding:clamp(20px,3vw,40px) 0 clamp(60px,6vw,100px)}
.findus__card{position:relative;overflow:hidden;max-width:1180px;margin:0 auto;padding:clamp(30px,3.600vw,52px) 20px 0;border-radius:14px;background:#7d4def;text-align:center;color:#fff}
.findus__card h2{font:500 clamp(17px,1.500vw,22px) var(--ff-h)}
.map{position:relative;width:min(70%,820px);margin:clamp(20px,3vw,44px) auto 0;aspect-ratio:540/170}
.map img{width:100%;height:100%;display:block;opacity:.95}
.pin{position:absolute;width:13px;height:13px;margin:-6.5px 0 0 -6.5px;border-radius:50%;animation:pinPulse 2.4s ease-out infinite}
.pin--w{background:#fff;box-shadow:0 0 10px 3px rgba(255,255,255,.75)}
.pin--g{background:#13d68f;--pc:19,214,143}
.pin--w{--pc:255,255,255}
.pin:nth-of-type(2n){animation-delay:.6s}.pin:nth-of-type(3n){animation-delay:1.2s}
@keyframes pinPulse{0%{box-shadow:0 0 0 0 rgba(var(--pc),.7)}80%,100%{box-shadow:0 0 0 18px rgba(var(--pc),0)}}

@media (max-width:980px){
  .cform__inner{grid-template-columns:1fr}
  .cform__photo{max-width:340px;aspect-ratio:.9}
  .icards{grid-template-columns:1fr}
  .map{width:94%}
  .banner__img{max-width:100%;opacity:.6}
}
@media (max-width:640px){
  .cf{grid-template-columns:1fr}
}
button.btn{background:none;border:0;padding:0;cursor:pointer}