/* CONTACT PAGE — reference design */
.contact-page{background:#fff;color:#0b2d52}
.contact-hero{position:relative;min-height:430px;background:#061b38;overflow:hidden;color:#fff}
.contact-hero:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(3,18,40,.98) 0%,rgba(4,27,56,.92) 46%,rgba(4,27,56,.45) 72%,rgba(4,27,56,.2) 100%);z-index:1}
.contact-hero-bg{position:absolute;right:0;top:0;width:57%;height:100%;object-fit:cover;object-position:center;opacity:.88}
.contact-hero-inner{position:relative;z-index:2;display:grid;grid-template-columns:1fr 1fr;align-items:center;min-height:430px;gap:40px}
.contact-kicker{font-size:10px;font-weight:800;letter-spacing:1.7px;color:#3d7cff;margin-bottom:14px}
.contact-hero h1{font-family:Manrope,Arial,sans-serif;font-size:clamp(38px,5vw,62px);line-height:1.02;letter-spacing:-1.8px;margin:0 0 18px;max-width:540px}
.contact-hero h1 span{color:#2f6cf4}
.contact-hero-copy{max-width:520px;color:#b8c5d7;font-size:13px;line-height:1.75;margin:0 0 28px}
.contact-benefits{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;max-width:650px}
.contact-benefit{display:flex;gap:10px;align-items:flex-start}
.contact-benefit-icon{width:34px;height:34px;border:1px solid #2c6df1;border-radius:50%;display:grid;place-items:center;color:#3c7bff;font-size:16px;flex:none}
.contact-benefit strong{display:block;font-size:11px;color:#fff;margin:1px 0 5px}
.contact-benefit small{display:block;color:#93a3b8;font-size:9px;line-height:1.5}
.contact-main{background:#f8fbff;padding:72px 0}
.contact-main-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:30px;align-items:stretch}
.contact-card{background:#fff;border:1px solid #e2e9f2;border-radius:14px;box-shadow:0 16px 40px rgba(15,23,42,.06);padding:34px}
.contact-card h2{font-family:Manrope,Arial,sans-serif;font-size:28px;color:#0a2a50;margin:0 0 7px}
.contact-line{width:30px;height:3px;background:#2563eb;margin:0 0 16px;border-radius:4px}
.contact-card-intro{font-size:13px;color:#718096;line-height:1.65;margin-bottom:20px}
.contact-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.contact-field{margin-bottom:14px}
.contact-field.full{grid-column:1/-1}
.contact-field label{display:block;font-size:12px;font-weight:700;color:#40516a;margin:0 0 6px}
.contact-field input,.contact-field textarea,.contact-field select{width:100%;border:1px solid #dce4ee;border-radius:7px;background:#fff;color:#25364d;padding:14px 14px;font:inherit;font-size:13px;outline:none;transition:.2s}
.contact-field textarea{min-height:145px;resize:vertical}
.contact-field input:focus,.contact-field textarea:focus,.contact-field select:focus{border-color:#3a72ef;box-shadow:0 0 0 3px rgba(37,99,235,.08)}
.contact-send{display:inline-flex;align-items:center;justify-content:center;gap:10px;border:0;border-radius:7px;background:#2563eb;color:#fff;padding:14px 22px;font-size:12px;font-weight:800;cursor:pointer;transition:.2s}
.contact-send:hover{background:#1746b8;transform:translateY(-2px);box-shadow:0 9px 18px rgba(37,99,235,.18)}
.contact-location-map{height:225px;border-radius:9px;position:relative;overflow:hidden;background-color:#edf4ef;background-image:linear-gradient(24deg,transparent 47%,rgba(255,255,255,.95) 48%,rgba(255,255,255,.95) 51%,transparent 52%),linear-gradient(112deg,transparent 46%,rgba(255,255,255,.9) 47%,rgba(255,255,255,.9) 50%,transparent 51%),linear-gradient(0deg,rgba(175,205,180,.22) 1px,transparent 1px),linear-gradient(90deg,rgba(175,205,180,.22) 1px,transparent 1px);background-size:100% 100%,100% 100%,28px 28px,28px 28px;border:1px solid #dce7df}
.contact-location-map:after{content:"";position:absolute;left:52%;top:48%;width:22px;height:22px;border-radius:50% 50% 50% 0;background:#2563eb;transform:rotate(-45deg);box-shadow:0 5px 14px rgba(37,99,235,.3)}
.contact-location-map:before{content:"";position:absolute;left:52.9%;top:44.7%;width:8px;height:8px;border-radius:50%;background:#fff;z-index:1}
.contact-address{display:grid;grid-template-columns:40px 1fr;gap:12px;margin-top:20px;align-items:start}
.contact-address-icon{width:38px;height:38px;border-radius:50%;background:#eaf2ff;color:#2563eb;display:grid;place-items:center;font-size:14px}
.contact-address strong{display:block;color:#173b63;font-size:13px;margin:1px 0 5px}
.contact-address span{display:block;color:#718096;font-size:12px;line-height:1.6}
.contact-info-row{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:#dfe8f3;border-top:1px solid #dfe8f3;border-bottom:1px solid #dfe8f3}
.contact-info-item{background:#f8fbff;padding:32px 28px;display:flex;gap:12px;align-items:flex-start}
.contact-info-icon{width:34px;height:34px;border-radius:50%;background:#e9f1ff;color:#2563eb;display:grid;place-items:center;flex:none}
.contact-info-item strong{display:block;font-size:13px;color:#16385d;margin-bottom:5px}
.contact-info-item span{display:block;font-size:11px;color:#7b8797;line-height:1.6}
.contact-faq{padding:76px 0;background:#fff}
.contact-faq-head{text-align:center;margin-bottom:34px}
.contact-faq-kicker{font-size:9px;letter-spacing:1.5px;font-weight:800;color:#2563eb}
.contact-faq h2{font-family:Manrope,Arial,sans-serif;font-size:32px;color:#0b2d52;margin:6px 0 0}
.contact-faq-head .contact-line{margin:9px auto 0}
.contact-faq-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px 20px}
.contact-faq-item{border:1px solid #e3e9f1;border-radius:9px;background:#fff;overflow:hidden}
.contact-faq-item button{width:100%;padding:17px 18px;background:#fff;border:0;text-align:left;font-size:12px;font-weight:700;color:#243b5a;cursor:pointer;display:flex;justify-content:space-between;align-items:center}
.contact-faq-item button span{font-size:15px;color:#52657d;transition:.2s}
.contact-faq-answer{max-height:0;overflow:hidden;padding:0 18px;color:#738197;font-size:12px;line-height:1.65;transition:max-height .25s ease,padding .25s ease}
.contact-faq-item.open .contact-faq-answer{max-height:140px;padding:0 18px 17px}
.contact-faq-item.open button span{transform:rotate(45deg);color:#2563eb}
.contact-bottom-cta{background:linear-gradient(90deg,#1555cf,#0646bb);padding:38px 0;color:#fff}
.contact-bottom-inner{display:flex;align-items:center;justify-content:space-between;gap:25px}
.contact-bottom-copy{display:flex;align-items:center;gap:16px}
.contact-bottom-icon{width:48px;height:48px;border-radius:50%;background:rgba(255,255,255,.12);display:grid;place-items:center;font-size:20px}
.contact-bottom-copy strong{display:block;font-family:Manrope,Arial,sans-serif;font-size:20px;margin-bottom:4px}
.contact-bottom-copy span{display:block;color:#d5e3ff;font-size:12px}
.contact-quote{display:inline-flex;align-items:center;gap:10px;padding:15px 24px;background:#fff;color:#17385f;border-radius:7px;font-size:12px;font-weight:800;text-decoration:none;transition:.2s}
.contact-quote:hover{transform:translateY(-2px);box-shadow:0 10px 20px rgba(0,0,0,.14)}
.contact-quote span{font-size:15px}
@media(max-width:800px){.contact-hero-inner{grid-template-columns:1fr;padding:70px 0}.contact-hero-bg{width:100%;opacity:.28}.contact-benefits{grid-template-columns:1fr}.contact-main-grid,.contact-faq-grid{grid-template-columns:1fr}.contact-info-row{grid-template-columns:1fr}.contact-bottom-inner{flex-direction:column;align-items:flex-start}}
@media(max-width:520px){.contact-form-grid{grid-template-columns:1fr}.contact-field.full{grid-column:auto}.contact-card{padding:21px}.contact-hero h1{font-size:40px}}

/* ===== Contact section refinement: only the location + quick contact areas ===== */
.contact-location-card{padding:28px 28px 26px}
.location-heading{display:flex;gap:13px;align-items:flex-start;margin-bottom:17px}
.location-heading-icon{width:42px;height:42px;border-radius:14px;background:linear-gradient(135deg,#e8f1ff,#dceaff);color:#2563eb;display:grid;place-items:center;font-size:20px;flex:none;box-shadow:inset 0 0 0 1px #d8e6ff}
.location-heading h2{margin:1px 0 3px;font-size:25px;color:#0a2a50}
.location-heading p{margin:0;color:#718096;font-size:11px;line-height:1.55}
.contact-location-card .contact-location-map{height:218px;border-radius:10px;background-color:#edf4ef;background-image:linear-gradient(24deg,transparent 47%,rgba(255,255,255,.95) 48%,rgba(255,255,255,.95) 51%,transparent 52%),linear-gradient(112deg,transparent 46%,rgba(255,255,255,.92) 47%,rgba(255,255,255,.92) 50%,transparent 51%),linear-gradient(0deg,rgba(153,188,161,.18) 1px,transparent 1px),linear-gradient(90deg,rgba(153,188,161,.18) 1px,transparent 1px);background-size:100% 100%,100% 100%,26px 26px,26px 26px;position:relative;overflow:hidden;border:1px solid #d8e4dc}
.map-grid-lines{position:absolute;inset:0;background:linear-gradient(70deg,transparent 45%,rgba(255,255,255,.65) 46%,rgba(255,255,255,.65) 48%,transparent 49%),linear-gradient(-28deg,transparent 60%,rgba(255,255,255,.7) 61%,rgba(255,255,255,.7) 63%,transparent 64%);opacity:.85}
.map-road{position:absolute;background:rgba(255,255,255,.92);z-index:1;border-radius:20px;box-shadow:0 0 0 1px rgba(213,225,217,.55)}
.road-one{width:135%;height:16px;left:-15%;top:42%;transform:rotate(19deg)}
.road-two{width:105%;height:12px;left:-2%;top:62%;transform:rotate(-55deg)}
.map-label{position:absolute;left:14px;top:14px;z-index:4;background:rgba(255,255,255,.96);padding:10px 13px;border-radius:7px;box-shadow:0 5px 15px rgba(31,60,86,.10);min-width:185px}
.map-label strong{display:block;font-size:11px;color:#193a5e;margin-bottom:2px}.map-label span{display:block;font-size:9px;color:#718096;margin-bottom:5px}.map-label a{font-size:9px;color:#2563eb;text-decoration:none;font-weight:700}
.map-pin{position:absolute;z-index:5;left:52%;top:51%;width:24px;height:24px;border-radius:50% 50% 50% 0;background:#2563eb;transform:rotate(-45deg);box-shadow:0 7px 13px rgba(37,99,235,.3)}
.map-pin i{position:absolute;width:8px;height:8px;background:#fff;border-radius:50%;left:8px;top:8px}
.map-place{position:absolute;z-index:3;font-size:8px;color:#5f7d68;background:rgba(255,255,255,.55);padding:3px 5px;border-radius:4px}.place-one{right:12%;top:25%}.place-two{left:12%;bottom:17%}.place-three{right:10%;bottom:24%}.place-four{left:33%;top:15%}
.map-directions{display:flex;align-items:center;gap:10px;margin-top:10px;padding:11px 13px;border:1px solid #dbe8f7;background:#f4f8ff;border-radius:8px;text-decoration:none;color:#1560d7;transition:.2s}.map-directions:hover{background:#edf5ff;border-color:#c8dcfb;transform:translateY(-1px)}.map-google-mark{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:#fff;font-weight:900;font-size:12px;color:#4285f4;box-shadow:0 2px 6px rgba(0,0,0,.08)}.map-directions strong{font-size:11px}.map-arrow{margin-left:auto;font-size:16px}
.location-actions{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin-top:11px}.location-action{display:flex;flex-direction:column;align-items:center;text-align:center;text-decoration:none;background:#fff;border:1px solid #e0e8f2;border-radius:9px;padding:12px 7px 10px;transition:.2s;min-width:0}.location-action:hover{transform:translateY(-2px);box-shadow:0 9px 18px rgba(20,50,90,.08);border-color:#cfe0f8}.action-icon{width:31px;height:31px;border-radius:50%;display:grid;place-items:center;margin-bottom:7px;font-size:10px;font-weight:800}.action-call .action-icon{background:#e9f2ff;color:#2563eb}.action-whatsapp .action-icon{background:#e8f8f0;color:#18a66a}.action-email .action-icon{background:#f0eaff;color:#7444e8;font-size:15px}.action-map .action-icon{background:#eaf2ff;color:#2563eb;font-size:16px}.location-action strong{font-size:9px;color:#173b63;line-height:1.3}.location-action small{font-size:7.5px;color:#728197;margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.contact-info-row{grid-template-columns:repeat(3,1fr);gap:0;background:#eef5fc;border-top:1px solid #dce7f2;border-bottom:1px solid #dce7f2;padding:0}.contact-info-item{background:linear-gradient(180deg,#f8fbff,#f2f7fd);padding:25px 34px;min-height:88px;transition:.2s}.contact-info-item:hover{background:#edf5ff}.contact-info-item a,.contact-info-item strong{color:#173b63}.contact-info-icon{background:#e8f1ff;color:#2563eb}
@media(max-width:900px){.location-actions{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.contact-location-card{padding:21px}.location-heading h2{font-size:22px}.contact-location-card .contact-location-map{height:200px}.location-actions{grid-template-columns:repeat(2,1fr)}.contact-info-item{padding:21px 20px}.contact-info-row{grid-template-columns:1fr}}
.contact-info-item{text-decoration:none;color:inherit}.contact-info-item:hover strong{color:#2563eb}.contact-info-item:nth-child(3) .contact-info-icon{background:#e7f8ef;color:#149b61;font-size:9px;font-weight:800}

/* ===== Colorful location/contact design ===== */
.contact-location-card{background:linear-gradient(180deg,#ffffff 0%,#fbfdff 100%);border-color:#dce8f7;box-shadow:0 12px 32px rgba(37,99,235,.08)}
.location-heading-icon{background:linear-gradient(135deg,#e8f1ff 0%,#d9e8ff 100%);color:#1769ff;border:1px solid #d4e4ff}
.contact-location-map{background:#eef4f9!important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.7)}
.contact-location-map iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block}
.map-fallback-card{position:absolute;z-index:5;left:13px;top:13px;background:rgba(255,255,255,.96);border-radius:8px;padding:10px 13px;min-width:190px;box-shadow:0 5px 16px rgba(21,58,96,.14);pointer-events:none}
.map-fallback-card strong{display:block;font-size:11px;color:#173b63;margin-bottom:2px}.map-fallback-card span{display:block;font-size:8px;color:#718096;margin-bottom:6px}.map-fallback-card a{pointer-events:auto;font-size:9px;font-weight:800;color:#1465e8;text-decoration:none}
.map-fallback-card a:hover{text-decoration:underline}
.map-directions{background:linear-gradient(90deg,#f5f9ff,#edf5ff);border-color:#d2e2f8;box-shadow:0 2px 8px rgba(37,99,235,.04)}
.map-google-mark{background:#fff;border:1px solid #e5edf7}
.location-actions{gap:8px}
.location-action{position:relative;overflow:hidden;background:linear-gradient(180deg,#ffffff,#fbfdff);border-color:#dbe6f3;min-height:91px;padding:11px 6px 9px}
.location-action:after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;opacity:.95}
.location-action:hover{box-shadow:0 8px 20px rgba(37,99,235,.10);transform:translateY(-3px)}
.action-call:after{background:#2d7cff}.action-whatsapp:after{background:#18b96d}.action-email:after{background:#7b42e8}.action-map:after{background:#2678ff}
.action-call .action-icon{background:#e9f2ff;color:#2370ef}.action-whatsapp .action-icon{background:#e6f8ee;color:#0ba85f}.action-email .action-icon{background:#f0e8ff;color:#7641e8}.action-map .action-icon{background:#e8f1ff;color:#2270ee}
.location-action strong{font-size:9.5px;color:#14385f}.location-action small{font-size:7.4px;color:#6f8198}
.contact-info-row{box-shadow:0 5px 20px rgba(36,80,130,.05)}
.contact-info-item{position:relative;min-height:96px;padding:22px 34px;background:linear-gradient(135deg,#f5f9ff,#edf5ff);border-right:1px solid #dce7f3}
.contact-info-item:nth-child(2){background:linear-gradient(135deg,#fbfdff,#f1f7ff)}
.contact-info-item:nth-child(3){background:linear-gradient(135deg,#f3fcf7,#eaf9f1)}
.contact-info-item:after{content:"›";position:absolute;right:24px;top:50%;transform:translateY(-50%);width:23px;height:23px;border-radius:50%;display:grid;place-items:center;background:#fff;color:#2676ed;font-size:18px;box-shadow:0 2px 8px rgba(24,80,140,.08)}
.contact-info-item:nth-child(3):after{color:#16a463}
.contact-info-item:hover{transform:none;background:#edf5ff}.contact-info-item:nth-child(3):hover{background:#e5f8ee}
.contact-info-icon{width:38px;height:38px;border-radius:50%;box-shadow:0 3px 10px rgba(37,99,235,.08)}
.contact-info-item:nth-child(2) .contact-info-icon{background:#f0e8ff;color:#7442e5}
.contact-info-item:nth-child(3) .contact-info-icon{background:#e1f7eb;color:#12a460}
.contact-info-item strong{font-size:12px;color:#14385f}.contact-info-item span{font-size:9.5px;color:#6e8097}
@media(max-width:600px){.map-fallback-card{min-width:165px}.contact-info-item{padding:20px 18px}.contact-info-item:after{right:14px}}
.contact-location-map:before,.contact-location-map:after,.contact-location-map .map-road,.contact-location-map .map-grid-lines,.contact-location-map .map-pin,.contact-location-map .map-place{display:none!important}

/* Matching colorful contact icons */
.location-heading-icon svg,.location-action .action-icon svg,.contact-info-icon svg{width:62%;height:62%;display:block}
.location-heading-icon{width:48px;height:48px;border-radius:50%;background:#2d7cff;color:#fff;box-shadow:0 6px 16px rgba(45,124,255,.22);border:0}
.location-action .action-icon{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;margin-bottom:8px}
.action-call .action-icon{background:#2d7cff;color:#fff}.action-whatsapp .action-icon{background:#10b86a;color:#fff}.action-email .action-icon{background:#7b3fe4;color:#fff}.action-map .action-icon{background:#2d7cff;color:#fff}
.action-call strong,.action-call small{color:#2370ef}.action-whatsapp strong,.action-whatsapp small{color:#0b9d5a}.action-email strong,.action-email small{color:#7440dd}.action-map strong,.action-map small{color:#2370ef}
.contact-info-icon svg{width:55%;height:55%}.contact-info-item:nth-child(1) .contact-info-icon{background:#2d7cff;color:#fff}.contact-info-item:nth-child(2) .contact-info-icon{background:#7b3fe4;color:#fff}.contact-info-item:nth-child(3) .contact-info-icon{background:#10b86a;color:#fff}
.contact-info-item:nth-child(1) strong,.contact-info-item:nth-child(1) span{color:#2370ef}.contact-info-item:nth-child(2) strong,.contact-info-item:nth-child(2) span{color:#7440dd}.contact-info-item:nth-child(3) strong,.contact-info-item:nth-child(3) span{color:#0b9d5a}

/* Match contact info text to each icon color */
.contact-info-item:nth-child(1) strong,
.contact-info-item:nth-child(1) span { color: #2370ef !important; }
.contact-info-item:nth-child(2) strong,
.contact-info-item:nth-child(2) span { color: #7440dd !important; }
.contact-info-item:nth-child(3) strong,
.contact-info-item:nth-child(3) span { color: #0b9d5a !important; }

/* Keep the arrow accent matched as well */
.contact-info-item:nth-child(1)::after { color: #2370ef; }
.contact-info-item:nth-child(2)::after { color: #7440dd; }
.contact-info-item:nth-child(3)::after { color: #0b9d5a; }