/* Contact page — moved verbatim from the static contact.php <style> block. */
/* ==============================================================
       CONTACT PAGE (scoped)
    ============================================================== */
    .contact-lead{padding:80px 0 10px;text-align:center}
    .contact-lead .eyebrow-tag{
      display:inline-flex;align-items:center;gap:8px;font-weight:600;
      font-size:16px;letter-spacing:.4px;color:#1D308E;margin-bottom:10px;
    }
    .contact-lead .eyebrow-tag .dot{width:8px;height:8px;border-radius:50%;
      background:#E84110;display:inline-block;box-shadow:0 0 0 4px rgba(232,65,16,.15)}

    /* --- Office cards (borderless, soft card style) --- */
    .offices-section{padding:60px 0 45px}
    .offices-title span{color:#ff6b00}
    .office-card{
      position:relative;height:100%;background:#fff;border:0;border-radius:0;
      padding:0 26px 0 30px;cursor:pointer;box-shadow:none;overflow:hidden;
      transition:transform .3s ease;
    }
    .office-card::before{
      content:"";position:absolute;left:0;top:0;bottom:0;width:5px;
      background:linear-gradient(180deg,#1D308E 0%,#E84110 100%);
    }
    .office-card:hover{transform:translateY(-6px)}
    .office-card .oc-head{display:flex;align-items:center;gap:14px;margin-bottom:18px}
    .office-card .oc-ic{
      flex:0 0 auto;width:50px;height:50px;border-radius:15px;display:grid;place-items:center;
      background:linear-gradient(135deg,#eef1ff,#f4ecff);color:#6d3bef;
    }
    .office-card .oc-ic .material-symbols-outlined{font-size:27px}
    .office-card h3{font-size:23px;margin:0;line-height:1.15;color:#E84110}
    .office-card .oc-tag{display:inline-block;font-size:11px;font-weight:700;letter-spacing:.6px;
      text-transform:uppercase;color:#E84110;background:#fdeee9;padding:3px 10px;border-radius:30px;margin-top:6px}
    .office-card address{font-style:normal;color:#5b6577;font-size:15.5px;line-height:1.7;margin:0 0 16px}
    .office-card address strong{color:#06245b;font-weight:800}
    .office-card .oc-lines{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:10px 22px}
    .office-card .oc-lines li{display:flex;align-items:center;gap:8px;color:#38445c;font-size:15px;padding:5px 0}
    .office-card .oc-lines li .material-symbols-outlined{font-size:19px;color:#6d3bef}
    .office-card .oc-lines li a{color:#38445c}
    .office-card .oc-lines li a:hover{color:#E84110}
    .office-card .oc-contact-btn{display:inline-flex;align-items:center;gap:6px;margin-top:18px;
      font-weight:700;font-size:14px;color:#1D308E}
    .office-card .oc-contact-btn .material-symbols-outlined{font-size:18px;transition:transform .25s ease}
    .office-card .oc-contact-btn:hover{color:#E84110}
    .office-card .oc-contact-btn:hover .material-symbols-outlined{transform:translateX(3px)}

    /* --- Map --- */
    .contact-map-section{padding:10px 0 90px}
    .map-shell{
      position:relative;border-radius:22px;overflow:hidden;
      box-shadow:0 30px 70px -34px rgba(6,36,91,.30);
      border:1px solid #eef1f8;background:#ffffff;
    }
    #officeMap{width:100%;height:560px;z-index:1;background:#ffffff}
    @media(max-width:767px){#officeMap{height:440px}}
    .leaflet-container{background:#ffffff !important}

    /* Leaflet zoom control restyle */
    .leaflet-control-zoom{border:none !important;box-shadow:0 8px 24px -8px rgba(6,36,91,.4) !important;border-radius:12px !important;overflow:hidden}
    .leaflet-control-zoom a{
      width:40px !important;height:40px !important;line-height:40px !important;
      font-size:22px !important;color:#06245b !important;font-weight:700;
      background:#fff !important;border:none !important}
    .leaflet-control-zoom a:hover{background:#eef1ff !important;color:#E84110 !important}

    /* Custom pin marker */
    .cl-pin{position:relative;width:34px;height:34px}
    .cl-pin span{
      position:absolute;inset:0;margin:auto;width:16px;height:16px;border-radius:50%;
      background:#6d3bef;border:3px solid #fff;box-shadow:0 3px 8px rgba(0,0,0,.3);z-index:2}
    .cl-pin::before{content:"";position:absolute;inset:0;border-radius:50%;
      background:rgba(109,59,239,.28);animation:clPulse 2.4s ease-out infinite}
    @keyframes clPulse{0%{transform:scale(.5);opacity:.8}100%{transform:scale(2.4);opacity:0}}

    /* Permanent country label on the map (highlight) */
    .cl-label{background:transparent !important;border:0 !important;box-shadow:none !important}
    .cl-label .lbl{
      display:inline-block;font-family:'Roboto',sans-serif;font-weight:800;font-size:13px;
      color:#06245b;background:#fff;padding:4px 11px;border-radius:30px;white-space:nowrap;
      box-shadow:0 6px 16px -6px rgba(6,36,91,.35);border:1px solid #eceffa}
    .leaflet-tooltip-top.cl-label:before{display:none}

    /* Leaflet popup restyle */
    .leaflet-popup-content-wrapper{border-radius:14px !important;box-shadow:0 18px 40px -18px rgba(6,36,91,.5) !important;padding:4px 6px}
    .leaflet-popup-content{margin:14px 16px !important;font-family:'Roboto',sans-serif}
    .map-pop b{display:block;color:#06245b;font-size:16px;font-weight:800;margin-bottom:4px}
    .map-pop small{color:#5b6577;font-size:13px;line-height:1.5;display:block}
    .map-pop a{color:#E84110;font-weight:600;font-size:13px;display:inline-block;margin-top:6px}
