/* NMIMS CIIS — assets/css/03-components.css — extracted from approved source (Phase 2B) */ /* CRO CTA upgrades + scroll reveal animation. */ /* ── SCROLL ANIMATION ── */ /* Visible by default (no-JS / JS-fail). JS adds .js-reveal on before animating. */ .reveal { opacity: 1; transform: none; } .js-reveal .reveal { opacity: 0; transform: translateY(24px); transition: opacity 0.6s ease, transform 0.6s ease; } .js-reveal .reveal.visible { opacity: 1; transform: none; } .reveal-delay-1 { transition-delay: 0.1s; } .reveal-delay-2 { transition-delay: 0.2s; } .reveal-delay-3 { transition-delay: 0.3s; } .reveal-delay-4 { transition-delay: 0.4s; } @media (prefers-reduced-motion: reduce) { .js-reveal .reveal { opacity: 1 !important; transform: none !important; transition: none !important; } } /* ── CRO CTA UPGRADES ADDED ── */ .cta-mini-strip{margin-top:34px;background:linear-gradient(135deg,rgba(75,44,123,.08),rgba(200,16,46,.06));border:1px solid var(--grey-light);border-radius:18px;padding:20px 22px;display:flex;align-items:center;justify-content:space-between;gap:18px;box-shadow:var(--shadow-soft)} .cta-mini-strip.dark{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.14)} .cta-mini-strip.dark strong{color:#fff}.cta-mini-strip.dark span{color:rgba(255,255,255,.68)} .cta-mini-copy strong{display:block;font-size:1rem;color:var(--dark);margin-bottom:2px}.cta-mini-copy span{display:block;font-size:.84rem;color:var(--grey-text)} .cta-mini-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center}.cta-mini-actions .btn{padding:11px 18px;font-size:.86rem} /* FIX: Make specialisation CTA visible on light backgrounds (desktop + mobile) */ .spec-section .cta-mini-strip.dark, .cta-mini-strip.dark { background: linear-gradient(135deg, #ffffff 0%, #fff7f8 48%, #f7f2ff 100%) !important; border: 1px solid rgba(200,16,46,.14) !important; box-shadow: 0 16px 44px rgba(75,44,123,.12) !important; } .cta-mini-strip.dark strong { color: var(--dark) !important; } .cta-mini-strip.dark span { color: var(--grey-text) !important; } .cta-mini-strip.dark .btn-ghost { background: #ffffff !important; color: var(--purple) !important; border: 2px solid var(--purple) !important; backdrop-filter: none !important; } .cta-mini-strip.dark .btn-ghost:hover { background: var(--purple) !important; color:#fff !important; } @media (max-width:768px) { .cta-mini-strip.dark { padding: 22px 18px !important; border-radius: 20px !important; align-items: stretch !important; text-align: left !important; gap: 16px !important; } .cta-mini-strip.dark .cta-mini-copy strong { font-size: 1.02rem !important; line-height: 1.35 !important; } .cta-mini-strip.dark .cta-mini-copy span { font-size: .86rem !important; line-height: 1.55 !important; margin-top: 6px !important; } .cta-mini-strip.dark .cta-mini-actions { display: grid !important; grid-template-columns: 1fr !important; gap: 10px !important; } .cta-mini-strip.dark .cta-mini-actions .btn { width: 100% !important; justify-content: center !important; min-height: 48px !important; white-space: normal !important; } } .clickable-card{cursor:pointer}.clickable-card:focus{outline:3px solid rgba(232,105,10,.35);outline-offset:3px}.clickable-card:hover{transform:translateY(-4px)} .section-cta-row{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px}.section-cta-row.center{justify-content:center}.section-cta-row .btn{padding:12px 22px;font-size:.88rem} .conversion-ribbon{position:fixed;left:20px;bottom:24px;z-index:930;background:white;border:1px solid var(--grey-light);box-shadow:var(--shadow-lift);border-radius:18px;padding:14px 16px;max-width:280px;display:flex;align-items:center;gap:12px; text-decoration: none !important;} .conversion-ribbon span { color: var(--red); font-weight: 500; } .conversion-ribbon-icon{width:38px;height:38px;border-radius:12px;background:rgba(200,16,46,.10);display:flex;align-items:center;justify-content:center;font-size:1.1rem;flex-shrink:0}.conversion-ribbon strong{display:block;font-size:.86rem;color:var(--dark);line-height:1.25}.conversion-ribbon a{font-size:.78rem;font-weight:700;color:var(--red);text-decoration:none;} .quick-cta-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:34px}.quick-cta-card{background:white;border:1px solid var(--grey-light);border-radius:16px;padding:20px;text-decoration:none;box-shadow:var(--shadow-soft);transition:all .25s}.quick-cta-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-card)}.quick-cta-card b{display:block;color:var(--dark);font-size:.96rem;margin-bottom:4px}.quick-cta-card span{display:block;color:var(--grey-text);font-size:.82rem;line-height:1.5} @media(max-width:768px){.cta-mini-strip{flex-direction:column;align-items:flex-start}. cta-mini-actions{width:100%}.cta-mini-actions .btn{flex:1;justify-content:center}.conversion-ribbon{display:none}.quick-cta-grid{grid-template-columns:1fr}.section-cta-row .btn{flex:1;justify-content:center}.float-btns{display:none}} /* ── Contact Form 7 — shared validation / response (Phase 13E) ── */ .hero-form-card .wpcf7, #leadPopup .wpcf7 { width: 100%; } .hero-form-card .wpcf7-form, #leadPopup .wpcf7-form { margin: 0; } .hero-form-card .wpcf7 .screen-reader-response, #leadPopup .wpcf7 .screen-reader-response { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; } .hero-form-card .wpcf7-response-output, #leadPopup .wpcf7-response-output { display: none; margin: 12px 0 0; padding: 10px 12px; border-radius: var(--radius-sm); font-size: 0.82rem; line-height: 1.45; border: 1.5px solid transparent; } .hero-form-card .wpcf7-form.sent .wpcf7-response-output, .hero-form-card .wpcf7-form.invalid .wpcf7-response-output, .hero-form-card .wpcf7-form.unaccepted .wpcf7-response-output, .hero-form-card .wpcf7-form.failed .wpcf7-response-output, .hero-form-card .wpcf7-form.spam .wpcf7-response-output, #leadPopup .wpcf7-form.sent .wpcf7-response-output, #leadPopup .wpcf7-form.invalid .wpcf7-response-output, #leadPopup .wpcf7-form.unaccepted .wpcf7-response-output, #leadPopup .wpcf7-form.failed .wpcf7-response-output, #leadPopup .wpcf7-form.spam .wpcf7-response-output { display: block; } .hero-form-card .wpcf7-form.sent .wpcf7-response-output, #leadPopup .wpcf7-form.sent .wpcf7-response-output { background: rgba(34, 197, 94, 0.12); border-color: rgba(34, 197, 94, 0.35); color: #166534; } .hero-form-card .wpcf7-form.invalid .wpcf7-response-output, .hero-form-card .wpcf7-form.unaccepted .wpcf7-response-output, .hero-form-card .wpcf7-form.failed .wpcf7-response-output, .hero-form-card .wpcf7-form.spam .wpcf7-response-output, #leadPopup .wpcf7-form.invalid .wpcf7-response-output, #leadPopup .wpcf7-form.unaccepted .wpcf7-response-output, #leadPopup .wpcf7-form.failed .wpcf7-response-output, #leadPopup .wpcf7-form.spam .wpcf7-response-output { background: rgba(200, 16, 46, 0.08); border-color: rgba(200, 16, 46, 0.25); color: var(--red-dark); } .hero-form-card .wpcf7-not-valid-tip, #leadPopup .wpcf7-not-valid-tip { display: block; margin-top: 5px; font-size: 0.72rem; font-weight: 600; color: var(--red); line-height: 1.3; } .hero-form-card .wpcf7-form-control.wpcf7-not-valid, #leadPopup .wpcf7-form-control.wpcf7-not-valid { border-color: var(--red) !important; } .hero-form-card .wpcf7-spinner, #leadPopup .wpcf7-spinner { margin-left: 8px; vertical-align: middle; }