/* ============================================
   MANATHAN - Custom CSS (clean)
   Bleu: #2D5A91 | Orange: #FF8C1A
============================================ */

/* ---------- Variables ---------- */
:root{
  --man-blue:#2D5A91;
  --man-blue-dark:#123A66;
  --man-orange:#FF8C1A;
  --man-navy:rgba(0,0,51,.5);
  --man-text-on-dark:#EAF2FF;

  /* Bootstrap overrides */
  --bs-primary:var(--man-blue);
  --bs-secondary:var(--man-blue-dark);
  --bs-warning:var(--man-orange);
  --bs-dark:#0e1a26;
  --bs-light:#f7f9fc;
  --bs-link-color:var(--man-blue);
  --bs-link-hover-color:var(--man-blue);

  /* Utilitaires */
  --radius-lg:20px;
  --nav-height:80px;
}

/* =================== NAVBAR =================== */
#site-navbar{
  position:fixed; top:0; left:0; right:0; z-index:1030;
  width:100%; height:80px;
  background-color:var(--man-blue) !important;
  border-bottom:3px solid var(--man-orange);
  box-shadow:0 6px 20px rgba(0,0,0,.15);
  transition:box-shadow .25s ease, background-color .25s ease;
  overflow: visible; /* laisse le logo dépasser si plus grand que 80px */
}
.ftco-navbar-light{ background:transparent !important; box-shadow:none !important; }

#site-navbar .nav-link{
  color:#fff !important; font-weight:500; transition:color .2s ease;
  white-space:nowrap; /* 1 ligne */
}
#site-navbar .nav-link:hover,
#site-navbar .nav-link.active{ color:var(--man-orange) !important; }

#site-navbar .btn{ white-space:nowrap; line-height:1; }

/* ===== Logo — plus grand et net, sans impacter les autres items ===== */
.navbar-brand{
  padding-top:0; padding-bottom:0; line-height:0;
  display:flex; align-items:center;
  margin-right:.75rem;
}
.logo-img{
  height:65px;             /* augmente la taille du logo (desktop) */
  max-height:none;
  width:auto;
  display:block;
  object-fit:contain;
  background:#fff;
  padding:4px 8px;         /* padding réduit = logo visuellement plus grand */
  border-radius:8px;
  box-shadow:0 2px 6px rgba(0,0,0,.15);
  transition:transform .3s ease;
}
.logo-img:hover{ transform:scale(1.05); }

