/* ═══════════════ LIVELY CONTACT PAGE ═══════════════ */
.ct-live #contact { position: relative; overflow: hidden; }
.ct-live #contact::before, .ct-live #contact::after {
    content: ''; position: absolute; border-radius: 50%; filter: blur(80px); pointer-events: none; animation: phBlob 18s ease-in-out infinite;
}
.ct-live #contact::before { width: 420px; height: 420px; top: -120px; left: -160px; background: rgba(255,122,0,.14); }
.ct-live #contact::after { width: 380px; height: 380px; bottom: -120px; right: -140px; background: rgba(37,211,102,.10); animation-direction: reverse; }
.ct-live #contact > div { position: relative; z-index: 1; }

/* Reveal */
.ct-rv { opacity: 0; transform: translateY(30px); transition: opacity .8s cubic-bezier(.2,.7,.2,1), transform .8s cubic-bezier(.2,.7,.2,1); transition-delay: var(--d, 0s); }
.ct-rv.in { opacity: 1; transform: none; }

/* Left column */
.ct-live .contact-info .ct-title { font-size: clamp(1.8rem, 3.5vw, 2.6rem); line-height: 1.15; margin-bottom: 1rem; }
.ct-live .contact-info .ct-title span { color: var(--orange); }
.ct-live .caller { object-fit: cover; animation: sdFloat 7s ease-in-out infinite; }
.ct-live .contact-detail {
    text-decoration: none; color: inherit; position: relative; overflow: hidden; border: 1.5px solid transparent;
    transition: transform .3s, box-shadow .3s, border-color .3s;
}
.ct-live a.contact-detail:hover { transform: translateX(6px); box-shadow: var(--shadow-lg); border-color: rgba(255,122,0,.25); }
.ct-live .contact-detail-icon {
    width: 46px; height: 46px; border-radius: 50%; font-size: 1.2rem;
    background: radial-gradient(circle, rgba(255,122,0,.2), rgba(255,122,0,.06)); transition: transform .4s cubic-bezier(.3,1.6,.5,1);
}
.ct-live a.contact-detail:hover .contact-detail-icon { transform: rotate(-12deg) scale(1.12); }
.ct-go { margin-left: auto; color: var(--orange); font-weight: 700; opacity: 0; transform: translateX(-8px); transition: opacity .3s, transform .3s; }
.ct-live a.contact-detail:hover .ct-go { opacity: 1; transform: none; }
.ct-online { display: inline-flex; align-items: center; gap: .4rem; margin-left: auto; font: 600 .72rem 'Poppins', sans-serif; color: #1a9e50; }
.ct-online::before { content: ''; width: 8px; height: 8px; border-radius: 50%; background: #25D366; animation: ctPing 1.8s ease-out infinite; }
@keyframes ctPing { 0% { box-shadow: 0 0 0 0 rgba(37,211,102,.6); } 100% { box-shadow: 0 0 0 9px rgba(37,211,102,0); } }

/* Form card with animated glowing border */
.ct-live .contact-form { position: relative; isolation: isolate; }
.ct-live .contact-form::before {
    content: ''; position: absolute; inset: -2px; border-radius: calc(var(--radius) + 2px); z-index: -1;
    background: conic-gradient(from var(--ang, 0deg), var(--orange), transparent 30%, transparent 70%, #ffb066, var(--orange));
    animation: ctSpin 6s linear infinite; opacity: .7;
}
.ct-live .contact-form::after { content: ''; position: absolute; inset: 0; border-radius: var(--radius); background: #fff; z-index: -1; }
@property --ang { syntax: '<angle>'; initial-value: 0deg; inherits: false; }
@keyframes ctSpin { to { --ang: 360deg; } }
.ct-live .contact-form h3 { margin-bottom: .6rem !important; display: flex; align-items: center; gap: .6rem; }
.ct-live .contact-form h3 .wave { display: inline-block; transform-origin: 70% 70%; animation: ctWave 2.4s ease-in-out infinite; }
@keyframes ctWave { 0%,60%,100% { transform: rotate(0); } 10%,30% { transform: rotate(16deg); } 20%,40% { transform: rotate(-8deg); } }

/* Progress meter */
.ct-meter { margin: 0 0 1.8rem; }
.ct-meter-top { display: flex; justify-content: space-between; font: 600 .75rem 'Poppins', sans-serif; color: var(--gray); margin-bottom: .45rem; }
.ct-meter-top b { color: var(--orange); }
.ct-meter-bar { height: 6px; border-radius: 6px; background: var(--light); overflow: hidden; }
.ct-meter-bar i { display: block; height: 100%; width: 0; border-radius: 6px; background: linear-gradient(90deg, var(--orange), #ffb066); transition: width .5s cubic-bezier(.3,1.3,.5,1); }

/* Fields */
.ct-live .form-group { position: relative; }
.ct-live .form-group label { transition: color .25s; }
.ct-live .form-group:focus-within label { color: var(--orange); }
.ct-live .form-group input, .ct-live .form-group select, .ct-live .form-group textarea { transition: border-color .25s, box-shadow .25s, transform .25s; }
.ct-live .form-group input:focus, .ct-live .form-group select:focus, .ct-live .form-group textarea:focus { transform: translateY(-2px); }
.ct-live .form-group.ok::after {
    content: "✓"; position: absolute; right: 12px; bottom: 12px; width: 20px; height: 20px; border-radius: 50%;
    display: grid; place-items: center; font-size: .7rem; font-weight: 700; color: #fff; background: #25D366;
    animation: ctPop .35s cubic-bezier(.3,1.7,.5,1);
}
.ct-live .form-group.has-select.ok::after { right: 36px; }
@keyframes ctPop { from { transform: scale(0); } to { transform: scale(1); } }

/* Service quick-pick chips */
.ct-chips { display: flex; flex-wrap: wrap; gap: .45rem; margin-bottom: .6rem; }
.ct-chips button {
    font: 600 .75rem 'Poppins', sans-serif; color: var(--navy); cursor: pointer;
    background: var(--light); border: 1.5px solid var(--border); padding: .35rem .8rem; border-radius: 50px;
    transition: background .2s, color .2s, border-color .2s, transform .2s;
}
.ct-chips button:hover { border-color: var(--orange); color: var(--orange); transform: translateY(-2px); }
.ct-chips button.on { background: var(--orange); border-color: var(--orange); color: #fff; }

/* Submit button */
.ct-live .form-submit { position: relative; overflow: hidden; }
.ct-live .form-submit::after {
    content: ''; position: absolute; top: 0; left: -80%; width: 50%; height: 100%;
    background: linear-gradient(120deg, transparent, rgba(255,255,255,.5), transparent); transform: skewX(-20deg);
    animation: sdBtn 4.5s ease-in-out 1.5s infinite; pointer-events: none;
}
.ct-live .form-submit.ready { animation: pfPulse 2.2s ease-out infinite; }
@keyframes pfPulse { 0% { box-shadow: 0 4px 18px rgba(255,122,0,.35), 0 0 0 0 rgba(255,122,0,.55); } 100% { box-shadow: 0 4px 18px rgba(255,122,0,.35), 0 0 0 16px rgba(255,122,0,0); } }

@media (prefers-reduced-motion: reduce) {
    .ct-rv { opacity: 1; transform: none; transition: none; }
    .ct-live *, .ct-live *::before, .ct-live *::after { animation: none !important; }
}
