/* ————— Vectoria Patrimoine — pages dispositif (partage variables/typo avec index.html) ————— */
:root{
  --bl:8px; --lh:24px; --gutter:24px; --cols:12; --maxw:1296px; --margin:clamp(24px,5vw,72px);
  --paper:#ffffff; --ink:#111111; --grey:#6b6b6b; --line:#e4e4e4; --grey-bg:#f4f4f4;
  --accent:#7030A0; --accent-ink:#5a2585;
  --sans:'Inter','Inter Fallback',Helvetica,Arial,sans-serif;
  --ease:cubic-bezier(.22,1,.36,1);
}
*{margin:0;padding:0;box-sizing:border-box}
html,body{overflow-x:hidden}
body{background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:var(--lh);font-weight:400;-webkit-font-smoothing:antialiased}
::selection{background:var(--accent);color:#fff}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.wrap{max-width:var(--maxw);margin-inline:auto;padding-inline:var(--margin)}
.grid{display:grid;grid-template-columns:repeat(var(--cols),1fr);column-gap:var(--gutter)}
h1,h2,h3{font-weight:800;line-height:1.0;letter-spacing:-.02em}
.label{font-size:12px;line-height:var(--lh);font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--accent)}
.rule-l{height:1px;background:var(--line);border:0}

