/*! AbidjanMaison.net – CSS complet sur mesure
 *  Couvre : header, footer, index, ventes, locations, contact, abobo, details_bien
 */

/* ── Reset ── */
*,:after,:before{box-sizing:border-box;border:0 solid #e5e7eb}
html{line-height:1.5;-webkit-text-size-adjust:100%;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif;-webkit-tap-highlight-color:transparent}
body{margin:0;line-height:inherit;font-family:'Inter',ui-sans-serif,system-ui,sans-serif}
h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit;margin:0}
a{color:inherit;text-decoration:inherit}
b,strong{font-weight:bolder}
img,video,svg,iframe,embed,canvas{display:block;vertical-align:middle;max-width:100%;height:auto}
button,input,select,textarea,optgroup{font-family:inherit;font-size:100%;font-weight:inherit;line-height:inherit;color:inherit;margin:0;padding:0}
button,select{text-transform:none}
button,[role=button]{cursor:pointer}
button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button;background-color:transparent;background-image:none}
textarea{resize:vertical}
input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}
ol,ul,menu{list-style:none;margin:0;padding:0}
p,blockquote,figure,hr,pre{margin:0}
hr{height:0;color:inherit;border-top-width:1px}
[hidden]:where(:not([hidden=until-found])){display:none}
sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}
sub{bottom:-.25em}sup{top:-.5em}
table{text-indent:0;border-color:inherit;border-collapse:collapse}

/* ── Container ── */
.container{width:100%;margin-left:auto;margin-right:auto;padding-left:1rem;padding-right:1rem}
@media(min-width:640px){.container{max-width:640px}}
@media(min-width:768px){.container{max-width:768px}}
@media(min-width:1024px){.container{max-width:1024px}}
@media(min-width:1280px){.container{max-width:1280px}}
@media(min-width:1536px){.container{max-width:1536px}}

/* ── Display ── */
.block{display:block}.inline-block{display:inline-block}.inline{display:inline}
.flex{display:flex}.inline-flex{display:inline-flex}.grid{display:grid}.hidden{display:none}

/* ── Position ── */
.static{position:static}.fixed{position:fixed}.absolute{position:absolute}
.relative{position:relative}.sticky{position:sticky}
.inset-0{top:0;right:0;bottom:0;left:0}
.top-0{top:0}.top-4{top:1rem}
.bottom-5{bottom:1.25rem}.right-4{right:1rem}.right-5{right:1.25rem}.left-0{left:0}.left-2{left:.5rem}.right-2{right:.5rem}
.top-1\/2{top:50%}
.z-50{z-index:50}
.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}
.-translate-y-1\/2{--tw-translate-y:-50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}
.-scale-x-100{--tw-scale-x:-1;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}

/* ── Overflow ── */
.overflow-hidden{overflow:hidden}

/* ── Flexbox ── */
.flex-col{flex-direction:column}.flex-row{flex-direction:row}
.flex-wrap{flex-wrap:wrap}.flex-grow{flex-grow:1}.flex-shrink-0{flex-shrink:0}
.flex-1{flex:1 1 0%}
.items-center{align-items:center}.items-start{align-items:flex-start}.items-end{align-items:flex-end}
.justify-center{justify-content:center}.justify-between{justify-content:space-between}.justify-start{justify-content:flex-start}
.self-center{align-self:center}.self-end{align-self:flex-end}
.space-x-4>:not([hidden])~:not([hidden]){margin-left:1rem}
.space-x-6>:not([hidden])~:not([hidden]){margin-left:1.5rem}
.space-y-4>:not([hidden])~:not([hidden]){margin-top:1rem}
.gap-4{gap:1rem}.gap-6{gap:1.5rem}.gap-8{gap:2rem}.gap-12{gap:3rem}

/* ── Grid ── */
.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}
.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.col-span-full{grid-column:1/-1}
@media(min-width:640px){.sm\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.sm\:grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}}
@media(min-width:768px){
  .md\:flex{display:flex}.md\:hidden{display:none}.md\:block{display:block}
  .md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
  .md\:grid-cols-6{grid-template-columns:repeat(6,minmax(0,1fr))}
  .md\:text-left{text-align:left}.md\:justify-start{justify-content:flex-start}
  .md\:mx-0{margin-left:0;margin-right:0}
  .md\:p-12{padding:3rem}
  .md\:text-6xl{font-size:3.75rem;line-height:1}
  .md\:text-xl{font-size:1.25rem;line-height:1.75rem}
  .md\:space-x-6>:not([hidden])~:not([hidden]){margin-left:1.5rem}
}
@media(min-width:1024px){
  .lg\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
  .lg\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
  .lg\:grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}
  .lg\:col-span-2{grid-column:span 2/span 2}
  .lg\:col-span-3{grid-column:span 3/span 3}
  .lg\:text-left{text-align:left}
}