/* Mobile/tablette : garder un logo raisonnable pour le burger */
@media (max-width: 991.98px){
  :root{ --nav-height:72px; }
  .logo-img{ height:60px; }
  .navbar-collapse{ transition:background-color .2s ease; }
  .navbar-collapse.show{ background-color:var(--man-blue); }
  .navbar-collapse.show .nav-link,
  .navbar-collapse.show .dropdown-item{ color:#fff !important; }
  .navbar-collapse.show .dropdown-item:hover{ background-color:rgba(255,255,255,.1); }
  .navbar-toggler[aria-expanded="true"]{
    background-color:var(--man-blue); border-color:var(--man-blue); color:#fff;
  }
  .navbar-toggler[aria-expanded="true"] .fa-bars{ color:#fff; }
}

/* Espace sous nav global */
body{ padding-top:calc(var(--nav-height) + 12px); }
main.wrap{ padding-top:calc(var(--nav-height) + 12px); }
[id]{ scroll-margin-top:calc(var(--nav-height) + 12px); }

/* =================== BOUTONS =================== */
.btn-primary{ background:var(--man-blue); border-color:var(--man-blue); }
.btn-primary:hover,.btn-primary:focus{ background:var(--man-blue-dark); border-color:var(--man-blue-dark); }
.btn-outline-primary{ color:var(--man-blue); border-color:var(--man-blue); }
.btn-outline-primary:hover{ color:#fff; background:var(--man-blue); border-color:var(--man-blue); }

/* =================== TITRES / ACCENTS =================== */
.heading-section .subheading{ color:var(--man-blue); letter-spacing:.5px; font-weight:700; }
.heading-section h2 .accent{ color:var(--man-orange); }
.man-accent{
  background:linear-gradient(135deg, var(--man-orange), var(--man-orange));
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.man-badge{
  display:inline-block; font-size:.75rem; font-weight:700;
  padding:.35rem .6rem; border-radius:999px; color:#0b0b0b;
  background:linear-gradient(135deg, var(--man-orange), var(--man-orange));
}

/* =================== HERO =================== */
.hero-wrap{
  position:relative; background-position:center top; background-size:cover; min-height:80vh;
}
.hero-wrap .overlay{ display:none !important; }
.hero-wrap .slider-text{ min-height:80vh; display:flex; align-items:flex-end; }
.hero-wrap .slider-text > [class*="col-"]{ margin-top:auto; padding-bottom:2.5rem; }
.hero-wrap .slider-text h1,
.hero-wrap .slider-text .subheading,
.hero-wrap .slider-text p{
  display:inline-block; background:rgba(45,90,145,.65); color:#fff;
  padding:.35rem .65rem; border-radius:8px;
}
#toptexte2, #toptexte2 *{ color:#fff !important; }
#toptexte2{ background-color:var(--man-navy); font-size:18px; padding:1rem; border-radius:8px; }

/* Centrage texte hero desktop */
@media (min-width:992px){
  .slider-text .col-lg-6{ margin-left:auto; max-width:620px; text-align:center; }
}

/* =================== GRILLES / CARTES =================== */
.grid{ display:grid; gap:20px; grid-template-columns:repeat(1,minmax(0,1fr)); }
@media (min-width:720px){ .grid{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (min-width:1024px){ .grid{ grid-template-columns:repeat(3,minmax(0,1fr)); } }

.card{
  background:var(--man-blue-dark);
  color:var(--man-text-on-dark);
  border-radius:var(--radius-lg);
  border:1px solid rgba(0,0,0,.1);
  display:flex; flex-direction:column; min-height:100%;
  box-shadow:0 10px 30px rgba(0,0,0,.25);
  transition:transform .2s ease, box-shadow .2s ease;
}
.card:hover{ transform:translateY(-3px); box-shadow:0 16px 40px rgba(0,0,0,.35); }

.media{
  aspect-ratio:16/10;
  display:flex; align-items:center; justify-content:center;
  background:#0f1214; position:relative; overflow:hidden;
}
.badge{
  position:absolute; right:12px; bottom:12px;
  background:rgba(0,0,0,.5); color:#fff;
  border:1px solid rgba(255,255,255,.25);
  border-radius:999px; padding:6px 10px; font-size:.75rem;
}
.icon-img{ width:80px; height:80px; object-fit:contain; max-width:100%; }

.content{ padding:16px 16px 8px; display:flex; flex-direction:column; gap:10px; }
.title{ margin:0; font-size:1.1rem; line-height:1.25; }
.title span{ color:var(--man-orange); }
.desc{ margin:0; color:#d0d7e2; }
.actions{ display:flex; gap:10px; padding:0 16px 16px; margin-top:auto; }

/* Effets cartes Lovecare (icônes) */
.services-2{ border:1px solid rgba(0,0,0,.06); transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.services-2:hover{ transform:translateY(-2px); box-shadow:0 12px 28px rgba(45,90,145,.12); border-color:rgba(45,90,145,.18); }
.services-2 .icon span{ color:var(--man-blue); }
.services-2.color-2 .icon span{ color:var(--man-orange); }
.services-2.color-3 .icon span{ color:var(--man-blue-dark); }

/* =================== SECTIONS COMPACTES =================== */
.ftco-section,
.ftco-image.img,
.ftco-section-counter.img,
.ftco-causes{
  padding-top:1.25rem !important;
  padding-bottom:1.25rem !important;
  margin:0 !important;
}
section + section{ margin-top:.75rem !important; }
.heading-section{ margin-bottom:.75rem !important; }
.heading-section.mb-5{ margin-bottom:1rem !important; }
.heading-section h2{ margin-bottom:0 !important; }
.ftco-image.img{ padding-top:2rem !important; padding-bottom:2rem !important; }
.ftco-section .row.justify-content-center.pb-4{ padding-bottom:.5rem !important; }
.section-counter{ row-gap:1rem; }
.carousel-causes .item .text{ padding:.5rem 0; }

/* =================== FOOTER =================== */
footer.ftco-footer .ij-footer-btn{
  background-color:var(--man-orange) !important;
  border-color:var(--man-orange) !important;
  color:#fff !important; box-shadow:none !important;
  transition:background-color .2s ease, border-color .2s ease, color .2s ease;
}
footer.ftco-footer .ij-footer-btn:hover,
footer.ftco-footer .ij-footer-btn:focus{
  background-color:var(--man-blue) !important;
  border-color:var(--man-blue) !important;
}

/* =================== CONTACT (double bordure) =================== */
.ij-dual-border{
  position:relative; background:#fff; border-radius:.5rem;
  border:3px solid var(--man-blue);
  box-shadow:inset 0 0 0 3px var(--man-orange);
}
.ij-dual-border:hover{ box-shadow:inset 0 0 0 3px var(--man-orange), 0 2px 14px rgba(0,0,0,.06); }
.contact-eq .col-md-6{ display:flex; }
.contact-eq .ij-dual-border{ display:flex; flex-direction:column; height:100%; }
.contact-eq .ij-fill{ flex:1 1 auto; min-height:220px; background-size:cover; background-position:center; border-radius:.35rem; }

/* =================== BLOG ENTRIES =================== */
.blog-entry{ display:flex; flex-direction:column; }
.blog-entry .text{ display:flex; flex-direction:column; flex:1; }
.blog-entry .text p:last-child{ margin-top:auto; }

/* =================== IMAGES (global) =================== */
img, .img img{ max-width:100%; height:auto; display:block; }

/* Blocs .img.img-2 (avec background-image inline) */
.img.img-2{
  width:100%; aspect-ratio:16/10; background-size:cover; background-position:center;
  border-radius:inherit; overflow:hidden; min-height:220px;
}
@media (min-width:992px){
  .img.img-2{ aspect-ratio:16/9; min-height:320px; }
}
.d-flex.align-items-stretch .img img{ height:auto !important; object-fit:contain; }

/* Ajustement position texte hero si besoin */
.hero-wrap #toptexte2{ position:relative; top:clamp(16px, 7vw, 160px); }


/* === Ajustements logo sur mobile === */
@media (max-width: 767.98px){

  /* Laisse un peu plus de liberté au header */
  #site-navbar{
    height:auto;
    min-height:72px;
    padding-top:4px;
    padding-bottom:4px;
  }

  /* Le bloc du logo */
  .navbar-brand{
    margin-right:auto;          /* pousse le burger à droite */
    display:flex;
    align-items:center;
  }

  /* Le logo lui-même */
  .logo-img{
    height:auto;                /* ne force pas une hauteur fixe */
    max-height:50px;            /* limite sur petits écrans */
    width:auto;
    padding:2px 6px;            /* un peu moins de blanc autour */
    box-shadow:none;            /* optionnel si tu veux alléger sur mobile */
  }
}


/* Contact : mettre tout le texte des deux colonnes en bleu foncé */
.contact-eq .ij-dual-border,
.contact-eq .heading-section {
  color: #0D3B66; /* bleu foncé */
}

/* Faire hériter les liens de la couleur du parent */
.contact-eq .ij-dual-border a,
.contact-eq .heading-section a {
  color: inherit;
}



/* Page Contact : annuler la hauteur forcée + l'étirement vertical */
.contact-eq .h-100 { height: auto !important; }
.contact-eq .row.align-items-stretch { align-items: flex-start !important; }

/* Optionnel : masquer le filler "carte" si tu ne l'utilises pas */
.contact-eq .ij-fill { display: none; }



/* =========================================================
   HERO boxed — texte H1 remonté + anti-coupe + responsive
   À coller en bas de assets/css/custom.css
   ========================================================= */

/* Fond général (comme validé) */
body,
main.wrap{
  background-color: #FAF8F5;
}