/* Map Boutique — Agence V5 « Maison » — SSR full-standalone
   Porté depuis la maquette agence-villefranche-maison.html (v1.12.0) */
:root{
  --paper:#fdfdfb;
  --paper-2:#f4f3ef;
  --ink:#101010;
  --ink-2:#4a4a48;
  --mute:#9a978f;
  --line:#e6e4dd;
  --line-2:#d9d6cd;
  --disp:'Jost',Arial,sans-serif;
  --body:'Archivo',Arial,sans-serif;
  --maxw:1340px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--body);background:var(--paper);color:var(--ink);font-weight:400;line-height:1.7;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
:focus-visible{outline:1.5px solid var(--ink);outline-offset:4px}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 48px}

.lbl{font-family:var(--body);font-weight:500;font-size:.64rem;letter-spacing:.34em;text-transform:uppercase;color:var(--mute)}
.cap{font-family:var(--body);font-weight:500;font-size:.6rem;letter-spacing:.26em;text-transform:uppercase;color:var(--mute)}

/* reveals */
.reveal{opacity:0;transform:translateY(26px);transition:opacity 1.1s cubic-bezier(.2,.7,.2,1),transform 1.1s cubic-bezier(.2,.7,.2,1)}
.reveal.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}}

/* photo (fallback dégradé + image réelle) */
.photo{position:relative;overflow:hidden;background:
  linear-gradient(165deg,#f3f1eb 0%,#e7e4db 50%,#d6d2c7 100%)}
.photo::after{content:"";position:absolute;inset:0;background:
  radial-gradient(70% 55% at 72% 18%,rgba(255,255,255,.55),transparent 62%),
  linear-gradient(180deg,transparent 60%,rgba(16,16,16,.06) 100%)}
.photo>img,.photo>picture{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.photo>picture>img{width:100%;height:100%;object-fit:cover}
.photo .pc{position:absolute;left:24px;bottom:20px;z-index:2}

/* link arrow */
.lk{display:inline-flex;align-items:center;gap:12px;font-family:var(--body);font-weight:500;font-size:.7rem;letter-spacing:.22em;text-transform:uppercase;color:var(--ink);padding-bottom:6px;border-bottom:1px solid var(--ink);transition:gap .3s ease,color .3s ease,border-color .3s ease}
.lk:hover{gap:20px}
.lk.light{color:#fff;border-color:rgba(255,255,255,.6)}
.lk.light:hover{border-color:#fff}

/* header */
.head{position:fixed;top:0;left:0;right:0;z-index:50;transition:background .4s ease,border-color .4s ease;border-bottom:1px solid transparent}
.head.solid{background:rgba(253,253,251,.9);backdrop-filter:blur(16px);border-bottom-color:var(--line)}
.head .wrap{display:flex;align-items:center;justify-content:space-between;height:84px}
.brand{display:flex;align-items:center;gap:12px;font-family:var(--body);font-weight:500;font-size:.78rem;letter-spacing:.24em;text-transform:uppercase}
.brand .o{width:15px;height:15px;border:3px solid var(--ink);border-radius:50%;flex:none}
nav.main{display:flex;gap:42px}
nav.main a{font-family:var(--body);font-weight:500;font-size:.66rem;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-2)}
nav.main a:hover{color:var(--ink)}
.head-right{display:flex;align-items:center;gap:30px}
.head-tel{font-family:var(--body);font-weight:500;font-size:.7rem;letter-spacing:.14em}
.head-tel:hover{color:var(--mute)}
.head.on-photo .brand,.head.on-photo nav.main a,.head.on-photo .head-tel,.head.on-photo .brand .o{color:#fff;border-color:#fff}
.head.on-photo.solid .brand,.head.on-photo.solid nav.main a,.head.on-photo.solid .head-tel{color:var(--ink)}
.head.on-photo.solid .brand .o{border-color:var(--ink)}
.head.on-photo.solid nav.main a{color:var(--ink-2)}

/* hero */
.hero{height:100vh;min-height:620px;position:relative}
.hero .photo{position:absolute;inset:0;background:
  linear-gradient(120deg,#e9e6dd 0%,#dcd8cd 40%,#cbc6b9 100%)}
.hero .photo::after{background:
  radial-gradient(60% 50% at 75% 25%,rgba(255,255,255,.45),transparent 60%),
  linear-gradient(180deg,rgba(16,16,16,.12) 0%,transparent 30%,transparent 55%,rgba(16,16,16,.34) 100%)}
.hero .photo::after{z-index:1}
.hero .inner{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;justify-content:flex-end}
.hero .inner .wrap{padding-bottom:72px;width:100%}
.hero .eyebrow{color:#fff;opacity:.92;margin-bottom:26px;display:block}
.hero h1{font-family:var(--disp);font-weight:200;font-size:clamp(3.4rem,9vw,8rem);line-height:.94;letter-spacing:-.01em;color:#fff !important}
.hero h1 em{font-style:normal;display:block;font-size:.3em;letter-spacing:.22em;text-transform:uppercase;font-weight:400;opacity:.85;margin-top:24px}
.hero .meta{display:flex;align-items:center;gap:26px;flex-wrap:wrap;margin-top:40px}
.hero .meta .status{display:flex;align-items:center;gap:10px;color:#fff;font-family:var(--body);font-weight:500;font-size:.66rem;letter-spacing:.18em;text-transform:uppercase}
.dot{width:7px;height:7px;border-radius:50%;background:#5fd2a8;flex:none}
.dot.closed{background:#e88}
.hero .meta .sep{width:1px;height:14px;background:rgba(255,255,255,.4)}
.hero .meta .rate{color:#fff;font-family:var(--body);font-weight:500;font-size:.66rem;letter-spacing:.18em;text-transform:uppercase}
.hero .meta .rate b{font-weight:500}

/* statement */
.statement{padding:160px 0}
.statement .wrap{max-width:1040px}
.statement .lbl{display:block;margin-bottom:38px}
.statement p{font-family:var(--disp);font-weight:300;font-size:clamp(1.9rem,4.4vw,3.4rem);line-height:1.18;letter-spacing:-.01em}
.statement p .dim{color:var(--mute)}
.statement .more{margin-top:50px}

/* editorial split */
.edit{padding:60px 0}
.edit .wrap{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}
.edit.rev .wrap{direction:rtl}
.edit.rev .etext{direction:ltr}
.edit .ephoto{aspect-ratio:5/6}
.edit .num{font-family:var(--disp);font-weight:300;font-size:.8rem;letter-spacing:.1em;color:var(--mute);margin-bottom:24px;display:block}
.edit h2{font-family:var(--disp);font-weight:300;font-size:clamp(2rem,4vw,2.9rem);line-height:1.1;letter-spacing:-.01em;margin-bottom:28px}
.edit p{color:var(--ink-2);font-size:1.05rem;margin-bottom:18px;max-width:480px}
.edit .more{margin-top:24px}

/* full bleed */
.bleed{height:78vh;min-height:520px;position:relative}
.bleed .photo{position:absolute;inset:0;background:linear-gradient(130deg,#dcd9d0,#c8c3b6 60%,#b8b2a4)}
.bleed .photo::after{background:
  radial-gradient(60% 60% at 30% 30%,rgba(255,255,255,.35),transparent 60%),
  linear-gradient(180deg,transparent 55%,rgba(16,16,16,.3) 100%);z-index:1}
.bleed .ov{position:absolute;inset:0;z-index:2;display:flex;align-items:flex-end}
.bleed .ov .wrap{padding-bottom:56px;width:100%}
.bleed .ov .lbl{color:rgba(255,255,255,.85);display:block;margin-bottom:16px}
.bleed .ov h3{font-family:var(--disp);font-weight:200;font-size:clamp(1.9rem,4.6vw,3.4rem);color:#fff !important;max-width:640px;line-height:1.08}
.bleed .ov .lbl{color:rgba(255,255,255,.85) !important}

/* collections / services */
.coll{padding:150px 0}
.coll .ch{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;flex-wrap:wrap;margin-bottom:70px}
.coll .ch h2{font-family:var(--disp);font-weight:300;font-size:clamp(2.2rem,5vw,3.4rem);letter-spacing:-.01em}
.clist{border-top:1px solid var(--line)}
.crow{display:grid;grid-template-columns:80px 1fr auto;gap:40px;align-items:baseline;padding:42px 0;border-bottom:1px solid var(--line);transition:padding-left .4s cubic-bezier(.2,.7,.2,1)}
.crow:hover{padding-left:22px}
.crow .n{font-family:var(--disp);font-weight:300;font-size:.78rem;letter-spacing:.16em;color:var(--mute)}
.crow .nm{font-family:var(--disp);font-weight:200;font-size:clamp(1.7rem,3.8vw,2.7rem);letter-spacing:-.005em}
.crow:hover .nm{color:var(--ink-2)}
.crow .d{color:var(--ink-2);font-size:.95rem;max-width:400px;justify-self:end;text-align:right}

/* book (reviews) */
.book{padding:160px 0;background:var(--paper-2)}
.book .wrap{max-width:980px;text-align:center}
.book .lbl{display:block;margin-bottom:44px}
.book blockquote{font-family:var(--disp);font-weight:200;font-size:clamp(1.8rem,4.4vw,3rem);line-height:1.26;letter-spacing:-.01em}
.book .by{margin-top:46px;display:flex;flex-direction:column;gap:6px;align-items:center}
.book .by .who{font-family:var(--body);font-weight:500;font-size:.68rem;letter-spacing:.2em;text-transform:uppercase}
.book .by .src{font-size:.64rem;letter-spacing:.16em;text-transform:uppercase;color:var(--mute)}
.book .scoreline{margin-top:60px;padding-top:40px;border-top:1px solid var(--line-2);display:inline-flex;align-items:center;gap:18px}
.book .scoreline .n{font-family:var(--disp);font-weight:200;font-size:2.4rem;line-height:1}
.book .scoreline .x{font-family:var(--body);font-weight:500;font-size:.66rem;letter-spacing:.18em;text-transform:uppercase;color:var(--mute);text-align:left}
.book .grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin-top:64px;text-align:left}
.book .rvw{border:1px solid var(--line-2);padding:26px 24px;background:var(--paper)}
.book .rvw .stars{font-size:.7rem;letter-spacing:.2em;color:var(--ink);margin-bottom:14px}
.book .rvw p{font-size:.92rem;color:var(--ink-2);line-height:1.6}
.book .rvw .m{margin-top:16px;font-family:var(--body);font-weight:500;font-size:.6rem;letter-spacing:.16em;text-transform:uppercase;color:var(--mute)}

/* contact */
.contact{padding:150px 0}
.contact .wrap{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:start}
.contact .ci .lbl{display:block;margin-bottom:34px}
.contact h2{font-family:var(--disp);font-weight:300;font-size:clamp(2rem,4vw,2.9rem);letter-spacing:-.01em;margin-bottom:40px}
.cinfo .row{display:grid;grid-template-columns:120px 1fr;gap:20px;padding:18px 0;border-top:1px solid var(--line);font-size:.96rem}
.cinfo .row .k{font-family:var(--body);font-weight:500;font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;color:var(--mute);padding-top:4px}
.cinfo .row .v{font-weight:400}
.contact .more{margin-top:36px}
.hours{border-top:1px solid var(--line)}
.hrow{display:flex;justify-content:space-between;padding:15px 0;border-bottom:1px solid var(--line);font-size:.94rem}
.hrow .d{font-family:var(--body);font-weight:400;letter-spacing:.02em}
.hrow .h{color:var(--mute);font-size:.86rem;font-family:var(--body)}
.hrow.today .d{font-weight:500}
.hrow.today .d::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:#3fae8b;margin-right:11px;vertical-align:middle}
.hrow.today .h{color:var(--ink)}
.hrow .closed{color:var(--mute)}
.maptile{margin-top:30px;border:1px solid var(--line);overflow:hidden;height:240px;position:relative;background:linear-gradient(120deg,#e9ece6,#f2f3ed);display:block}
.maptile .leaflet-container{height:100%;width:100%;background:#eef0ec;font-family:var(--body)}
.maptile .leaflet-control-attribution{font-size:9px;background:rgba(253,253,251,.7)}
.mbv5-pin{width:20px;height:20px;border:5px solid var(--ink);border-radius:50% 50% 50% 0;transform:rotate(-45deg);background:transparent;box-shadow:0 2px 6px rgba(0,0,0,.25)}

/* footer — menus WP restylés V5 (auto-update) */
.foot-col ul.foot-menu{list-style:none;margin:0;padding:0}
.foot-col ul.foot-menu li{margin:0}
.foot-bottom ul.foot-legal{list-style:none;display:flex;flex-wrap:wrap;gap:8px 22px;margin:0;padding:0}
.foot-bottom ul.foot-legal a{color:var(--mute);font-family:var(--body);font-size:.7rem;letter-spacing:.1em}
.foot-bottom ul.foot-legal a:hover{color:var(--ink)}

/* formulaire contact V5 */
.cform{padding:130px 0;background:var(--paper-2)}
.cform .wrap{max-width:840px}
.cform .lbl{display:block;margin-bottom:34px}
.cform h2{font-family:var(--disp);font-weight:300;font-size:clamp(2rem,4vw,2.9rem);letter-spacing:-.01em;margin-bottom:44px}
.mbv5-form .frow{display:grid;grid-template-columns:1fr 1fr;gap:34px}
.mbv5-form .fld{margin-bottom:26px}
.mbv5-form label{display:block;font-family:var(--body);font-weight:500;font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;color:var(--mute);margin-bottom:8px}
.mbv5-form input,.mbv5-form select,.mbv5-form textarea{width:100%;border:0;border-bottom:1px solid var(--line-2);background:transparent;padding:9px 0;font-family:var(--body);font-size:1rem;color:var(--ink);border-radius:0}
.mbv5-form input:focus,.mbv5-form select:focus,.mbv5-form textarea:focus{outline:none;border-bottom-color:var(--ink)}
.mbv5-form textarea{resize:vertical}
.mbv5-form .fsubmit{margin-top:30px;display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.mbv5-form button.lk{background:none;cursor:pointer}
.mbv5-form button.lk:disabled{opacity:.5;cursor:default}
.mbv5-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.mbv5-feedback{font-family:var(--body);font-size:.85rem}
.mbv5-feedback.ok{color:#3fae8b}
.mbv5-feedback.err{color:#c0392b}
@media(max-width:560px){.mbv5-form .frow{grid-template-columns:1fr;gap:0}.cform{padding:90px 0}}

/* estimate */
.estimate{padding:170px 0;text-align:center;background:var(--ink);color:var(--paper)}
.estimate .lbl{color:#8d8a82;display:block;margin-bottom:30px}
.estimate h2{font-family:var(--disp);font-weight:200;font-size:clamp(2.6rem,6vw,4.6rem);letter-spacing:-.01em;line-height:1.02;color:var(--paper) !important}
.estimate p{color:#a8a59d !important;font-size:1.05rem;max-width:480px;margin:24px auto 44px}
.estimate .lbl{color:#8d8a82 !important}

/* footer */
footer{padding:90px 0 44px;border-top:1px solid var(--line)}
.foot-top{display:grid;grid-template-columns:1.7fr 1fr 1fr 1fr;gap:48px;padding-bottom:56px;border-bottom:1px solid var(--line)}
.foot-brand .brand{margin-bottom:20px}
.foot-brand p{color:var(--ink-2);font-size:.92rem;max-width:300px}
.foot-col h4{font-family:var(--body);font-weight:500;font-size:.62rem;letter-spacing:.22em;text-transform:uppercase;color:var(--mute);margin-bottom:20px}
.foot-col a,.foot-col .ag{display:block;color:var(--ink-2);font-size:.9rem;padding:7px 0}
.foot-col a:hover{color:var(--ink)}
.foot-col .ag small{display:block;font-size:.68rem;letter-spacing:.04em;color:var(--mute);margin-top:2px}
.foot-bottom{display:flex;justify-content:space-between;flex-wrap:wrap;gap:14px;padding-top:30px;color:var(--mute);font-family:var(--body);font-weight:400;font-size:.7rem;letter-spacing:.1em}

/* mobile action bar */
.mbar{display:none}

@media(max-width:980px){
  nav.main{display:none}
  .edit .wrap{grid-template-columns:1fr;gap:40px}
  .edit.rev .wrap{direction:ltr}
  .edit .ephoto{aspect-ratio:16/11;order:-1}
  .contact .wrap{grid-template-columns:1fr;gap:54px}
  .book .grid3{grid-template-columns:1fr}
  .foot-top{grid-template-columns:1fr 1fr}
}
@media(max-width:560px){
  .wrap{padding:0 26px}
  .head-tel{display:none}
  .statement{padding:96px 0}
  .coll,.book,.contact{padding:90px 0}
  .estimate{padding:110px 0}
  .crow{grid-template-columns:44px 1fr;gap:20px}
  .crow .d{display:none}
  .hero .inner .wrap{padding-bottom:96px}
  .foot-top{grid-template-columns:1fr}
  .mbar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:60;background:rgba(253,253,251,.94);backdrop-filter:blur(12px);border-top:1px solid var(--line)}
  .mbar a{flex:1;text-align:center;padding:16px 6px;font-family:var(--body);font-weight:500;font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;border-right:1px solid var(--line)}
  .mbar a:last-child{border-right:0}
  body{padding-bottom:54px}
}