/* Darna : réglages communes à toutes les pages (chargé après style.css). */

.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}

/* Use a lighter beige for decorative grey surfaces only; keep the off-white and text colors untouched. */
:root{--petrol-medium:#d9c9a8;--petrol-light:#d9c9a8;--petrol-warm:#d9c9a8;--blue:#d9c9a8}
.section_timeline.is-green-bg,.cards_card.is-1,.layout_component.is-blue,.hero_background{background-color:#f3eee7}
#renovation-complete.layout_component{background-color:#f3eee7}
#villa-palmeraie.section_avenir{background-color:#f3eee7}
#villa-palmeraie .layout_component{background-color:#f3eee7}
.section_additional-projects .layout_component{background-color:#f3eee7}
.layout_component.is-green,.layout_image-overlay.is-green,.nav_mobile-bg,.footer_form-button:hover{background-color:#f3eee7}
#villa-palmeraie .project-copy{display:flex;flex-direction:column;gap:1rem;align-self:center;margin:0 auto;max-width:36rem}
#villa-palmeraie .layout_section-text{margin:0;text-align:justify;font-family:Season Serif,Georgia,sans-serif;font-size:var(--_responsive---h4);font-weight:400;line-height:1.4;text-indent:1.5em}
#villa-palmeraie .project-image-two{margin-bottom:0}
#villa-palmeraie .project-image-three{margin-top:0}
#villa-palmeraie .project-image-three .layout_media-wrapper{margin-top:0}
@media screen and (min-width:768px){#villa-palmeraie .project-image-two{position:relative;justify-content:flex-end;margin-bottom:1.5rem}#villa-palmeraie .project-copy{position:absolute;top:0;left:0;width:calc(50% - 2rem);margin:0}}
@media screen and (min-width:992px){#villa-palmeraie .project-image-one{margin-bottom:2.375rem}#villa-palmeraie .project-image-two{margin-bottom:2.375rem}#villa-palmeraie .project-copy{left:max(0px,calc(25% - 19rem))}}

/* ---------- Logo Darna (SVG, prend la couleur du texte) ---------- */
.darna-logo{display:block;width:auto;max-width:none;color:inherit;overflow:visible}
.nav_logo.darna-logo{height:1.6rem;top:0}
.footer_logotype.darna-logo{width:9rem;height:auto}
.footer_logomark.darna-logo{width:auto;height:3rem}
@media screen and (max-width:991px){
  .nav_logo.darna-logo{height:1.9rem;top:0}
  .footer_logomark.darna-logo{height:2.6rem}
}

/* ---------- Titres et pied de page : ajustements responsive ---------- */
@media screen and (max-width:991px){.title_heading{font-size:clamp(2rem,7vw,5rem)!important;line-height:.95!important;max-width:100%;white-space:normal!important;overflow-wrap:normal;word-break:normal;text-wrap:balance}.footer_display-text{font-size:clamp(2rem,7vw,5rem)!important;line-height:.95!important;width:100%;max-width:100%;white-space:normal;overflow-wrap:break-word;text-wrap:balance}.section_info .info_text{font-size:clamp(1.75rem,7vw,4rem)!important;max-width:100%;overflow-wrap:anywhere}}
@media screen and (min-width:992px){.footer_display-text{font-size:8.63vw!important;width:100%;max-width:100%;white-space:nowrap!important}}
@media screen and (max-width:479px){.layout_heading{font-size:clamp(2rem,12.5vw,3.25rem)!important;max-width:calc(100vw - 2rem);margin-inline:auto}}

/* ---------- Accents des titres (É, À, Â) : jamais coupés ----------
   Les titres ont un interlignage serré (.88 à .95) : les accents des majuscules
   dépassent de la ligne. Les masques de SplitText et le bandeau du pied de page
   sont en overflow:hidden ; on leur donne de la marge en haut (padding compensé
   par une marge négative pour les masques, simple padding pour le pied de page). */
.split-mask-line-mask{padding:.2em .06em .1em;margin:-.2em -.06em -.1em}
.footer_display-text{padding-top:.2em}
@media screen and (max-width:991px){.footer_display-text-wrapper{padding-left:1rem;padding-right:1rem}.footer_display-text{margin-left:0}}

/* ---------- Menu mobile (remplace l'interaction Webflow) ---------- */
.nav_burger{cursor:pointer}
/* Trois traits : haut (is-1), milieu (is-3), bas (is-2) ; ils forment une croix à l'ouverture. */
.nav_burger-line{width:50%;transition:transform .35s cubic-bezier(.19,1,.22,1),opacity .2s}
.nav_burger-line.is-1{transform:translateY(-.32rem)}
.nav_burger-line.is-2{transform:translateY(.32rem)}
.nav_component.is-open .nav_burger-line.is-1{transform:rotate(45deg)}
.nav_component.is-open .nav_burger-line.is-2{transform:rotate(-45deg)}
.nav_component.is-open .nav_burger-line.is-3{opacity:0;transform:scaleX(0)}
@media screen and (max-width:991px){
  .nav_component.is-open .nav_container{display:flex;animation:menu-in .45s cubic-bezier(.19,1,.22,1)}
  @keyframes menu-in{from{opacity:0;transform:translateY(-1rem)}}
  .nav_menu-expanded{flex-wrap:wrap;row-gap:.5rem}
}
body.menu-open{overflow:hidden}
/* Petits écrans bureau : les sous-liens de Réalisations ne tiennent pas dans la barre. */
@media screen and (min-width:992px) and (max-width:1199px){.nav_container .nav_menu-group .nav_menu-expanded{display:none!important}}

/* ---------- Formulaires : message affiché après ouverture de l'email ---------- */
.form-done.is-visible{display:block}

/* ---------- Mouvement réduit ---------- */
@media (prefers-reduced-motion:reduce){
  *,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}
}


/* ---------- Page Devis : formulaire en étapes avec cartes à icônes ---------- */
.devis_form-block{max-width:46rem;margin:0 auto;padding:0 .75rem}
.devis_panel{position:relative;overflow:hidden;background-color:var(--black-100);color:var(--white-0);border-radius:.85rem;box-shadow:0 1.5rem 3rem #1e1e1c33}
.devis_progress{position:absolute;top:0;left:0;right:0;height:3px;background-color:#f7f7f01a}
.devis_progress-fill{height:100%;width:0;background-color:#d9c9a8;transition:width .6s cubic-bezier(.19,1,.22,1)}
.devis_panel-top{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1.5rem 1.75rem 0}
.devis_badge{display:inline-flex;align-items:center;gap:.4rem;padding:.35rem .8rem;border:1px solid #d9c9a866;border-radius:2rem;color:#d9c9a8;font-size:.7rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.devis_badge i,.devis_badge svg{width:.9rem;height:.9rem}
.devis_counter{font-size:var(--_responsive---small);color:#f7f7f099}
.devis_form{margin:0;padding:1.25rem 1.75rem 1.75rem}
.devis_step{border:0;margin:0;padding:0;min-width:0;display:flex;flex-direction:column;gap:1.75rem}
.devis_step[hidden]{display:none}
.devis_step.is-entering{animation:devis-step-in .5s cubic-bezier(.19,1,.22,1)}
@keyframes devis-step-in{from{opacity:0;transform:translateX(1.5rem)}}
.devis_step-head{float:left;width:100%;display:flex;align-items:center;gap:.85rem;padding:0 0 1.25rem;border-bottom:1px solid #f7f7f01a}
.devis_step-head+*{clear:both}
.devis_step-number{flex:none;display:flex;align-items:center;justify-content:center;width:2.1rem;height:2.1rem;border:1px solid #d9c9a8;border-radius:50%;color:#d9c9a8;font-size:.75rem;font-weight:700}
.devis_step-title{font-family:Season Serif,Georgia,sans-serif;font-size:var(--_responsive---h4);font-weight:400;line-height:1.2}
.devis_question{display:flex;flex-direction:column;gap:.75rem;min-width:0}
.devis_label{font-size:.75rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#f7f7f0b3}
.devis_hint{margin-left:.35rem;font-weight:200;letter-spacing:0;text-transform:none;color:#f7f7f066}
/* Cartes */
.devis_cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.6rem}
.devis_card{position:relative;display:block;cursor:pointer;margin:0}
.devis_card input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
.devis_card-inner{height:100%;min-height:5.5rem;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.3rem;padding:1rem .6rem;text-align:center;border:1px solid #f7f7f033;border-radius:.65rem;background-color:#f7f7f008;color:#f7f7f0a6;transition:border-color .25s,background-color .25s,color .25s,box-shadow .25s}
.devis_card-inner i,.devis_card-inner svg{width:1.35rem;height:1.35rem;margin-bottom:.3rem;stroke-width:1.5;transition:color .25s}
.devis_card-main{font-size:.9rem;line-height:1.2;color:inherit}
.devis_card-sub{font-size:.72rem;line-height:1.2;color:#f7f7f066}
.devis_card:hover .devis_card-inner{border-color:#d9c9a880;color:var(--white-0)}
.devis_card:hover .devis_card-inner svg{color:#d9c9a8}
.devis_card input:checked+.devis_card-inner{border-color:#d9c9a8;background-color:#d9c9a81f;color:var(--white-0);box-shadow:0 0 1.1rem #d9c9a826}
.devis_card input:checked+.devis_card-inner svg{color:#d9c9a8}
.devis_card input:checked+.devis_card-inner .devis_card-sub{color:#f7f7f0a6}
.devis_card input:focus-visible+.devis_card-inner{outline:.125rem solid #d9c9a8;outline-offset:.125rem}
.devis_cards.is-compact .devis_card-inner{min-height:3.5rem;flex-direction:row;gap:.5rem}
.devis_cards.is-compact .devis_card-inner svg{margin-bottom:0}
/* Champs texte à libellé flottant */
.devis_row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.75rem 1.5rem}
.devis_input{position:relative;gap:.4rem}
.devis_field{width:100%;height:3rem;margin:0;padding:1rem 2rem 0 0;background-color:transparent;color:var(--white-0);border:0;border-bottom:1px solid #f7f7f033;border-radius:0;font:inherit;font-size:1rem;transition:border-color .35s}
.devis_field:focus{outline:0;border-color:#d9c9a8}
.devis_float{position:absolute;left:0;top:1rem;font-size:.95rem;color:#f7f7f080;pointer-events:none;transform-origin:left top;transition:transform .25s,color .25s}
.devis_field:focus+.devis_float,.devis_field:not(:placeholder-shown)+.devis_float{transform:translateY(-1.05rem) scale(.78);color:#d9c9a8}
.devis_input>svg{position:absolute;right:0;top:1.1rem;width:1.1rem;height:1.1rem;color:#f7f7f066;pointer-events:none}
.devis_input:focus-within>svg{color:#d9c9a8}
.devis_textarea{min-height:11rem;width:100%;margin:0;padding:.9rem 1rem;resize:vertical;background-color:#f7f7f008;color:var(--white-0);border:1px solid #f7f7f033;border-radius:.65rem;font-family:Season Serif,Georgia,sans-serif;font-size:1.05rem;line-height:1.45}
.devis_textarea:focus{outline:0;border-color:#d9c9a8}
.devis_textarea::placeholder{color:#f7f7f059}
/* Envoi de fichiers */
.devis_upload{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.25rem;min-height:9rem;padding:1.5rem;border:1px dashed #f7f7f059;border-radius:.65rem;text-align:center;cursor:pointer;transition:border-color .25s,background-color .25s}
.devis_upload>svg{width:1.6rem;height:1.6rem;margin-bottom:.35rem;color:#d9c9a8;stroke-width:1.5}
.devis_upload:hover,.devis_upload.is-dragover{border-color:#d9c9a8;background-color:#d9c9a80f}
.devis_upload input{position:absolute;inset:0;opacity:0;cursor:pointer}
.devis_upload:focus-within{outline:.125rem solid #d9c9a8;outline-offset:.125rem}
.devis_upload-title{font-family:Season Serif,Georgia,sans-serif;font-size:var(--_responsive---large)}
.devis_upload-text{font-size:var(--_responsive---small);color:#f7f7f080}
.devis_files{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(6rem,1fr));gap:.5rem}
.devis_files:empty{display:none}
.devis_file{position:relative;aspect-ratio:1;border-radius:.5rem;overflow:hidden;background-color:#f7f7f01a;display:flex;align-items:flex-end}
.devis_file img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.devis_file-name{position:relative;width:100%;padding:.3rem .4rem;font-size:.7rem;line-height:1.2;background:linear-gradient(transparent,#1e1e1ccc);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.devis_file-remove{position:absolute;top:.3rem;right:.3rem;width:1.5rem;height:1.5rem;border:0;border-radius:50%;padding:0;background-color:var(--white-0);color:var(--black-100);font-size:1rem;line-height:1;cursor:pointer}
/* Consentement */
.devis_consent{display:flex;align-items:flex-start;gap:.75rem;cursor:pointer;font-size:var(--_responsive---small);line-height:1.45;color:#f7f7f0b3}
.devis_consent input{position:absolute;opacity:0;width:1px;height:1px}
.devis_consent-box{flex:none;display:flex;align-items:center;justify-content:center;width:1.25rem;height:1.25rem;margin-top:.05rem;border:1px solid #f7f7f066;border-radius:.3rem;transition:background-color .2s,border-color .2s}
.devis_consent-box svg{width:.85rem;height:.85rem;stroke-width:3;color:var(--black-100);opacity:0}
.devis_consent input:checked+.devis_consent-box{background-color:#d9c9a8;border-color:#d9c9a8}
.devis_consent input:checked+.devis_consent-box svg{opacity:1}
.devis_consent input:focus-visible+.devis_consent-box{outline:.125rem solid #d9c9a8;outline-offset:.125rem}
.devis_consent-wrap{padding-top:1.25rem;border-top:1px solid #f7f7f01a}
/* Erreurs par question */
.devis_err{display:none;align-items:center;gap:.4rem;font-size:.8rem;color:#f2a7a0}
.devis_err svg{width:.95rem;height:.95rem;flex:none}
.devis_question.is-error .devis_err{display:flex}
.devis_question.is-error .devis_card-inner,.devis_question.is-error .devis_textarea,.devis_question.is-error .devis_consent-box{border-color:#f2a7a080}
.devis_question.is-error .devis_field{border-color:#f2a7a0}
/* Navigation */
.devis_nav{display:flex;align-items:center;justify-content:flex-end;gap:1rem;margin-top:1.75rem;padding-top:1.5rem;border-top:1px solid #f7f7f01a}
.devis_nav [hidden]{display:none}
.devis_button{display:inline-flex;align-items:center;gap:.6rem;border:0;border-radius:.5rem;padding:.85rem 1.4rem;background-color:var(--white-0);color:var(--black-100);font:inherit;font-weight:700;cursor:pointer;transition:background-color .3s,transform .3s}
.devis_button svg{width:1.05rem;height:1.05rem;transition:transform .3s}
.devis_button:hover{background-color:#d9c9a8}
.devis_button:hover svg{transform:translateX(.2rem)}
.devis_button:disabled{opacity:.6;cursor:wait}
.devis_back{display:inline-flex;align-items:center;gap:.45rem;margin-right:auto;padding:.5rem 0;border:0;background:none;color:#f7f7f0a6;font:inherit;font-size:var(--_responsive---small);cursor:pointer;transition:color .25s}
.devis_back svg{width:1rem;height:1rem}
.devis_back:hover{color:var(--white-0)}
/* Pied de carte et écrans finaux */
.devis_trust{display:flex;flex-wrap:wrap;justify-content:center;gap:.6rem 1.5rem;padding:1rem 1.25rem;border-top:1px solid #f7f7f01a;font-size:.72rem;color:#f7f7f080}
.devis_trust span{display:inline-flex;align-items:center;gap:.4rem}
.devis_trust svg{width:.95rem;height:.95rem;color:#d9c9a8}
.devis_success{display:none;flex-direction:column;align-items:center;text-align:center;gap:1rem;padding:3.5rem 1.75rem 3rem;background:none}
.devis_success.is-visible{display:flex}
.devis_success-icon svg{width:3rem;height:3rem;color:#d9c9a8;stroke-width:1.25}
.devis_success-title{margin:0;font-family:Season Serif,Georgia,sans-serif;font-size:var(--_responsive---h3);font-weight:400}
.devis_success p{margin:0;max-width:28rem;color:#f7f7f0b3}
.devis_success .devis_back{margin:0;color:#d9c9a8}
.devis_note{color:#d9c9a8!important;font-size:var(--_responsive---small)}
.devis_fail{display:none;align-items:center;gap:.5rem;margin:0 1.75rem 1.25rem;padding:.75rem 1rem;border-radius:.5rem;background-color:#f2a7a01a;color:#f2a7a0;font-size:var(--_responsive---small)}
.devis_fail svg{width:1rem;height:1rem;flex:none}
@media screen and (max-width:767px){
  .devis_panel-top{padding:1.25rem 1.1rem 0}
  .devis_form{padding:1rem 1.1rem 1.25rem}
  .devis_cards{grid-template-columns:repeat(2,minmax(0,1fr))}
  .devis_cards.is-compact{grid-template-columns:minmax(0,1fr)}
  .devis_cards.is-compact .devis_card-inner{justify-content:flex-start;padding:.8rem 1rem}
  .devis_row{grid-template-columns:minmax(0,1fr)}
  .devis_button{padding:.85rem 1.2rem}
}
.devis_cards.is-four{grid-template-columns:repeat(4,minmax(0,1fr))}
@media screen and (max-width:767px){.devis_cards.is-four{grid-template-columns:repeat(2,minmax(0,1fr))}}