/* ── Sizing ── */
.w-full{width:100%}.w-10{width:2.5rem}.w-12{width:3rem}.w-16{width:4rem}
.w-20{width:5rem}.w-24{width:6rem}.w-32{width:8rem}
.h-1{height:.25rem}.h-10{height:2.5rem}.h-12{height:3rem}.h-16{height:4rem}
.h-20{height:5rem}.h-24{height:6rem}.h-40{height:10rem}.h-48{height:12rem}
.h-56{height:14rem}.h-96{height:24rem}.h-full{height:100%}
.min-h-screen{min-height:100vh}
.max-w-4xl{max-width:56rem}.max-w-xl{max-width:36rem}
.max-w-none{max-width:none}

/* ── Margin ── */
.mx-auto{margin-left:auto;margin-right:auto}
.mx-2{margin-left:.5rem;margin-right:.5rem}
.ml-2{margin-left:.5rem}.mr-1{margin-right:.25rem}.mr-2{margin-right:.5rem}.mr-3{margin-right:.75rem}.mr-4{margin-right:1rem}
.mt-1{margin-top:.25rem}.mt-2{margin-top:.5rem}.mt-4{margin-top:1rem}.mt-6{margin-top:1.5rem}
.mt-8{margin-top:2rem}.mt-10{margin-top:2.5rem}.mt-12{margin-top:3rem}.mt-16{margin-top:4rem}.mt-auto{margin-top:auto}
.mb-1{margin-bottom:.25rem}.mb-2{margin-bottom:.5rem}.mb-3{margin-bottom:.75rem}.mb-4{margin-bottom:1rem}
.mb-6{margin-bottom:1.5rem}.mb-8{margin-bottom:2rem}.mb-12{margin-bottom:3rem}

/* ── Padding ── */
.p-2{padding:.5rem}.p-4{padding:1rem}.p-6{padding:1.5rem}.p-8{padding:2rem}
.px-2{padding-left:.5rem;padding-right:.5rem}.px-2\.5{padding-left:.625rem;padding-right:.625rem}
.px-3{padding-left:.75rem;padding-right:.75rem}.px-4{padding-left:1rem;padding-right:1rem}
.px-6{padding-left:1.5rem;padding-right:1.5rem}.px-8{padding-left:2rem;padding-right:2rem}
.px-10{padding-left:2.5rem;padding-right:2.5rem}
.py-0\.5{padding-top:.125rem;padding-bottom:.125rem}
.py-1{padding-top:.25rem;padding-bottom:.25rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}
.py-3{padding-top:.75rem;padding-bottom:.75rem}.py-4{padding-top:1rem;padding-bottom:1rem}
.py-6{padding-top:1.5rem;padding-bottom:1.5rem}.py-8{padding-top:2rem;padding-bottom:2rem}
.py-10{padding-top:2.5rem;padding-bottom:2.5rem}.py-12{padding-top:3rem;padding-bottom:3rem}
.py-16{padding-top:4rem;padding-bottom:4rem}
.pt-8{padding-top:2rem}.pt-12{padding-top:3rem}.pb-2{padding-bottom:.5rem}
.pl-6{padding-left:1.5rem}

