/* Computer Point contact page additions. Keep existing css/style.css linked first. */
.cp-contact-page {
  --cp-orange: #f58220;
  --cp-orange-dark: #d9690c;
  --cp-navy: #101e35;
  --cp-muted: #64748b;
  --cp-line: #e5eaf1;
  color: #263449;
  background: #fff;
}
.cp-contact-page a { transition: color .2s ease, background .2s ease, transform .2s ease; }
.cp-contact-page a:focus-visible,
.cp-contact-page button:focus-visible,
.cp-contact-page input:focus-visible,
.cp-contact-page select:focus-visible,
.cp-contact-page textarea:focus-visible { outline: 3px solid rgba(245,130,32,.35); outline-offset: 3px; }
.cp-topbar { background: #101e35; color: #fff; font-size: 13px; }
.cp-topbar-inner { min-height: 40px; display:flex; align-items:center; justify-content:space-between; gap:15px; }
.cp-topbar a { color:#fff; }
.cp-topbar a:hover { color:#ffc17f; }
.cp-navbar { background:#fff; box-shadow:0 6px 24px rgba(16,30,53,.06); }
.cp-brand img { width:200px; max-height:70px; object-fit:contain; }
.cp-navbar .nav-link { color:#15243b; font-weight:600; padding:20px 13px !important; }
.cp-navbar .nav-link:hover, .cp-navbar .active > .nav-link { color:var(--cp-orange); }
.cp-contact-hero { position:relative; overflow:hidden; padding:72px 0 78px; color:#fff; background:linear-gradient(115deg,#101e35 0%,#16385a 68%,#0c5276 100%); }
.cp-contact-hero:before, .cp-contact-hero:after { content:""; position:absolute; border-radius:50%; pointer-events:none; }
.cp-contact-hero:before { width:420px; height:420px; right:-140px; top:-230px; border:1px solid rgba(255,255,255,.13); box-shadow:0 0 0 45px rgba(255,255,255,.025),0 0 0 90px rgba(255,255,255,.025); }
.cp-contact-hero:after { width:260px; height:260px; left:-180px; bottom:-160px; background:rgba(245,130,32,.12); }
.cp-contact-hero .container { position:relative; z-index:1; }
.cp-breadcrumb { display:flex; gap:10px; align-items:center; font-size:13px; color:#cad7e6; margin-bottom:32px; }
.cp-breadcrumb a { color:#fff; }
.cp-hero-grid { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(290px,.8fr); gap:55px; align-items:center; }
.cp-eyebrow { color:var(--cp-orange); font-size:12px; letter-spacing:1.8px; font-weight:800; margin:0 0 13px; text-transform:uppercase; }
.cp-contact-hero h1 { color:#fff; font-size:clamp(32px,4vw,52px); font-weight:800; line-height:1.15; letter-spacing:-1px; margin:0 0 20px; max-width:720px; }
.cp-hero-lead { color:#dce6f2; font-size:17px; line-height:1.8; max-width:650px; margin-bottom:26px; }
.cp-hero-actions { display:flex; flex-wrap:wrap; gap:12px; }
.cp-button { display:inline-flex; align-items:center; justify-content:center; gap:10px; min-height:49px; padding:13px 21px; border:1px solid transparent; border-radius:8px; font-weight:750; text-decoration:none !important; cursor:pointer; }
.cp-button-primary { background:var(--cp-orange); color:#fff !important; box-shadow:0 8px 18px rgba(245,130,32,.18); }
.cp-button-primary:hover { background:var(--cp-orange-dark); transform:translateY(-1px); color:#fff !important; }
.cp-button-light { background:#fff; color:var(--cp-navy) !important; }
.cp-button-light:hover { background:#fff2e7; }
.cp-hero-note { margin:20px 0 0; color:#bac9d9; font-size:13px; }
.cp-hero-card { background:#fff; color:#263449; border-radius:18px; padding:28px; box-shadow:0 20px 60px rgba(0,0,0,.2); }
.cp-hero-card-icon { display:grid; place-items:center; width:48px; height:48px; border-radius:13px; background:#fff0e2; color:var(--cp-orange-dark); font-size:24px; margin-bottom:16px; }
.cp-hero-card h2 { color:var(--cp-navy); font-size:23px; font-weight:800; margin:0 0 8px; }
.cp-hero-card > p { color:var(--cp-muted); font-size:14px; line-height:1.6; margin-bottom:15px; }
.cp-hero-card > a { display:flex; flex-direction:column; gap:4px; padding:13px 0; border-top:1px solid var(--cp-line); text-decoration:none; }
.cp-hero-card > a span { font-size:12px; color:var(--cp-muted); }
.cp-hero-card > a strong { color:var(--cp-navy); font-size:16px; }
.cp-hero-card > a:hover strong { color:var(--cp-orange-dark); }
.cp-contact-main { padding:76px 0 82px; }
.cp-section-heading { text-align:center; max-width:700px; margin:0 auto 38px; }
.cp-section-heading h2, .cp-map-heading h2 { color:var(--cp-navy); font-size:clamp(27px,3vw,36px); font-weight:800; letter-spacing:-.5px; margin:0 0 12px; }
.cp-section-heading > p:last-child { color:var(--cp-muted); margin:0; line-height:1.7; }
.cp-contact-layout { align-items:stretch; }
.cp-form-card, .cp-details-card { height:100%; background:#fff; border:1px solid var(--cp-line); border-radius:16px; box-shadow:0 12px 35px rgba(16,30,53,.055); }
.cp-form-card { padding:32px; }
.cp-card-heading { margin-bottom:25px; }
.cp-card-heading h2, .cp-details-card > h2 { color:var(--cp-navy); font-size:24px; font-weight:800; margin:0 0 7px; }
.cp-card-heading p { color:var(--cp-muted); font-size:13px; margin:0; }
.cp-field { margin-bottom:19px; }
.cp-contact-form label { display:block; color:#263449; font-size:13px; font-weight:700; margin-bottom:8px; }
.cp-contact-form .form-control { min-height:49px; border:1px solid #dce3ec; border-radius:8px; padding:12px 14px; color:#1b2a40; background:#fff; box-shadow:none; font-size:14px; }
.cp-contact-form textarea.form-control { min-height:135px; resize:vertical; }
.cp-contact-form .form-control:focus { border-color:var(--cp-orange); box-shadow:0 0 0 3px rgba(245,130,32,.12); }
.cp-contact-form .form-control::placeholder { color:#97a3b2; }
.cp-captcha-wrap { margin:2px 0 20px; overflow-x:auto; }
.cp-captcha-help, .cp-privacy-note { color:#7b8797; font-size:12px; line-height:1.5; margin:9px 0 0; }
.cp-submit-button { border:0; min-width:185px; }
.cp-honeypot { position:absolute !important; left:-10000px !important; width:1px !important; height:1px !important; overflow:hidden !important; }
.cp-form-status { display:none; padding:12px 14px; border-radius:8px; margin-bottom:18px; }
.cp-form-status:not(:empty) { display:block; }
.cp-details-card { padding:30px; background:linear-gradient(180deg,#fff 0%,#fbfcfe 100%); }
.cp-details-card > .cp-eyebrow { margin-bottom:10px; }
.cp-details-card > h2 { margin-bottom:25px; }
.cp-detail-item { display:grid; grid-template-columns:42px minmax(0,1fr); gap:13px; padding:18px 0; border-top:1px solid var(--cp-line); }
.cp-detail-icon { display:grid; place-items:center; width:40px; height:40px; border-radius:11px; background:#fff0e2; color:var(--cp-orange-dark); font-size:21px; }
.cp-detail-item h3, .cp-social-block h3 { color:var(--cp-navy); font-size:15px; font-weight:800; margin:2px 0 9px; }
.cp-detail-item p { color:#59677b; font-size:13px; line-height:1.7; margin:0 0 5px; }
.cp-detail-item a { color:#263449; font-weight:650; overflow-wrap:anywhere; }
.cp-detail-item a:hover { color:var(--cp-orange-dark); }
.cp-contact-label { display:inline-block; color:#7a8798; font-size:11px; margin-left:4px; }
.cp-social-block { padding-top:20px; border-top:1px solid var(--cp-line); }
.cp-social-links, .cp-footer-social { display:flex; flex-wrap:wrap; gap:9px; }
.cp-social-links a { display:inline-flex; padding:8px 12px; border:1px solid #dfe5ed; border-radius:7px; color:#263449; font-size:12px; font-weight:700; text-decoration:none; }
.cp-social-links a:hover { border-color:var(--cp-orange); color:var(--cp-orange-dark); background:#fff8f1; }
.cp-map-link { display:inline-block; margin-top:22px; color:var(--cp-orange-dark); font-size:13px; font-weight:800; }
.cp-map-section { padding:0 0 78px; }
.cp-map-heading { display:flex; align-items:end; justify-content:space-between; gap:20px; margin-bottom:20px; }
.cp-map-heading h2 { font-size:28px; margin:0; }
.cp-map-heading > a { color:var(--cp-orange-dark); font-weight:750; white-space:nowrap; }
.cp-map-frame { height:390px; overflow:hidden; border:1px solid var(--cp-line); border-radius:15px; box-shadow:0 12px 35px rgba(16,30,53,.07); }
.cp-map-frame iframe { display:block; width:100%; height:100%; border:0; }
.cp-footer { background:#101e35; color:#c8d3e0; padding:55px 0 0; }
.cp-footer img { max-width:100%; height:auto; object-fit:contain; background:#fff; border-radius:6px; padding:5px; }
.cp-footer p { font-size:13px; line-height:1.8; }
.cp-footer-about { margin-top:18px; max-width:360px; }
.cp-footer h2 { color:#fff; font-size:17px; font-weight:800; margin-bottom:18px; }
.cp-footer ul { list-style:none; padding:0; margin:0; }
.cp-footer li { margin-bottom:11px; font-size:13px; }
.cp-footer a { color:#c8d3e0; }
.cp-footer a:hover { color:#ffb36c; }
.cp-footer-social { margin-top:14px; }
.cp-footer-social a { font-size:12px; }
.cp-footer-bottom { border-top:1px solid rgba(255,255,255,.13); margin-top:25px; padding:19px 0; color:#9eafc2; font-size:12px; }
.cp-whatsapp-float { position:fixed; z-index:9999; right:22px; bottom:82px; display:flex; align-items:center; gap:9px; padding:12px 17px; border-radius:999px; background:#20c968; color:#071c12 !important; box-shadow:0 8px 24px rgba(0,0,0,.2); font-size:14px; font-weight:800; text-decoration:none !important; }
.cp-whatsapp-float:hover { background:#16b85a; transform:translateY(-2px); }
.cp-whatsapp-float svg { display:block; width:23px; height:23px; fill:currentColor; }
@media (max-width: 991px) {
  .cp-topbar-inner { padding-top:8px; padding-bottom:8px; flex-wrap:wrap; }
  .cp-navbar .nav-link { padding:10px 0 !important; }
  .cp-hero-grid { grid-template-columns:1fr; gap:30px; }
  .cp-hero-card { max-width:600px; }
  .cp-contact-hero { padding:52px 0 58px; }
}
@media (max-width: 767px) {
  .cp-topbar-inner { align-items:flex-start; flex-direction:column; gap:5px; }
  .cp-brand img { width:165px; }
  .cp-contact-hero h1 { letter-spacing:-.5px; }
  .cp-hero-lead { font-size:15px; }
  .cp-contact-main { padding:52px 0; }
  .cp-form-card, .cp-details-card { padding:22px 18px; }
  .cp-map-heading { align-items:flex-start; flex-direction:column; }
  .cp-map-heading h2 { font-size:25px; }
  .cp-map-frame { height:310px; }
  .cp-whatsapp-float { right:14px; bottom:76px; padding:11px 14px; }
}
@media (prefers-reduced-motion: reduce) {
  .cp-contact-page *, .cp-contact-page *::before, .cp-contact-page *::after { transition:none !important; scroll-behavior:auto !important; }
}
