@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;600;700&display=swap');

:root{
  --bg-1: #f7fbff;
  --bg-2: #eef6fb;
  --card: #ffffff;
  --muted: #6b7280;
  --primary: #0b63d6;
  --accent: #06b6d4;
  --warn: #f59e0b;
  --success: #10b981;
  --danger: #ef4444;
  --rounded: 12px;
  --shadow: 0 12px 36px rgba(2,12,27,0.06);
}

/* Reset / typography */
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family:"Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
  background: linear-gradient(180deg,var(--bg-1),var(--bg-2));
  color:#0b1220;
  -webkit-font-smoothing:antialiased;
  line-height:1.45;
}

/* Page wrapper adjustments */
.top-header .navbar { background:transparent; padding:0.6rem 1rem; }
.inner_banner { padding:10px 0; margin-bottom:7px; border-radius:10px; text-align:center; }
.inner_banner .full h3 { margin:0; font-size:25px; color:white; font-weight:800; }

/* Main hero: centered columns with good spacing */
.section.layout_padding.contact_section {
  padding:36px 0;
}
.section.layout_padding .container {
  max-width:1150px;
}

/* Two-column layout: left content + auth panel on the right */
.row-centered {
  display:flex;
  gap:28px;
  align-items:flex-start;
  justify-content:center;
  flex-wrap:wrap;
}
.col-left { flex: 1 1 640px; min-width:280px; }
.col-right { flex: 0 0 360px; min-width:280px; }

/* Card style for left content */
.full.float-right_img {
  background: var(--card);
  padding:22px;
  border-radius:var(--rounded);
  box-shadow:var(--shadow);
  border:1px solid rgba(11,17,32,0.04);
  text-align:center;
}
.full.float-right_img img { max-width:100%; height:auto; display:block; margin:0 auto 14px; }

/* Buttons: unified look for anchors and inputs */
.btn, a.btn {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:10px 16px;
  border-radius:10px;
  font-weight:700;
  text-decoration:none;
  border: none;
  cursor:pointer;
  transition:transform .12s ease, box-shadow .12s ease;
  box-shadow: 0 8px 22px rgba(2,12,27,0.06);
}
.btn:active{ transform:translateY(1px); }

.btn-primary { background: linear-gradient(90deg,var(--primary),#084bb3); color:#fff; }
.btn-info { background: linear-gradient(90deg,#06b6d4,#0699a7); color:#fff; }
.btn-warning { background: linear-gradient(90deg,#f59e0b,#f97316); color:#fff; }
.btn-success { background: linear-gradient(90deg,#10b981,#059669); color:#fff; }
.btn-danger { background: linear-gradient(90deg,#ef4444,#dc2626); color:#fff; }
.btn-outline-secondary {
  background:transparent; color:var(--muted); border:1px solid rgba(11,17,32,0.06);
  box-shadow:none;
}

/* Make input[type=submit] look like buttons */
input[type="submit"], input[type="button"], button[type="submit"] {
  -webkit-appearance:none;
  -moz-appearance:none;
  appearance:none;
  cursor:pointer;
  border: none;
  background: var(--primary);
  color: #fff;
  padding:10px 14px;
  border-radius:10px;
  font-weight:700;
  width:100%;
}
input[type="submit"].btn-warning { background: linear-gradient(90deg,var(--warn),#f97316); }
input[type="submit"].btn-primary { background: linear-gradient(90deg,var(--primary),#084bb3); }

/* Contact form / auth card */
.contact_form, .auth-card {
  background: linear-gradient(180deg, #fff, #fbfdff);
  border-radius:var(--rounded);
  padding:18px;
  box-shadow:var(--shadow);
  border:1px solid rgba(11,17,32,0.04);
}
.contact_form h2 { margin-top:0; color:#0b316b; font-size:18px; }
.contact_form h3 { margin:8px 0 16px; color:var(--muted); font-size:14px; }

/* Tooltip improvements */
.gfg_tooltip { position:relative; display:inline-block; }
.gfg_tooltip .gfg_text {
  visibility:hidden; opacity:0; transform:translateY(6px);
  transition:all .16s ease;
  position:absolute; left:50%; top:110%; transform-origin:top center;
  background:#fff; color:#0b1220; padding:10px; border-radius:8px;
  box-shadow:0 10px 30px rgba(2,12,27,0.06); border:1px solid rgba(11,17,32,0.04);
  width:260px; transform:translate(-50%,6px);
  z-index:40; text-align:center; font-size:13px;
}
.gfg_tooltip:hover .gfg_text { visibility:visible; opacity:1; transform:translate(-50%,0); }

/* List & spacing */
.contact_form ol { padding-left:0; margin:0; }
.contact_form li { list-style:none; margin-bottom:12px; }

/* Small helpers and text */
.lead { color:var(--muted); font-size:15px; margin-bottom:12px; }
.muted { color:var(--muted); }

/* Footer note */
.visite-note { margin-top:18px; text-align:center; color:var(--muted); font-size:13px; }

/* Responsive behavior */
@media (max-width: 991px) {
  .row-centered { gap:18px; }
  .col-left, .col-right { min-width:100%; flex-basis:100%; }
  .col-right { order:2; }
  .col-left { order:1; }
  .full.float-right_img { padding:18px; }
  .gfg_tooltip .gfg_text { left:50%; top:100%; width:calc(100% - 40px); transform:translate(-50%,8px); }
}

/* Accessibility focus */
a:focus, button:focus, input:focus { outline:3px solid rgba(11,99,214,0.12); outline-offset:3px; }

/* Utility center */
.center { display:flex; justify-content:center; align-items:center; }