/* ── Typography ── */
.text-xs{font-size:.75rem;line-height:1rem}.text-sm{font-size:.875rem;line-height:1.25rem}
.text-lg{font-size:1.125rem;line-height:1.75rem}.text-xl{font-size:1.25rem;line-height:1.75rem}
.text-2xl{font-size:1.5rem;line-height:2rem}.text-3xl{font-size:1.875rem;line-height:2.25rem}
.text-4xl{font-size:2.25rem;line-height:2.5rem}.text-5xl{font-size:3rem;line-height:1}
.font-bold{font-weight:700}.font-black{font-weight:900}.font-semibold{font-weight:600}
.font-medium{font-weight:500}.font-normal{font-weight:400}
.italic{font-style:italic}
.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}
.uppercase{text-transform:uppercase}
.tracking-wider{letter-spacing:.05em}
.leading-relaxed{line-height:1.625}
.whitespace-nowrap{white-space:nowrap}
.drop-shadow-lg{filter:drop-shadow(0 10px 8px rgba(0,0,0,.04)) drop-shadow(0 4px 3px rgba(0,0,0,.1))}
.drop-shadow-md{filter:drop-shadow(0 4px 3px rgba(0,0,0,.07)) drop-shadow(0 2px 2px rgba(0,0,0,.06))}
.list-disc{list-style-type:disc}
.space-y-2>:not([hidden])~:not([hidden]){margin-top:.5rem}
.prose{max-width:65ch}
.prose p{margin-top:1.25em;margin-bottom:1.25em}
.prose h2{margin-top:2em;margin-bottom:1em}
.prose ul{margin-top:1.25em;margin-bottom:1.25em}
.prose li{margin-top:.5em;margin-bottom:.5em}

