
  :root{
    --chaux:#E7E1D4; --papier:#F3EFE6; --encre:#22251E;
    --sapin:#3B4A39; --sapin-clair:#5E7256; --chene:#A06E3F;
    --pierre:#7A7568; --ligne:#CFC6B4; --serif:'Fraunces',Georgia,'Times New Roman',serif;
    --sans:'Mulish',system-ui,-apple-system,'Segoe UI',sans-serif; --wrap:1180px;
  }
  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{margin:0;background:var(--chaux);color:var(--encre);font-family:var(--sans);font-weight:400;line-height:1.65;font-size:clamp(16px,1.05vw,18px);-webkit-font-smoothing:antialiased;overflow-x:hidden;}
  img{display:block;max-width:100%;}
  a{color:inherit;}
  h1,h2,h3{font-family:var(--serif);font-weight:500;line-height:1.1;margin:0;}
  p{margin:0 0 1.1em;}
  .wrap{width:min(var(--wrap),92vw);margin-inline:auto;}

  .oiseau{display:inline-block;vertical-align:middle;width:1.5em;height:1.25em;color:inherit;flex:0 0 auto;}
  .logo-toit{display:inline-block;vertical-align:middle;width:2.5em;height:1.55em;color:inherit;flex:0 0 auto;}

  .oeil{font-family:var(--sans);font-weight:700;font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;color:var(--sapin);display:inline-flex;align-items:center;gap:.6em;margin:0 0 1.1rem;}
  .oeil::before{content:"";width:9px;height:9px;background:var(--chene);box-shadow:0 0 0 4px var(--chaux),0 0 0 5px var(--ligne);transform:rotate(45deg);}

  .btn{display:inline-block;font-family:var(--sans);font-weight:600;font-size:.92rem;letter-spacing:.02em;padding:.85em 1.5em;border-radius:2px;text-decoration:none;cursor:pointer;border:1px solid transparent;transition:background .25s,color .25s,border-color .25s;}
  .btn-plein{background:var(--sapin);color:#F3EFE6;}
  .btn-plein:hover{background:var(--encre);}
  .btn-vide{background:transparent;color:var(--encre);border-color:var(--encre);}
  .btn-vide:hover{background:var(--encre);color:var(--chaux);}

  /* NAV */
  header.nav{position:fixed;inset:0 0 auto 0;z-index:50;transition:background .3s,box-shadow .3s,padding .3s;padding:1.05rem 0;}
  header.nav.colle{background:rgba(231,225,212,.94);backdrop-filter:blur(8px);box-shadow:0 1px 0 var(--ligne);padding:.65rem 0;}
  .nav-in{display:flex;align-items:center;justify-content:space-between;gap:1rem;}
  .marque{display:inline-flex;align-items:center;gap:.55rem;font-family:var(--serif);font-weight:600;font-size:1.22rem;text-decoration:none;color:#F3EFE6;line-height:1;text-shadow:0 1px 14px rgba(0,0,0,.45);}
  header.nav.colle .marque{color:var(--encre);text-shadow:none;}
  .marque small{display:block;font-family:var(--sans);font-weight:600;font-size:.58rem;letter-spacing:.18em;text-transform:uppercase;opacity:.85;margin-top:.3em;}
  .liens{display:flex;gap:1.4rem;align-items:center;}
  .liens a{color:#F3EFE6;text-decoration:none;font-weight:600;font-size:.8rem;letter-spacing:.05em;text-transform:uppercase;text-shadow:0 1px 12px rgba(0,0,0,.5);transition:color .2s;white-space:nowrap;}
  header.nav.colle .liens a{color:var(--encre);text-shadow:none;}
  .liens a:hover{color:var(--chene);}
  .burger{display:none;background:none;border:0;cursor:pointer;width:40px;height:34px;padding:6px;}
  .burger span{display:block;height:2px;background:#F3EFE6;margin:5px 0;transition:.3s;box-shadow:0 1px 8px rgba(0,0,0,.5);}
  header.nav.colle .burger span{background:var(--encre);box-shadow:none;}

  /* HERO */
  .hero{--fs:clamp(16px,2.2vw,30px);--ft:clamp(74px,11vh,118px);position:relative;min-height:100svh;display:flex;align-items:flex-end;color:#F3EFE6;overflow:hidden;}
  .hero-img{position:absolute;inset:0;background-size:cover;background-position:center 52%;}
  .hero-img::after{content:"";position:absolute;inset:0;background:radial-gradient(115% 85% at 10% 102%,rgba(20,24,18,.55) 0%,rgba(20,24,18,0) 58%),linear-gradient(180deg,rgba(20,24,18,.5) 0%,rgba(20,24,18,.12) 34%,rgba(20,24,18,.3) 62%,rgba(20,24,18,.8) 100%);}
  .hero-cadre{position:absolute;top:var(--ft);left:var(--fs);right:var(--fs);bottom:var(--fs);border:1px solid rgba(243,239,230,.55);pointer-events:none;z-index:2;}
  .hero-cadre i{position:absolute;width:9px;height:9px;background:#EAD9BE;transform:rotate(45deg);}
  .hero-cadre i:nth-child(1){top:-5px;left:-5px;} .hero-cadre i:nth-child(2){top:-5px;right:-5px;}
  .hero-cadre i:nth-child(3){bottom:-5px;left:-5px;} .hero-cadre i:nth-child(4){bottom:-5px;right:-5px;}
  .hero-in{position:relative;z-index:3;width:100%;}
  .hero-contenu{max-width:640px;margin-left:calc(var(--fs) + clamp(1.4rem,5vw,4rem));margin-right:var(--fs);padding-bottom:calc(var(--fs) + clamp(1.6rem,5vh,4rem));}
  .surtitre{font-weight:700;font-size:.74rem;letter-spacing:.2em;text-transform:uppercase;color:#EAD9BE;display:block;margin-bottom:1rem;}
  .hero h1{font-size:clamp(2.1rem,5.2vw,4.3rem);font-weight:500;max-width:15ch;text-shadow:0 2px 30px rgba(0,0,0,.5);}
  .hero h1 em{font-style:italic;color:#EAD9BE;}
  .hero .accroche{font-size:clamp(1rem,1.4vw,1.18rem);max-width:48ch;margin:1.1rem 0 1.6rem;text-shadow:0 1px 16px rgba(0,0,0,.55);}
  .hero-cta{display:flex;flex-wrap:wrap;gap:.8rem;}
  .hero .btn-vide{color:#F3EFE6;border-color:#F3EFE6;}
  .hero .btn-vide:hover{background:#F3EFE6;color:var(--encre);}
  .faits{display:flex;flex-wrap:wrap;gap:.5rem 0;margin-top:1.9rem;}
  .fait{padding-right:1.4rem;margin-right:1.4rem;border-right:1px solid rgba(243,239,230,.32);}
  .fait:last-child{border-right:0;margin-right:0;}
  .fait b{display:block;font-family:var(--serif);font-size:1.2rem;font-weight:500;line-height:1.1;text-shadow:0 1px 16px rgba(0,0,0,.55);}
  .fait span{font-size:.75rem;letter-spacing:.03em;opacity:.92;text-shadow:0 1px 12px rgba(0,0,0,.55);}

  /* SECTIONS */
  section{padding:clamp(4rem,8vw,7.5rem) 0;}
  .titre{font-size:clamp(1.9rem,3.8vw,3.1rem);max-width:20ch;margin-bottom:1.2rem;}
  .intro-txt{max-width:62ch;font-size:1.06rem;color:#33372C;}
  .deux{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,4.5rem);align-items:center;}
  .lead{font-family:var(--serif);font-size:clamp(1.3rem,2.2vw,1.7rem);line-height:1.4;font-weight:400;color:var(--sapin);}
  .alsacien{font-family:var(--serif);font-style:italic;color:var(--chene);}

  .band{padding:0;position:relative;color:#F3EFE6;text-align:center;overflow:hidden;background:var(--sapin);}
  .band-img{display:block;width:100%;height:auto;}
  .band::after{content:"";position:absolute;inset:0;background:rgba(20,24,18,.15);z-index:1;}
  .band .wrap{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:2;padding:1.2rem;}
  @media(max-width:560px){.band{display:block;}.band .wrap{position:static;padding:1.6rem 0;}.band::after{display:none;}}
  .band h2{font-size:clamp(1.5rem,2.8vw,2.4rem);color:#F3EFE6;max-width:26ch;margin-inline:auto;text-shadow:0 1px 16px rgba(0,0,0,.55);}
  .band p{margin-top:1rem;max-width:50ch;margin-inline:auto;text-shadow:0 1px 12px rgba(0,0,0,.4);}

  .grille{display:grid;gap:1.1rem;}
  .g-gite{grid-template-columns:repeat(6,1fr);grid-auto-rows:200px;}
  .ph{position:relative;overflow:hidden;border-radius:2px;background:var(--ligne);}
  .ph img{width:100%;height:100%;object-fit:cover;transition:transform .9s cubic-bezier(.2,.6,.2,1);}
  .ph:hover img{transform:scale(1.045);}
  .ph .lg{position:absolute;left:0;bottom:0;right:0;padding:1.4rem .9rem .7rem;color:#fff;font-size:.82rem;font-weight:600;letter-spacing:.03em;background:linear-gradient(0deg,rgba(20,24,18,.72),transparent);}
  .c1{grid-column:span 1;}.c2{grid-column:span 2;}.c3{grid-column:span 3;}.c4{grid-column:span 4;}
  .r2{grid-row:span 2;}

  .g-ferme{grid-template-columns:repeat(3,1fr);}
  .g-ferme .ph{aspect-ratio:4/3;}
  .placeholder{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:.5rem;background:repeating-linear-gradient(135deg,var(--papier),var(--papier) 14px,#EDE7DA 14px,#EDE7DA 28px);border:1px dashed var(--chene);color:var(--pierre);border-radius:2px;padding:1rem;}
  .placeholder b{font-family:var(--serif);color:var(--sapin);font-size:1.2rem;font-weight:500;}
  .placeholder span{font-size:.8rem;letter-spacing:.03em;}
  .placeholder .oiseau,.placeholder svg{width:38px;height:32px;color:var(--chene);opacity:.85;}

  /* maison (construction, version sobre) */
  .maison-sec{background:var(--papier);}
  .trois{display:grid;grid-template-columns:repeat(3,1fr);gap:1.1rem;margin-top:2.2rem;}
  .trois .ph{aspect-ratio:3/4;}
  .mini-tags{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.6rem;}
  .tag{font-size:.78rem;font-weight:600;letter-spacing:.04em;color:var(--sapin);border:1px solid var(--ligne);background:var(--chaux);border-radius:30px;padding:.4em 1em;}

  .table-sec{background:var(--papier);}
  .table-ph{aspect-ratio:16/9;}

  .acces-sec{background:var(--sapin);color:#EDE9DE;}
  .acces-sec .oeil{color:#C9B79A;}
  .acces-sec .oeil::before{box-shadow:0 0 0 4px var(--sapin),0 0 0 5px rgba(255,255,255,.25);}
  .acces-sec .titre{color:#F3EFE6;}
  .acces-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(2rem,5vw,4rem);align-items:start;}
  .infos{padding:0;margin:1.5rem 0 0;}
  .infos li{list-style:none;padding:1rem 0;border-bottom:1px solid rgba(255,255,255,.16);display:flex;gap:1rem;align-items:flex-start;}
  .infos b{font-family:var(--serif);font-weight:500;display:block;font-size:1.08rem;margin-bottom:.15rem;color:#F3EFE6;}
  .infos .ic{flex:0 0 auto;width:26px;height:26px;color:#C9B79A;margin-top:2px;}
  .saisons{display:grid;grid-template-columns:1fr;gap:.9rem;}
  .saisons .ph{aspect-ratio:3/2;}

  .nous-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.1rem;}
  .nous-grid .ph{aspect-ratio:4/5;}

  .contact-sec{background:var(--papier);}
  .contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2.2rem,5vw,4.5rem);}
  form .champ{margin-bottom:1.1rem;}
  label{display:block;font-size:.78rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--pierre);margin-bottom:.4rem;}
  input,textarea,select{width:100%;font-family:var(--sans);font-size:1rem;padding:.8em .9em;border:1px solid var(--ligne);background:var(--chaux);border-radius:2px;color:var(--encre);}
  input:focus,textarea:focus,select:focus{outline:2px solid var(--sapin);outline-offset:1px;border-color:var(--sapin);}
  .deux-champs{display:grid;grid-template-columns:1fr 1fr;gap:1rem;}
  .coord{padding:0;margin:1.2rem 0 0;}
  .coord li{list-style:none;padding:.9rem 0;border-bottom:1px solid var(--ligne);}
  .coord b{font-family:var(--serif);font-weight:500;display:block;margin-bottom:.1rem;}
  .note{font-size:.82rem;color:var(--pierre);}
  .editable{background:#F7E9C9;padding:0 .25em;border-radius:2px;}

  footer{background:var(--encre);color:#CFC6B4;padding:3.5rem 0 2.5rem;}
  .foot-grid{display:flex;flex-wrap:wrap;justify-content:space-between;gap:2rem;}
  footer .marque{color:#F3EFE6;text-shadow:none;}
  .foot-liens a{color:#CFC6B4;text-decoration:none;display:block;margin:.35rem 0;font-size:.9rem;}
  .foot-liens a:hover{color:var(--chene);}
  .foot-bas{border-top:1px solid rgba(255,255,255,.12);margin-top:2.5rem;padding-top:1.5rem;font-size:.78rem;color:#8E8775;display:flex;flex-wrap:wrap;justify-content:space-between;gap:1rem;}

  .reveal{opacity:0;transform:translateY(22px);transition:opacity .8s ease,transform .8s ease;}
  .reveal.vu{opacity:1;transform:none;}

  @media(max-width:980px){
    .liens{position:fixed;inset:0 0 0 auto;width:min(78vw,320px);background:var(--sapin);flex-direction:column;justify-content:center;align-items:flex-start;padding:2rem;gap:1.3rem;transform:translateX(100%);transition:transform .35s;box-shadow:-10px 0 40px rgba(0,0,0,.3);}
    .liens.ouvert{transform:none;}
    .liens a{color:#F3EFE6;font-size:1rem;text-shadow:none;}
    header.nav.colle .liens a{color:#F3EFE6;}
    .burger{display:block;}
    header.nav.colle{backdrop-filter:none;-webkit-backdrop-filter:none;}
    .deux,.acces-grid,.contact-grid{grid-template-columns:1fr;}
    .g-gite{grid-template-columns:repeat(2,1fr);grid-auto-rows:160px;}
    .g-gite .c2,.g-gite .c3,.g-gite .c4{grid-column:span 2;}
    .g-ferme{grid-template-columns:repeat(2,1fr);}
    .trois{grid-template-columns:1fr 1fr;}
  }
  @media(max-width:560px){
    .deux-champs,.saisons,.nous-grid,.trois{grid-template-columns:1fr;}
    .fait{border-right:0;}
  }
  @media(prefers-reduced-motion:reduce){
    *{scroll-behavior:auto!important;}
    .reveal{opacity:1;transform:none;transition:none;}
    .ph img{transition:none;}
  }