/* header */
header{position:fixed;inset:0 0 auto 0;z-index:100;background:var(--paper);border-bottom:1px solid var(--ink)}
.nav{display:flex;align-items:center;justify-content:space-between;height:72px}
.brand img{height:36px;width:auto;display:block}
nav ul{display:flex;gap:32px;list-style:none;align-items:center}
nav li{flex:none}
nav a{font-size:13px;font-weight:600;letter-spacing:.02em;white-space:nowrap;color:var(--ink);padding-bottom:2px;border-bottom:2px solid transparent;transition:border-color .3s,color .3s}
nav a:hover{border-color:var(--accent);color:var(--accent)}
.navcta{background:var(--accent);color:#fff!important;padding:10px 20px;font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;white-space:nowrap;transition:background .3s}
.navcta:hover{background:var(--accent-ink);border-color:transparent!important}
.burger{display:none;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;padding:6px}
.burger span{width:26px;height:2px;background:var(--ink);transition:.35s var(--ease)}

.btn{display:inline-flex;align-items:center;gap:8px;white-space:nowrap;font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:14px 26px;border:2px solid var(--ink);color:var(--ink);background:none;cursor:pointer;transition:background .3s,color .3s,border-color .3s}
.btn:hover{background:var(--ink);color:#fff}
.btn.solid{background:var(--accent);border-color:var(--accent);color:#fff}
.btn.solid:hover{background:var(--accent-ink);border-color:var(--accent-ink)}

section{padding-block:64px}

/* ————— dispositif hero ————— */
.disp-hero{padding-top:calc(72px + 56px);padding-bottom:40px;background:var(--grey-bg)}
.disp-hero .back{display:inline-block;margin-bottom:24px;font-size:13px;font-weight:600;color:var(--grey)}
.disp-hero .back:hover{color:var(--accent)}
.disp-hero .num{font-size:13px;font-weight:700;color:var(--accent);letter-spacing:.1em;margin-bottom:16px}
.disp-hero h1{font-size:clamp(32px,5.4vw,58px);letter-spacing:-.03em;max-width:18ch}
.disp-hero .lede{grid-column:1 / span 8;margin-top:20px;font-size:18px;line-height:28px;color:var(--grey)}

/* ————— body : article + formulaire visible ————— */
.disp-body{padding-top:56px}
.disp-grid-detail{row-gap:48px}
.disp-article{grid-column:1 / span 7}
.disp-article h2{font-size:26px;letter-spacing:-.02em;margin:40px 0 14px}
.disp-article h2:first-child{margin-top:0}
.disp-article p{font-size:16px;line-height:27px;color:var(--ink)}
.disp-article ul{margin-top:16px;padding-left:20px}
.disp-article li{font-size:15px;line-height:25px;color:var(--ink);margin-bottom:8px}
.disp-essentiel{background:var(--grey-bg);border-left:3px solid var(--accent);padding:24px 28px;margin-top:40px}
.disp-essentiel h3{font-size:13px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--accent);margin-bottom:14px}
.disp-cta-line{margin-top:32px;font-size:17px;font-weight:600;line-height:26px}
.disp-cta-line a{color:var(--accent);border-bottom:2px solid var(--accent)}
.disp-legal{margin-top:40px;padding-top:24px;border-top:1px solid var(--line);font-size:12px;line-height:19px;color:var(--grey);font-style:italic}

/* fiche chiffres */
.disp-facts{margin:0 0 8px;border-top:2px solid var(--ink)}
.disp-fact{display:grid;grid-template-columns:180px 1fr;gap:20px;padding:14px 0;border-bottom:1px solid var(--line)}
.disp-fact b{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--accent);padding-top:2px}
.disp-fact span{font-size:14px;line-height:22px;color:var(--ink)}

/* aside formulaire — visible sans clic */
.disp-form-aside{grid-column:9 / span 4}
.disp-form-card{position:sticky;top:96px;background:var(--paper);border:1px solid var(--line);border-top:4px solid var(--accent);padding:28px 26px}
.disp-form-card h3{font-size:21px;letter-spacing:-.01em;margin:6px 0 20px}
.disp-form-card form{display:flex;flex-direction:column;gap:14px}
.disp-form-card .fld{display:flex;flex-direction:column;gap:6px}
.disp-form-card label{font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--grey)}
.disp-form-card input,.disp-form-card textarea{border:0;border-bottom:2px solid var(--ink);padding:9px 0;font-family:inherit;font-size:15px;color:var(--ink);background:none;width:100%}
.disp-form-card input:focus,.disp-form-card textarea:focus{outline:none;border-color:var(--accent)}
.disp-form-card input::placeholder,.disp-form-card textarea::placeholder{color:#bbb}
.disp-form-card .consent{flex-direction:row;gap:9px;align-items:flex-start;font-size:12px;line-height:18px;color:var(--grey)}
.consent-notice{display:block!important}
.disp-form-card .consent input{width:15px;height:15px;accent-color:var(--accent);border-bottom:0;margin-top:2px}
.disp-form-card .ok{display:none;color:var(--accent);font-weight:700;font-size:14px;line-height:1.4}
.disp-form-card .ok.error{color:#c0392b}
.hp{position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important;overflow:hidden!important}
.disp-form-card .iti{display:block;width:100%;--iti-border-color:var(--line);--iti-path-flags-1x:url('https://cdn.jsdelivr.net/npm/intl-tel-input@29.2.3/dist/img/flags.webp');--iti-path-flags-2x:url('https://cdn.jsdelivr.net/npm/intl-tel-input@29.2.3/dist/img/flags@2x.webp')}
.disp-form-card .iti input.iti__tel-input{width:100%;height:41px;border:0;border-bottom:2px solid var(--ink);border-radius:0;background:transparent;font-family:inherit;font-size:15px;color:var(--ink)}
.disp-form-card .iti input.iti__tel-input:focus{outline:none;border-color:var(--accent)}
.disp-form-card .iti__selected-country{background:transparent!important;border:0;box-shadow:none}
.disp-form-card .iti__selected-dial-code{font-size:14px;color:var(--grey);text-transform:none;letter-spacing:0}
.iti__dropdown-content{z-index:1000;border:1px solid var(--line);border-radius:0;box-shadow:0 16px 40px rgba(17,17,17,.18)}
.iti__search-input{padding:10px 12px!important;border:1px solid var(--line)!important}

/* autres dispositifs */
.disp-more{margin-top:56px}
.disp-more h3{font-size:13px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--grey);margin-bottom:18px}
.disp-more-list{display:flex;flex-wrap:wrap;gap:10px 14px}
.disp-more-list a{font-size:14px;font-weight:600;padding:9px 16px;border:1px solid var(--line);color:var(--ink);border-radius:12px;transition:border-color .2s,color .2s}
.disp-more-list a:hover{border-color:var(--accent);color:var(--accent)}
.disp-body h2{font-size:26px;letter-spacing:-.02em;margin:40px 0 14px}
.disp-body h2:first-child{margin-top:0}
.faq-list{display:flex;flex-direction:column;gap:22px}
.faq-item h3{font-size:16px;font-weight:800;letter-spacing:-.01em;margin-bottom:6px}
.faq-item p{font-size:15px;line-height:24px;color:var(--ink)}
.price-disclaimer{font-size:12px;color:var(--grey);font-style:italic;margin-top:14px}

/* ————— carte du catalogue (hub /programmes/) ————— */
.map-filters{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:14px}
.map-filters .chip{font-size:12px;font-weight:600;padding:6px 12px;border-radius:100px;border:1px solid var(--line);background:var(--paper);color:var(--ink);cursor:pointer;transition:background .15s,border-color .15s,color .15s}
.map-filters .chip:hover{border-color:var(--accent)}
.map-filters .chip.on{background:var(--accent);border-color:var(--accent);color:#fff}
.idf-map{height:480px;border:1px solid var(--line);background:var(--grey-bg)}
.map-note{font-size:12px;color:var(--grey);margin-top:10px}
.idf-map .leaflet-popup-content-wrapper{border-radius:8px}
.idf-map .leaflet-popup-content{font-family:var(--sans);font-size:13px;line-height:1.5}
.idf-map .leaflet-popup-content a{color:var(--accent);font-weight:700}
@media(max-width:640px){.idf-map{height:360px}}

/* ————— tuiles programme (pages géo département/ville) ————— */
.piles{display:grid;grid-template-columns:repeat(2,1fr);gap:28px 20px}
.pile{position:relative;cursor:pointer;display:flex;flex-direction:column;background:var(--paper);border:1px solid var(--line);transition:box-shadow .25s var(--ease),border-color .25s}
.pile:hover,.pile:focus-visible{border-color:var(--ink);box-shadow:0 16px 36px -20px rgba(17,17,17,.35)}
.pile .ph{height:208px;background:var(--grey-bg) center/cover no-repeat;position:relative;overflow:hidden}
.pile .ph-fallback{height:100%;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--grey);border:1px dashed var(--line)}
.pile .ph img{width:100%;height:100%;object-fit:cover}
.pile .ph::after{content:"";position:absolute;inset:0;background:rgba(17,17,17,0);transition:background .25s}
.pile:hover .ph::after{background:rgba(17,17,17,.08)}
.pile .bd{padding:18px;display:flex;flex-direction:column;flex:1}
.pile .kicker{font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--grey);margin-bottom:6px}
.pile h3{font-size:17px;font-weight:800;letter-spacing:-.01em;line-height:1.15;margin-bottom:4px}
.pile .sub{font-size:12px;color:var(--grey);margin-bottom:12px}
.pile .meta{display:flex;justify-content:space-between;align-items:baseline;border-top:1px solid var(--line);padding-top:12px;gap:8px;margin-bottom:12px}
.pile .meta .ty{font-size:11px;color:var(--grey)}
.pile .meta .pf{display:flex;flex-direction:column;align-items:flex-end}
.pile .meta .pf small{font-size:10px;color:var(--grey);font-weight:400}
.pile .price{font-size:18px;font-weight:800;letter-spacing:-.02em;color:var(--accent);white-space:nowrap}
.pile .tags{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px}
.pile .tag{font-size:10px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--ink);border:1px solid var(--line);padding:4px 8px;white-space:nowrap}
.pile .foot{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:auto;border-top:1px solid var(--line);padding-top:14px}
.pile .foot .lots{font-size:12px;color:var(--grey)}
.pile .foot .lots b{color:var(--ink);font-size:14px}
.pile .see{font-size:12px;font-weight:700;letter-spacing:.03em;color:#fff;background:var(--ink);padding:9px 14px;text-decoration:none;white-space:nowrap;transition:background .2s}
.pile .see:hover{background:var(--accent)}
@media(max-width:560px){.piles{grid-template-columns:1fr}}
.pagination{display:flex;flex-wrap:wrap;gap:8px;margin-top:32px}
.pagination .page{display:inline-flex;align-items:center;justify-content:center;min-width:36px;height:36px;padding:0 10px;border:1px solid var(--line);font-size:13px;font-weight:600;color:var(--ink)}
.pagination a.page:hover{border-color:var(--accent);color:var(--accent)}
.pagination .page.current{background:var(--ink);color:#fff;border-color:var(--ink)}

/* footer (repris d'index.html) */
footer{background:var(--ink);color:rgba(255,255,255,.7);padding-block:64px 32px}
.foot{row-gap:40px}
.foot .c1{grid-column:1 / span 5}
.foot .c2{grid-column:7 / span 3}
.foot .c3{grid-column:10 / span 3}
.foot-logo{height:34px;width:auto;background:#fff;padding:7px 10px;display:inline-block;margin-bottom:16px}
.foot p,.foot a{color:rgba(255,255,255,.66);font-size:14px;line-height:22px}
.foot a{display:block}.foot a:hover{color:#fff}
.foot h4{color:#fff;font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;margin-bottom:16px}
.foot .acc{color:var(--accent)}.foot .acc:hover{color:#fff}
.disclaimer{border-top:1px solid rgba(255,255,255,.15);margin-top:40px;padding-top:24px;font-size:11px;line-height:18px;color:rgba(255,255,255,.4);max-width:110ch}
.copy{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;margin-top:20px;font-size:12px;color:rgba(255,255,255,.4)}

@media(max-width:900px){
  nav ul{position:fixed;inset:0 0 0 auto;width:min(82vw,340px);background:var(--paper);flex-direction:column;justify-content:center;gap:28px;padding:40px;transform:translateX(100%);transition:transform .5s var(--ease);border-left:1px solid var(--ink)}
  nav ul.open{transform:none}.burger{display:flex;z-index:110}
  .disp-hero .lede,.disp-article,.disp-form-aside,.foot .c1,.foot .c2,.foot .c3{grid-column:1 / -1}
  .disp-form-card{position:static}
  section{padding-block:40px}
  .disp-hero{padding-top:112px}
}

/* ————— design moderne (aligné avec index.html) ————— */
body{background:#faf9fc;color:#282332;font-family:Inter,'Inter Fallback',system-ui,-apple-system,sans-serif;-webkit-font-smoothing:antialiased}
#header{background:rgba(255,255,255,.95);box-shadow:0 4px 24px #30204408;border-bottom:1px solid #ece7f2!important}
.disp-hero{background:radial-gradient(ellipse at top right,#ece3f7,#faf9fc 65%)!important}
.disp-article h2,.disp-body h2{font-weight:600;letter-spacing:-.03em}
.disp-essentiel{border-radius:12px}

.btn,.navcta,.pile .see{border-radius:12px!important;text-transform:none!important;letter-spacing:.01em!important;font-weight:600!important;transition:box-shadow .2s,background-color .2s}
.btn.solid,.navcta{background:#7041a0!important;border:1px solid #7041a0!important;box-shadow:0 6px 18px #7041a022}
.btn:hover,.navcta:hover,.pile .see:hover{box-shadow:0 8px 24px #7041a025}

.pile{border-radius:20px!important;overflow:hidden;box-shadow:0 8px 30px #30204406}
.pile .tag{border-radius:100px!important;background:#f1eaf8!important;color:#60348a!important;border:0!important;padding:6px 10px!important}

.disp-form-card{background:#fff;border:1px solid #e8e1ef!important;border-top:4px solid #7041a0!important;border-radius:24px!important;box-shadow:0 16px 50px #30204408}
.disp-form-card label{text-transform:none!important;letter-spacing:0!important;font-weight:500!important;color:#62596e!important}
.disp-form-card input,.disp-form-card textarea{box-sizing:border-box;background:#fcfbfd;color:#282332;border:1px solid #dcd4e5!important;border-radius:10px!important;padding:12px 14px!important}
.disp-form-card input:focus,.disp-form-card textarea:focus{outline:2px solid #7041a0;outline-offset:2px;border-color:#dcd4e5!important}
.disp-form-card input::placeholder,.disp-form-card textarea::placeholder{color:#82778d}
.disp-form-card .iti input.iti__tel-input{border:1px solid #dcd4e5!important;border-radius:10px!important;background:#fcfbfd;padding-left:100px!important}
.disp-form-card .iti input.iti__tel-input:focus{outline:2px solid #7041a0;outline-offset:2px;border-color:#dcd4e5!important}

@media(prefers-reduced-motion:reduce){.btn,.navcta,.pile .see{transition:none}}
@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important}}
/* Pages ville : encadré « À retenir », tableau « Qui loue », appels à l'action */
.geo-key{background:var(--grey-bg);border-left:4px solid var(--accent);padding:20px 24px;margin:0 0 32px}
.geo-key .label{margin:0 0 10px}
.geo-key ul{margin:0;padding-left:20px;line-height:1.8}
.geo-table{overflow-x:auto;margin:0 0 8px}
.geo-table table{border-collapse:collapse;width:100%;font-size:15px}
.geo-table th{text-align:left;background:var(--grey-bg);padding:10px 12px}
.geo-table td{padding:10px 12px;border-bottom:1px solid var(--line);vertical-align:top}
.geo-cta{display:flex;flex-wrap:wrap;gap:12px;margin:28px 0 8px}