/* ── Colors – Text ── */
.text-white{color:#fff}.text-black{color:#000}
.text-gray-300{color:#d1d5db}.text-gray-400{color:#9ca3af}.text-gray-500{color:#6b7280}
.text-gray-600{color:#4b5563}.text-gray-700{color:#374151}
.text-orange-500{color:#f97316}.text-orange-800{color:#9a3412}
.text-red-700{color:#b91c1c}.text-green-500{color:#22c55e}
.text-blue-600{color:#2563eb}
.text-primary{color:#f97316}

/* ── Colors – Background ── */
.bg-white{background-color:#fff}.bg-black{background-color:#000}
.bg-gray-50{background-color:#f9fafb}.bg-gray-100{background-color:#f3f4f6}
.bg-gray-800{background-color:#1f2937}
.bg-orange-50{background-color:#fff7ed}.bg-orange-100{background-color:#ffedd5}
.bg-orange-500{background-color:#f97316}.bg-orange-600{background-color:#ea580c}
.bg-red-100{background-color:#fee2e2}
.bg-green-500{background-color:#22c55e}.bg-green-600{background-color:#16a34a}
.bg-blue-600{background-color:#2563eb}.bg-blue-700{background-color:#1d4ed8}
.bg-black.bg-opacity-50{background-color:rgba(0,0,0,.5)}
.bg-opacity-50{--tw-bg-opacity:.5}

/* ── Colors – Border ── */
.border-gray-300{border-color:#d1d5db}.border-gray-800{border-color:#1f2937}
.border-orange-200{border-color:#fed7aa}.border-orange-500{border-color:#f97316}
.border-red-400{border-color:#f87171}.border-primary{border-color:#f97316}
.border-b{border-bottom-width:1px;border-bottom-style:solid}
.border-b-2{border-bottom-width:2px;border-bottom-style:solid}
.border-l-4{border-left-width:4px;border-left-style:solid}

/* ── Border Radius ── */
.rounded{border-radius:.25rem}.rounded-md{border-radius:.375rem}
.rounded-lg{border-radius:.5rem}.rounded-xl{border-radius:.75rem}
.rounded-full{border-radius:9999px}.rounded-r-lg{border-top-right-radius:.5rem;border-bottom-right-radius:.5rem}

/* ── Border width ── */
.border{border-width:1px;border-style:solid}.border-2{border-width:2px;border-style:solid}
.border-4{border-width:4px;border-style:solid}.border-t{border-top-width:1px;border-top-style:solid}

/* ── Shadow ── */
.shadow{box-shadow:0 1px 3px rgba(0,0,0,.1),0 1px 2px rgba(0,0,0,.06)}
.shadow-sm{box-shadow:0 1px 2px rgba(0,0,0,.05)}
.shadow-md{box-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -2px rgba(0,0,0,.1)}
.shadow-lg{box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1)}
.shadow-xl{box-shadow:0 20px 25px -5px rgba(0,0,0,.1),0 8px 10px -6px rgba(0,0,0,.1)}
.shadow-2xl{box-shadow:0 25px 50px -12px rgba(0,0,0,.25)}

/* ── Object fit ── */
.object-cover{object-fit:cover}.object-contain{object-fit:contain}

/* ── Opacity ── */
.opacity-30{opacity:.3}

/* ── Transition ── */
.transition{transition-property:color,background-color,border-color,opacity,box-shadow,transform;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}
.transition-opacity{transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}
.transition-colors{transition-property:color,background-color,border-color;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}
.duration-300{transition-duration:.3s}

/* ── Forms ── */
input[type=text],input[type=email],input[type=tel],input[type=number],input[type=password],select,textarea{
  border:1px solid #d1d5db;border-radius:.375rem;padding:.5rem .75rem;
  width:100%;outline:none;background:#fff;font-size:.875rem;line-height:1.5;color:#111827
}
input:focus,select:focus,textarea:focus{border-color:#f97316;box-shadow:0 0 0 2px rgba(249,115,22,.2)}
.focus\:outline-none:focus{outline:2px solid transparent;outline-offset:2px}
.focus\:ring-2:focus{--tw-ring-offset-shadow:0 0 0 2px #fff;--tw-ring-shadow:0 0 0 4px var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}
.focus\:ring-orange-500:focus{--tw-ring-color:rgba(249,115,22,.5)}
.focus\:border-orange-500:focus{border-color:#f97316}
.mt-1.block.w-full.rounded-md{margin-top:.25rem;display:block;width:100%;border-radius:.375rem}

/* ── Hover ── */
.hover\:text-white:hover{color:#fff}
.hover\:text-orange-500:hover{color:#f97316}.hover\:text-orange-600:hover{color:#ea580c}
.hover\:bg-orange-500:hover{background-color:#f97316}
.hover\:bg-orange-600:hover{background-color:#ea580c}
.hover\:bg-orange-100:hover{background-color:#ffedd5}
.hover\:bg-gray-800:hover{background-color:#1f2937}
.hover\:bg-green-600:hover{background-color:#16a34a}
.hover\:bg-blue-700:hover{background-color:#1d4ed8}
.hover\:bg-opacity-75:hover{--tw-bg-opacity:.75}
.hover\:underline:hover{text-decoration-line:underline}
.hover\:opacity-40:hover{opacity:.4}
.group:hover .group-hover\:bg-orange-50{background-color:#fff7ed}
.group:hover .group-hover\:opacity-40{opacity:.4}
.transition-colors.duration-300:hover{transition-property:color,background-color,border-color;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.3s}

/* ── Misc ── */
.select-none{user-select:none}
.cursor-pointer{cursor:pointer}
.space-y-4>:not([hidden])~:not([hidden]){margin-top:1rem}

/* ══════════════════════════════════════════════════════
   HEADER
══════════════════════════════════════════════════════ */
header a img{height:48px;width:48px;object-fit:contain}

/* ── Back to top ── */
#back-to-top{align-items:center;justify-content:center}
#back-to-top.flex{display:flex}

/* ══════════════════════════════════════════════════════
   MOBILE — max 767px
══════════════════════════════════════════════════════ */
@media(max-width:767px){
  html,body{overflow-x:hidden}
  img,video,iframe,embed,object{max-width:100%}

  /* Masque nav desktop */
  .md\:flex{display:none!important}
  .md\:hidden{display:block!important}

  /* Hamburger visible */
  #mobile-menu-button{display:flex!important;align-items:center;justify-content:center;font-size:1.5rem;background:none;border:none;color:#fff}

  /* Menu mobile */
  #mobile-menu.hidden{display:none!important}

  /* Grilles en 1 colonne */
  .grid{grid-template-columns:1fr!important}

  /* Hero */
  .bg-hero{min-height:auto!important;padding:2.5rem 1rem 1.5rem!important}
  .bg-hero h1{font-size:clamp(1.4rem,6vw,2rem)!important;line-height:1.3!important}

  /* Barre de recherche */
  #search-form{flex-direction:column!important;gap:1rem!important;margin:0!important}
  #search-form>div{width:100%!important;min-width:unset!important}
  #search-form>div[style*="width: 1px"]{display:none!important}
  #search-form select,#search-form input{font-size:16px!important}
  #search-form button{width:100%!important;justify-content:center!important}

  /* Espacement */
  .py-16{padding-top:2.5rem!important;padding-bottom:2.5rem!important}
  .container,.max-w-7xl,.max-w-6xl{padding-left:1rem!important;padding-right:1rem!important}

  /* Typo */
  h1{font-size:clamp(1.4rem,5.5vw,2rem)!important}
  h2{font-size:clamp(1.2rem,4.5vw,1.6rem)!important}
  h3{font-size:clamp(1rem,4vw,1.2rem)!important}

  /* Footer – grille 1 colonne sur mobile ; alignement géré par les breakpoints md: */
  .md\:grid-cols-2,.lg\:grid-cols-4{grid-template-columns:1fr!important}
}