:root{
   /* Aligned on Majord 01/08/2026, at Alexandre's request: arriving on luxvacation.com
      after Majord should not feel like a different company. Same ink, same warm white,
      same terracotta accent, same serif. The variable NAMES below are legacy (--gold,
      --cream) and are kept only so the 460+ pages that reference them keep working. */
   --ink:#ffffff;      /* page background */
   --ink2:#f7f3ed;     /* warm wash / cards */
   --cream:#14110e;    /* primary text, warm near-black */
   --cream2:#6c6357;   /* secondary text */
   --muted:#9a9184;    /* tertiary text */
   --line:rgba(20,17,14,.10);
   --black:#14110e;
   --gold:#a1502e; --gold2:#c4693f;      /* now the terracotta accent */
   --acc:#a1502e;--acc2:#c4693f;
   --acc-glow:#e8834f; --acc-tint:rgba(161,80,46,.10);
   --dark:#100e0c;
   --serif:'Fraunces',Georgia,serif;
   --sans:'Inter',-apple-system,Segoe UI,sans-serif;
   --r:20px; --r-lg:28px; --r-sm:12px; --r-pill:999px;
   --sh-1:0 1px 2px rgba(20,17,14,.04), 0 6px 18px rgba(20,17,14,.045);
   --sh-2:0 2px 6px rgba(20,17,14,.05), 0 18px 44px rgba(20,17,14,.09);
   --sh-3:0 30px 80px rgba(20,17,14,.20), 0 8px 24px rgba(20,17,14,.10);
   --ease:cubic-bezier(.16,1,.3,1); --ease-2:cubic-bezier(.22,.61,.36,1);
 }
 *{margin:0;padding:0;box-sizing:border-box}
 html,body{max-width:100%;overflow-x:hidden}
 body{background:var(--ink);color:var(--cream);font-family:'Inter',sans-serif;font-weight:300;line-height:1.62;font-size:16.5px;
   -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;letter-spacing:0}
 .wrap{max-width:760px;margin:0 auto;padding:0 26px}
 /* Header: hamburger LEFT, always. No top nav bar. Le Collectionist grammar. */
 header{position:fixed;top:0;left:0;right:0;z-index:80;background:rgba(255,255,255,.72);
   backdrop-filter:blur(14px);border-bottom:1px solid rgba(20,17,14,.16)}
 .hbar{max-width:1400px;margin:0 auto;padding:19px 30px;display:flex;align-items:center;gap:26px}
 .burger{background:none;border:none;cursor:pointer;padding:6px 4px;flex-shrink:0;display:block}
 .burger span{display:block;width:26px;height:1.4px;background:var(--cream);margin:6.5px 0;transition:.25s}
 .burger:hover span{background:var(--gold)}
 .brand{display:flex;align-items:baseline;gap:10px;text-decoration:none;color:var(--cream);flex-shrink:0}
 .brand .mark{align-self:center;flex-shrink:0}
 .brand .name{font-family:'Inter',sans-serif;font-weight:400;font-size:20px;letter-spacing:2.6px;
   text-indent:2.6px;text-transform:uppercase;white-space:nowrap;line-height:1;color:var(--cream)}
 .brand .ai{font-family:'Inter',sans-serif;font-weight:400;color:var(--gold);font-size:11px;letter-spacing:4.5px;
   text-indent:4.5px;text-transform:uppercase;line-height:1}
 @media(max-width:640px){.brand .name{font-size:23px;letter-spacing:3.6px}.brand .ai{font-size:9.5px;letter-spacing:3px}}
 body{padding-top:80px}
 h1{font-family:'Inter',sans-serif;font-weight:400;font-size:clamp(30px,4.4vw,44px);line-height:1.18;margin:48px 0 18px;letter-spacing:.2px}
 h1 em{color:var(--gold);font-style:italic}
 h2{font-family:'Inter',sans-serif;font-weight:400;font-size:clamp(24px,3vw,32px);margin:60px 0 18px;line-height:1.25;letter-spacing:.4px}
 p{margin-bottom:18px;color:var(--cream2)}
 .kicker{color:var(--gold);font-size:11px;letter-spacing:4px;text-indent:4px;text-transform:uppercase;margin-top:48px;font-weight:400}
 .lead{font-size:19px;font-weight:300;line-height:1.58;color:var(--cream2);margin-bottom:34px}
 .rgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:26px 0 30px}
 @media(max-width:640px){.rgrid{grid-template-columns:1fr}}
 .rbox{background:var(--ink2);border:1px solid rgba(20,17,14,.20);border-radius:2px;padding:26px 18px;text-align:center}
 .rbox .v{font-family:'Inter',sans-serif;font-weight:500;font-size:26px;color:var(--acc);letter-spacing:-.3px;font-variant-numeric:tabular-nums}
 .rbox .l{font-size:10px;letter-spacing:2.2px;text-indent:2.2px;text-transform:uppercase;color:var(--muted);margin-top:8px}
 .cta{background:var(--ink2);border:1px solid rgba(20,17,14,.24);border-radius:2px;padding:52px 38px;margin:64px 0;text-align:center}
 .cta h3{font-family:'Inter',sans-serif;font-weight:400;font-size:32px;margin-bottom:14px;line-height:1.25}
 .cta h3 em{color:var(--gold);font-style:italic}
 .cta p{color:var(--muted);font-size:16px;font-weight:300;margin-bottom:30px;max-width:440px;margin-left:auto;margin-right:auto}
 .btn{display:inline-block;background:var(--cream);color:var(--ink2);border:1px solid var(--cream);
   text-decoration:none;border-radius:2px;padding:17px 40px;font-size:12px;letter-spacing:2.6px;text-indent:2.6px;
   text-transform:uppercase;font-weight:400;transition:.25s}
 .btn:hover{background:var(--gold);border-color:var(--gold);color:var(--ink2)}
 .note{background:rgba(20,17,14,.7);border-left:2px solid var(--gold);padding:26px 28px;border-radius:0;margin:30px 0;font-size:17px}
 .note b{color:var(--gold)}
 .warn{background:rgba(180,90,60,.06);border-left:2px solid #b45a3c;padding:26px 28px;border-radius:0;margin:30px 0;font-size:17px}
 .trust{font-size:13.5px;color:var(--muted);border-top:1px solid rgba(20,17,14,.08);padding-top:14px;margin-top:6px}
 .trust.ok{color:#4a7360}
 /* ---- editorial page components (what-we-do, who-we-are, compare). Monochrome by law:
    colour comes only from the hero photograph and from --acc on the figures. ---- */
 .shero{position:relative;margin:26px 0 4px;border-radius:2px;overflow:hidden;aspect-ratio:16/7;background:var(--ink2)}
 .shero img{width:100%;height:100%;object-fit:cover;display:block}
 .shero .cap{position:absolute;left:0;right:0;bottom:0;padding:34px 22px 15px;font-size:10.5px;
   letter-spacing:2.4px;text-indent:2.4px;text-transform:uppercase;color:#fff;
   background:linear-gradient(to top,rgba(0,0,0,.46),transparent)}
 @media(max-width:640px){.shero{aspect-ratio:3/2}}
 .steps{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:28px 0 36px}
 @media(max-width:700px){.steps{grid-template-columns:1fr}}
 .step{background:var(--ink2);border:1px solid var(--line);border-top:3px solid var(--acc);border-radius:2px;padding:24px 22px}
 .step .n{font-family:'Inter',sans-serif;font-weight:600;font-size:12px;color:var(--acc);letter-spacing:1.4px}
 .step .st{font-weight:500;font-size:16px;margin:9px 0 7px;color:var(--cream);letter-spacing:.2px}
 .step p{font-size:14px;color:var(--muted);margin:0;line-height:1.5}
 .pull{font-family:'Inter',sans-serif;font-weight:400;font-size:clamp(20px,2.5vw,26px);line-height:1.36;
   color:var(--cream);border-left:3px solid var(--acc);padding:4px 0 4px 24px;margin:36px 0;letter-spacing:.2px}
 .split{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:28px 0}
 @media(max-width:700px){.split{grid-template-columns:1fr}}
 .split .col{border:1px solid var(--line);border-radius:2px;padding:22px 24px}
 .split .col.bad{background:var(--ink2)}
 .split .col.good{background:#fff;border-color:var(--acc)}
 .split .col h4{font-size:10.5px;letter-spacing:2px;text-indent:2px;text-transform:uppercase;color:var(--muted);font-weight:600;margin-bottom:12px}
 .split .col.good h4{color:var(--acc)}
 .split .col p{font-size:14.5px;margin:0;color:var(--cream2);line-height:1.55}
 .fcard{background:var(--ink2);border:1px solid var(--line);border-radius:2px;padding:30px 34px;margin:32px 0}
 .fcard h2{margin-top:0}
 @media(max-width:640px){.fcard{padding:24px 22px}}
 .dl{list-style:none}
 .dl li{padding:13px 0;border-bottom:1px solid rgba(20,17,14,.08);display:flex;justify-content:space-between;align-items:baseline;gap:14px;flex-wrap:wrap}
 .dl li:last-child{border-bottom:none}
 .dl a{color:var(--cream);text-decoration:none;font-family:'Inter',sans-serif;font-weight:400;font-size:24px}
 .dl a:hover{color:var(--gold)}
 .dl .c{color:var(--muted);font-size:13px;white-space:nowrap}
 /* World map. The land path is fetched once from a CDN and drawn client-side, so the page
    weighs nothing. The destination list below stays in the HTML, so Google and the AI crawlers
    still see every market even with JavaScript off. */
 .mapwrap{position:relative;margin:34px 0 14px}
 #wmap{height:520px;width:100%;border:1px solid var(--line);border-radius:2px;background:#faf8f5;z-index:1}
 @media(max-width:720px){#wmap{height:400px}}
 .mapfoot{margin-top:12px;font-size:13.5px;color:var(--muted);line-height:1.5}

 /* Leaflet positions every tile absolutely and sizes it in JS. Our global img{max-width:100%}
    overrode that and the tiles spilled out of the container in a staircase. One line. */
 .leaflet-container img,
 .leaflet-container svg{max-width:none!important;max-height:none!important}
 .leaflet-pane,.leaflet-tile,.leaflet-marker-icon,.leaflet-tile-container{box-sizing:content-box}

 /* Pins. A coloured dot, and the NAME beside it. The old map had dots and nothing else, so it
    told an owner nothing at all. The name is the point. */
 .lvpin{background:none;border:none;white-space:nowrap;display:flex;align-items:center;gap:6px;
   transform:translate(-7px,-7px);cursor:pointer}
 .lvdot{width:11px;height:11px;border-radius:50%;border:2px solid #fff;flex-shrink:0;
   box-shadow:0 0 0 1px rgba(0,0,0,.18)}
 .lvlab{font-family:'Inter',sans-serif;font-size:11.5px;font-weight:500;color:var(--black);
   letter-spacing:.1px;text-shadow:0 0 3px #fff,0 0 3px #fff,0 0 3px #fff,0 0 6px #fff}
 .lvpin:hover .lvdot{transform:scale(1.3)}
 .lvpin:hover .lvlab{color:var(--gold)}
 .lvlab{display:none}
 .zoomed .lvlab{display:inline}   /* names appear as you zoom in. See the JS. */

 .leaflet-popup-content-wrapper{border-radius:2px;box-shadow:0 4px 22px rgba(0,0,0,.14);padding:0}
 .leaflet-popup-content{margin:0;width:auto!important}
 .lvpop{padding:15px 17px;font-family:'Inter',sans-serif}
 .lvpn{font-size:16px;font-weight:500;color:var(--black);margin-bottom:6px}
 .lvpv{font-size:17px;font-weight:600;color:var(--black);letter-spacing:-.2px;font-variant-numeric:tabular-nums}
 .lvps{font-size:11px;letter-spacing:1.6px;text-transform:uppercase;color:var(--muted);margin-top:3px}
 .lvpa{display:inline-block;margin-top:11px;font-size:12px;font-weight:500;letter-spacing:.6px;
   text-transform:uppercase;color:var(--black);text-decoration:none;border-bottom:1px solid var(--black);padding-bottom:2px}
 .lvpa:hover{color:var(--gold);border-color:var(--gold)}
 .leaflet-container a.leaflet-popup-close-button{display:none}
 .leaflet-control-attribution{font-size:10px;background:rgba(255,255,255,.8)}
 .lvzoom button{font-family:'Inter',sans-serif;font-size:11px;font-weight:500;letter-spacing:.6px;
   text-transform:uppercase;background:#fff;color:var(--black);border:1px solid rgba(0,0,0,.2);
   border-radius:2px;padding:7px 12px;cursor:pointer;box-shadow:0 1px 4px rgba(0,0,0,.12)}
 .lvzoom button:hover{background:var(--black);color:#fff;border-color:var(--black)}
 .lvtip{background:var(--black);color:#fff;border:none;border-radius:2px;padding:5px 9px;
   font-family:'Inter',sans-serif;font-size:12px;font-weight:400;box-shadow:none;white-space:nowrap}
 .lvtip:before{border-top-color:var(--black)!important}
 .mk:hover{fill:var(--cream)}
 .mlab{font-family:'Inter',sans-serif;font-size:9px;fill:var(--cream2);pointer-events:none;opacity:0;transition:.15s}
 /* Instant filter. On a phone, 39 cards is a lot of thumb. Let the owner type two letters. */
 .dfilter{position:relative;margin:26px 0 6px}
 .dfilter input{width:100%;padding:18px 18px 18px 46px;font-family:'Inter',sans-serif;font-weight:300;
   font-size:17px;color:var(--black);background:var(--ink2);border:1px solid rgba(20,17,14,.16);border-radius:2px}
 .dfilter input:focus{outline:none;border-color:var(--gold)}
 .dfilter:before{content:'';position:absolute;left:17px;top:50%;width:15px;height:15px;margin-top:-9px;
   border:1.6px solid var(--muted);border-radius:50%}
 .dfilter:after{content:'';position:absolute;left:29px;top:50%;width:7px;height:1.6px;margin-top:3px;
   background:var(--muted);transform:rotate(45deg)}
 .rgn.hide{display:none}
 .card.hide{display:none}

 /* Region blocks with photographs. A flat list of 39 links was not good enough. */
 .rgn{margin:54px 0 0}
 .rgn h2{margin:0 0 6px}
 .rgn .sub{color:var(--muted);font-size:14px;margin-bottom:22px}
 .cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
 @media(max-width:900px){.cards{grid-template-columns:repeat(2,1fr)}}
 @media(max-width:560px){.cards{grid-template-columns:1fr}}
 .card{position:relative;display:block;text-decoration:none;overflow:hidden;border-radius:2px;
   background:var(--ink2);border:1px solid rgba(20,17,14,.18)}
 .card .ph{position:relative;aspect-ratio:3/2;overflow:hidden;background:#efe8de}
 .card .ph img{width:100%;height:100%;object-fit:cover;object-position:center 52%;transition:transform .6s ease}
 .card:hover .ph img{transform:scale(1.045)}
 .card .noph{width:100%;height:100%;display:flex;align-items:center;justify-content:center;
   font-family:'Inter',sans-serif;font-size:34px;color:rgba(20,17,14,.45)}
 .card .cb{padding:15px 16px 17px}
 .card .cn{font-family:'Inter',sans-serif;font-weight:400;font-size:23px;color:var(--cream);line-height:1.2}
 .card .cc{font-size:11px;color:var(--muted);margin-top:3px;letter-spacing:1.4px;text-transform:uppercase}
 .card .cv{font-size:12.5px;color:var(--cream2);margin-top:8px;letter-spacing:.3px}
 .card .cflag{position:absolute;top:10px;left:10px;background:rgba(20,17,14,.72);color:rgba(255,255,255,.86);
   font-size:9px;letter-spacing:1.6px;text-transform:uppercase;padding:4px 8px;border-radius:2px}
 /* COMPARISON HERO. Rebuilt 15/07/2026. Alexandre: the comparison pages "read like a newspaper.
    Too much text, no images, no icons." He is right. So the page now OPENS with the two markets
    face to face, as photographs, each carrying its own income, and the verdict in one big line.
    The prose that was a wall of h2 blocks is folded into accordions, exactly like the destination
    pages. Google still reads every word; the visitor is not made to wade through it. */
 .vs{display:grid;grid-template-columns:1fr 1fr;gap:0;margin:30px 0 0;border:1px solid var(--line);border-radius:2px;overflow:hidden;position:relative}
 .vspanel{position:relative;height:300px;overflow:hidden;display:block;text-decoration:none}
 .vspanel img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
 .vspanel::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,20,20,.15) 0%,rgba(20,20,20,.05) 40%,rgba(20,20,20,.82) 100%)}
 .vspanel .vin{position:absolute;inset:auto 0 0 0;z-index:2;padding:22px 22px 20px;color:#fff}
 .vspanel .vn{font-size:20px;font-weight:500;letter-spacing:.2px;margin-bottom:6px;text-shadow:0 1px 12px rgba(0,0,0,.4)}
 .vspanel .vv{font-size:24px;font-weight:600;letter-spacing:-.4px;font-variant-numeric:tabular-nums;text-shadow:0 1px 12px rgba(0,0,0,.5)}
 .vspanel .vl{font-size:10px;letter-spacing:1.6px;text-transform:uppercase;opacity:.8;margin-top:3px}
 .vspanel.hi .vin{border-bottom:3px solid #fff}
 .vspanel .vtag{position:absolute;top:14px;left:14px;z-index:2;background:#fff;color:var(--black);font-size:10px;font-weight:500;letter-spacing:1.4px;text-transform:uppercase;padding:5px 10px;border-radius:2px}
 .vsmid{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:3;width:44px;height:44px;border-radius:50%;background:#fff;color:var(--black);display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:600;letter-spacing:.5px;box-shadow:0 2px 14px rgba(0,0,0,.25)}
 @media(max-width:600px){.vspanel{height:230px}.vspanel .vv{font-size:21px}.vsmid{width:38px;height:38px;font-size:11px}}
 .vsverdict{margin:26px 0 8px;text-align:center}
 .vsverdict .big{font-size:clamp(24px,4vw,34px);font-weight:500;line-height:1.2;color:var(--black);letter-spacing:-.3px}
 .vsverdict .big b{color:var(--acc);font-weight:600}
 .vsverdict .sub{font-size:15px;color:var(--muted);margin-top:12px;line-height:1.5;max-width:560px;margin-left:auto;margin-right:auto}

 .cut{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:26px 0 22px}
 @media(max-width:640px){.cut{grid-template-columns:1fr}}
 .cbox{background:var(--ink2);border:1px solid rgba(20,17,14,.20);border-radius:2px;padding:24px 16px;text-align:center}
 .cbox.bad{border-color:rgba(180,90,60,.42);background:rgba(180,90,60,.05)}
 .cbox .v{font-family:'Inter',sans-serif;font-weight:400;font-size:27px;color:var(--gold);letter-spacing:.3px}
 .cbox.bad .v{color:#b45a3c}
 .cbox .l{font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--muted);margin-top:8px;line-height:1.5}
 .cbox .ci{width:26px;height:26px;color:var(--acc);margin:0 auto 12px;display:block}
 .cbox.bad .ci{color:#b45a3c}
 .lad{width:100%;border-collapse:collapse;margin:24px 0 18px;font-size:15px}
 .lad th{background:var(--cream);color:var(--ink2);font-weight:400;font-size:10px;letter-spacing:1.6px;
   text-transform:uppercase;padding:11px 8px;text-align:right}
 .lad th:first-child{text-align:left}
 .lad td{padding:11px 8px;border-bottom:1px solid rgba(20,17,14,.08);text-align:right}
 .lad td:first-child{text-align:left;color:var(--cream)}
 .lad tr.sec td{background:rgba(20,17,14,.7);font-family:'Inter',sans-serif;font-size:19px;
   color:var(--gold);letter-spacing:.4px;padding:12px 8px}
 .lad tr:hover td{background:rgba(20,17,14,.5)}
 .lad .g{color:var(--gold)}
 @media(max-width:640px){.lad{font-size:13px}.lad th,.lad td{padding:9px 4px}.lad th{font-size:8.5px;letter-spacing:.8px}}
 .faq{margin-top:8px}
 .faq .q{font-family:'Inter',sans-serif;font-weight:500;font-size:23px;color:var(--cream);
   margin:34px 0 10px;line-height:1.3}
 .faq .a{color:var(--cream2);margin-bottom:0}
 .crumb{font-size:11px;letter-spacing:1.6px;text-transform:uppercase;color:var(--muted);margin:26px 0 0}
 .crumb a{color:var(--muted);text-decoration:none}
 .crumb a:hover{color:var(--gold)}
 .crumb span{margin:0 7px;color:rgba(110,104,88,.5)}
 .disc{font-size:12.5px;color:var(--muted);margin:40px 0 20px}

 /* Comparison table. Added 14/07/2026. Squared corners, no zebra stripes, no chrome.
    The table IS the content on these pages, so it gets to be quiet and legible. */
 .cmp{width:100%;border-collapse:collapse;margin:30px 0 12px;font-size:15px}
 .cmp th,.cmp td{padding:14px 12px;border-bottom:1px solid rgba(20,17,14,.09);text-align:right}
 .cmp th:first-child,.cmp td:first-child{text-align:left;color:var(--muted);font-weight:400;
   font-size:13px;letter-spacing:.3px}
 .cmp thead th{font-family:'Inter',sans-serif;font-weight:400;font-size:23px;color:var(--cream);
   border-bottom:1px solid rgba(20,17,14,.4)}
 .cmp thead th a{color:var(--cream);text-decoration:none}
 .cmp thead th a:hover{color:var(--gold)}
 .cmp tbody tr.key td{color:var(--gold);font-size:17px}
 .cmp tbody tr.key td:first-child{color:var(--muted);font-size:13px}
 .cmp tbody tr.neg td:not(:first-child){color:#b45a3c}
 .cmp td.win{position:relative}
 .cmp td.win:after{content:'';position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--gold);opacity:.55}
 @media(max-width:640px){.cmp{font-size:13.5px}.cmp th,.cmp td{padding:11px 6px}
   .cmp thead th{font-size:19px}.cmp th:first-child,.cmp td:first-child{font-size:11.5px}}
 .cmpwrap{overflow-x:auto}
 .footdest{max-width:1120px;margin:70px auto 0;padding:34px 26px 0;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;gap:8px 18px;justify-content:center}
 .footdest a{color:var(--muted);text-decoration:none;font-size:12.5px;letter-spacing:.2px}
 .footdest a:hover{color:var(--cream)}
 footer{text-align:center;padding:44px 0 70px;color:var(--muted);font-size:11px;letter-spacing:2.4px;text-transform:uppercase;border-top:1px solid rgba(20,17,14,.13);margin-top:34px}
 footer a{color:inherit}
 @media(max-width:720px){.wrap{padding-left:22px;padding-right:22px}}

 /* THE ANSWER, FIRST. Alexandre, 14/07/2026: "les gens ne lisent plus". He is right, and the
    competitors prove it: Le Collectionist puts a photo and a search box above the fold and nothing
    else. Meilleurtaux puts ONE number in colour and a row of buttons. So the destination page now
    opens with the figure the owner came for, at 56px, in the region colour, and the prose waits. */
 .answer{margin:34px 0 8px;text-align:center}
 .answer .al{font-size:11px;letter-spacing:3.4px;text-transform:uppercase;color:var(--muted);margin-bottom:12px}
 .answer .av{font-family:'Inter',sans-serif;font-weight:500;font-size:clamp(34px,9vw,54px);
   line-height:1.06;color:var(--acc);letter-spacing:-.8px;font-variant-numeric:tabular-nums}
 .answer .as{font-size:15px;color:var(--muted);margin-top:10px}
 .answer .ab{display:inline-block;margin-top:24px;background:var(--black);color:#fff;text-decoration:none;
   padding:17px 38px;font-size:13px;font-weight:400;letter-spacing:1.4px;text-transform:uppercase;border-radius:2px}
 .answer .ab:hover{background:#000}

 /* Long prose folds away. It is still in the HTML, so Google reads every word of it, but the owner
    is not made to wade through 900 words to reach a button. */
 .fold{border-top:1px solid var(--line);margin-top:0}
 .fold summary{cursor:pointer;list-style:none;padding:20px 2px;font-family:'Inter',sans-serif;
   font-size:17px;font-weight:400;color:var(--black);display:flex;align-items:center;justify-content:space-between;gap:16px}
 .fold summary::-webkit-details-marker{display:none}
 .fold summary:after{content:'+';color:var(--acc);font-size:22px;font-weight:300;flex-shrink:0}
 .fold[open] summary:after{content:'-'}
 .fold[open] summary{color:var(--acc)}
 .fold .fc{padding-bottom:14px}
 .fold .fc p{margin-bottom:16px}
 b,strong{font-weight:500;color:var(--black)}

 /* ACCENT. Every page sets --acc from its region. These rules simply consume it. */
 .kicker{color:var(--acc)}
 h1 em,h2 em{color:var(--acc)}
 .rbox{background:var(--ink2);border:1px solid color-mix(in srgb,var(--acc) 26%,transparent);
   box-shadow:0 1px 0 color-mix(in srgb,var(--acc) 12%,transparent)}
 .rbox .v{color:var(--acc)}
 .note{background:color-mix(in srgb,var(--acc) 6%,transparent);border-left:3px solid var(--acc)}
 .note b{color:var(--acc)}
 .cta{background:linear-gradient(165deg,var(--ink2) 0%,color-mix(in srgb,var(--acc) 7%,var(--ink2)) 100%);
   border:1px solid color-mix(in srgb,var(--acc) 22%,transparent)}
 .cta h3 em{color:var(--acc)}
 .btn:hover{background:var(--acc);border-color:var(--acc);color:#ffffff}
 .lad thead th{background:color-mix(in srgb,var(--acc) 10%,transparent);color:var(--acc)}
 .lad tbody tr:hover{background:color-mix(in srgb,var(--acc) 5%,transparent)}
 .lad .lmore{font-size:13px;color:var(--muted);line-height:1.5;padding-top:14px;background:none!important}
 a{color:var(--acc)}
 .sticky{background:var(--acc)!important;border-color:var(--acc)!important}
 .sticky a,.sticky .sbtn{color:#ffffff!important}

 /* full-bleed hero. Mobile first: Alexandre says 95% of owners arrive on a phone, and he wants
    the first screen to feel like a reel, not a document. So the hero is TALL on mobile, not short. */
 .hero{position:relative;height:min(70vh,640px);min-height:380px;overflow:hidden;background:#202020;margin-top:-80px;padding-top:80px}
 .hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 55%;
   transform:scale(1.03);transition:transform 12s ease-out}
 .hero:hover img{transform:scale(1.09)}
 .hero::after{content:"";position:absolute;inset:0;
   background:linear-gradient(180deg,rgba(20,17,14,.34) 0%,rgba(20,17,14,.04) 34%,rgba(20,17,14,.30) 62%,rgba(20,17,14,.88) 100%)}
 /* a whisper of the region colour laid over the photograph, so the page and the place agree */
 .hero::before{content:"";position:absolute;inset:0;z-index:1;mix-blend-mode:soft-light;opacity:.5;
   background:linear-gradient(200deg,var(--acc2) 0%,transparent 55%)}
 .hero .hin{position:absolute;inset:auto 0 0 0;z-index:2;padding:0 24px 46px;max-width:1080px;margin:0 auto;left:0;right:0}
 .hero .hk{color:rgba(255,255,255,.82);font-size:11px;letter-spacing:4px;text-indent:4px;text-transform:uppercase;margin-bottom:16px;font-weight:400}
 .hero h1{color:#fff;margin:0;font-weight:400;font-size:clamp(36px,5.4vw,58px);line-height:1.12;text-shadow:0 2px 40px rgba(0,0,0,.45)}
 .hero h1 em{color:#fff;font-weight:500}
 .haslead{margin-top:46px}
 @media(max-width:720px){
   .hero{height:64vh;min-height:400px}
   .hero .hin{padding:0 22px 36px}
   .hero h1{font-size:clamp(32px,8.4vw,42px)}
 }

 /* Full-screen menu behind the hamburger. Everything lives here. */
 .mmenu{display:none;position:fixed;inset:0;background:var(--ink2);z-index:200;flex-direction:column;
   padding:96px 40px 40px}
 .mmenu.open{display:flex;animation:mfade .3s ease}
 @keyframes mfade{from{opacity:0}to{opacity:1}}
 .mmenu a.ml{color:var(--cream);text-decoration:none;font-family:'Inter',sans-serif;
   font-size:clamp(30px,4.4vw,44px);font-weight:400;padding:22px 0;
   border-bottom:1px solid rgba(20,17,14,.07);max-width:660px;transition:.22s}
 .mmenu a.ml:hover{color:var(--gold);padding-left:12px}
 .mclose{position:absolute;top:28px;right:34px;font-size:32px;line-height:1;background:none;border:none;
   color:var(--cream);cursor:pointer}
 .mclose:hover{color:var(--gold)}
 .mfoot{margin-top:auto;padding-top:30px;border-top:1px solid rgba(20,17,14,.08);max-width:640px}
 .mfoot .lbl{font-size:11px;letter-spacing:2.4px;text-transform:uppercase;color:var(--muted);margin-bottom:14px}
 .mfoot a{display:inline-block;color:var(--cream2);text-decoration:none;font-size:16px;margin:0 20px 10px 0;
   border-bottom:1px solid transparent}
 .mfoot a:hover,.mfoot a.on{color:var(--gold);border-bottom-color:var(--gold)}

 /* Language, bottom-left, behind a globe. Discreet until you want it. */
 .langbar{position:fixed;left:20px;bottom:20px;z-index:90}
 .globe{width:44px;height:44px;border-radius:50%;background:rgba(255,254,250,.95);backdrop-filter:blur(10px);
   border:1px solid rgba(20,17,14,.3);cursor:pointer;display:flex;align-items:center;justify-content:center;
   box-shadow:0 6px 24px rgba(20,17,14,.14);transition:.2s;padding:0}
 .globe:hover{border-color:var(--gold);transform:translateY(-2px)}
 .globe svg{width:21px;height:21px;stroke:var(--cream2);fill:none;stroke-width:1.4}
 .globe:hover svg{stroke:var(--gold)}
 .lpop{display:none;position:absolute;left:0;bottom:calc(100% + 10px);background:var(--ink2);
   border:1px solid rgba(20,17,14,.3);border-radius:12px;overflow:hidden;min-width:172px;
   box-shadow:0 18px 50px rgba(20,17,14,.18)}
 .lpop.open{display:block}
 .lpop .lh{font-size:10px;letter-spacing:2.2px;text-transform:uppercase;color:var(--muted);
   padding:13px 18px 8px;border-bottom:1px solid rgba(20,17,14,.06)}
 .lpop a{display:block;padding:11px 18px;color:var(--cream2);text-decoration:none;font-size:15px}
 .lpop a:hover{background:rgba(20,17,14,.13);color:var(--gold)}
 .lpop a.on{color:var(--gold);font-weight:500}

 /* =====================================================================
    MOBILE. Rebuilt 14/07/2026 after Alexandre's verdict: "I do not want to
    read this on a phone." He is right. A luxury audience is not an old
    audience. They scroll. So: bigger pictures, bigger numbers, less prose
    above the fold, a thumb-reachable call to action that never leaves.
    ===================================================================== */
 @media(max-width:720px){
   body{font-size:17px;line-height:1.72;padding-top:64px;padding-bottom:76px}
   .wrap{padding-left:20px;padding-right:20px}

   /* Header: shorter, and the hamburger is a real 44px touch target. */
   .hbar{padding:13px 16px;gap:12px}
   .burger{padding:10px 8px;margin-left:-8px}
   .burger span{width:24px;margin:5.5px 0}
   .brand .mark{width:34px;height:34px}
   .brand .name{font-size:21px;letter-spacing:3px;text-indent:3px}
   .brand .ai{font-size:9px;letter-spacing:2.4px;text-indent:2.4px}

   /* Hero: tall, like a story. Photograph first, words second. */
   .hero{height:66vh;min-height:420px;margin-top:-64px;padding-top:64px}
   .hero::after{background:linear-gradient(180deg,rgba(20,17,14,.34) 0%,rgba(20,17,14,.06) 30%,rgba(20,17,14,.86) 100%)}
   .hero .hin{padding:0 20px 34px}
   .hero .hk{font-size:10px;letter-spacing:3px}
   h1{font-size:34px;line-height:1.14;margin:34px 0 16px}
   .hero h1{font-size:36px}
   h2{font-size:27px;margin:46px 0 14px}
   .lead{font-size:19px;line-height:1.62;margin-bottom:28px}
   p{margin-bottom:18px}

   /* THE NUMBERS. These were stacking into a column three screens long.
      Three across, big and gold. This is what the visitor came for. */
   .rgrid,.cut{grid-template-columns:repeat(3,1fr);gap:7px;margin:22px 0}
   .rbox,.cbox{padding:15px 5px;border-radius:2px}
   .rbox .v,.cbox .v{font-size:19px;letter-spacing:-.2px}
   .rbox .l,.cbox .l{font-size:8.5px;letter-spacing:.8px;margin-top:6px;line-height:1.35}

   .note,.warn{padding:20px 18px;font-size:16px;border-left-width:3px}
   .trust{font-size:12px}

   /* Cards: full-bleed photograph, big name. Scrollable, like a feed. */
   .cards{gap:14px}
   .card .ph{aspect-ratio:16/10}
   .card .cn{font-size:24px}
   .card .cv{font-size:13px}
   .rgn{margin-top:40px}
   .rgn h2{font-size:26px}

   /* Map: taller viewport slice so the pins are actually tappable. */

   .faq .q{font-size:21px;margin:26px 0 8px}
   .faq .a{font-size:16px}
   .crumb{font-size:10px;letter-spacing:1.2px}

   .cta{padding:36px 22px;margin:48px 0}
   .cta h3{font-size:27px}
   .cta p{font-size:15px}
   .btn{padding:16px 30px;font-size:11.5px;letter-spacing:2px}

   .dl a{font-size:20px}
   .dl li{padding:15px 0}
   .dl .c{font-size:12px}

   footer{padding:34px 0 30px;font-size:10px;letter-spacing:1.6px}

   /* The floating language globe was sitting on top of the text and on top of the
      sticky bar. It is redundant on a phone: the language list is already inside the
      hamburger menu. So it goes. */
   .langbar{display:none}
 }

 /* Sticky call to action. On a phone the estimator is three screens away,
    and nobody scrolls back up. Now it is always one thumb away. */
 .sticky{display:none}
 @media(max-width:720px){
   .sticky{display:block;position:fixed;left:0;right:0;bottom:0;z-index:70;
     background:rgba(255,255,255,.86);backdrop-filter:blur(12px);
     border-top:1px solid rgba(20,17,14,.22);padding:10px 14px 12px}
   .sticky a{display:block;text-align:center;background:var(--cream);color:var(--ink2);
     text-decoration:none;border-radius:2px;padding:15px 10px;font-size:12px;
     letter-spacing:2.4px;text-transform:uppercase;font-weight:400}
 }
 @media(max-width:380px){
   .rbox .v,.cbox .v{font-size:16.5px}
   .rbox .l,.cbox .l{font-size:8px}
   h1,.hero h1{font-size:31px}
 }
 /* Blog / Journal, added 15/07/2026. Same restraint: photograph, figures, air. */
 .bhero{width:100%;height:auto;border-radius:2px;margin:8px 0 30px;display:block}
 .blist{display:grid;grid-template-columns:1fr;gap:2px;margin:30px 0 10px}
 .bcard{display:grid;grid-template-columns:200px 1fr;gap:0;text-decoration:none;color:inherit;
   border:1px solid var(--line);border-radius:2px;overflow:hidden;transition:border-color .2s}
 .bcard:hover{border-color:var(--cream)}
 .bcard .bimg{overflow:hidden}
 .bcard .bimg img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s}
 .bcard:hover .bimg img{transform:scale(1.04)}
 .bcard .bbody{padding:26px 28px}
 .bkick{color:var(--acc);font-size:10px;letter-spacing:2.4px;text-transform:uppercase;margin-bottom:12px}
 .bcard h2{font-size:21px;font-weight:400;line-height:1.28;margin:0 0 10px}
 .bcard p{font-size:14.5px;color:var(--cream2);line-height:1.5;margin:0 0 14px}
 .bread{font-size:12px;letter-spacing:1.6px;text-transform:uppercase;color:var(--acc);font-weight:500}
 @media(max-width:640px){
   .bcard{grid-template-columns:1fr}
   .bcard .bimg{height:190px}
   .bcard .bbody{padding:22px 22px}
   .bcard h2{font-size:19px}
 }

/* ============================================================================
   MAJORD ALIGNMENT LAYER, added 01/08/2026.
   Everything above is the original main-site stylesheet. This block sits last so it
   wins on the cascade, and brings luxvacation.com onto the same design language as
   Majord: same fonts, same type scale, same pill buttons, same card surfaces and
   radii, same translucent header, same scroll-reveal motion.
   No class names are invented here: every selector already exists in the pages.
   ========================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,400;0,9..144,500;0,9..144,600;0,9..144,700;1,9..144,400;1,9..144,600&family=Inter:wght@300;400;500;600;700&display=swap');

html{scroll-behavior:smooth;overflow-x:clip;}
body{overflow-x:clip;font-family:var(--sans);font-weight:400;font-size:16.5px;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}
@supports not (overflow-x:clip){html,body{overflow-x:hidden;}}

/* ---- Type: Fraunces for display, Inter for everything functional ---- */
h1,h2,h3,.serif,.q,.cta h3,.vsverdict .big,.answer .av,.faq .q,.bcard h2,.card .cn,.dl a,
.cmp thead th,.rbox .v,.cbox .v,.lad tr.sec td,.mmenu a.ml{
  font-family:var(--serif);letter-spacing:-.022em;}
h1{font-weight:600;font-size:clamp(34px,4.6vw,58px);line-height:1.06;letter-spacing:-.03em;
  color:var(--cream);text-wrap:balance;}
h2{font-weight:600;font-size:clamp(27px,3.4vw,42px);line-height:1.12;letter-spacing:-.026em;
  margin:clamp(48px,6vw,74px) 0 18px;color:var(--cream);}
h1 em,h2 em{color:var(--acc);font-style:italic;font-weight:600;}
p{color:var(--cream2);}
.lead{font-size:clamp(17px,1.5vw,20px);font-weight:400;line-height:1.56;color:var(--cream2);}
.kicker{color:var(--acc);font-size:12.5px;letter-spacing:.13em;text-indent:0;font-weight:600;text-transform:uppercase;}
b,strong{font-weight:600;color:var(--cream);}
::selection{background:var(--acc);color:#fff;}

/* ---- Header: translucent white with blur, like Majord. Was cream. ---- */
header{background:rgba(255,255,255,.72);backdrop-filter:saturate(180%) blur(20px);
  -webkit-backdrop-filter:saturate(180%) blur(20px);border-bottom:1px solid transparent;
  transition:background .3s var(--ease-2),border-color .3s var(--ease-2);}
header.scrolled{background:rgba(255,255,255,.88);border-bottom-color:var(--line);}
.brand .name{font-family:var(--serif);font-weight:600;font-size:21px;letter-spacing:-.01em;
  text-indent:0;text-transform:none;color:var(--cream);}
.brand .ai{font-family:var(--sans);font-weight:600;font-size:10px;letter-spacing:.22em;color:var(--acc);}
.burger span{background:var(--cream);height:1.6px;}
.burger:hover span{background:var(--acc);}

/* ---- Buttons: pills with a lift, like Majord ---- */
.btn,.answer .ab,.sticky a{border-radius:var(--r-pill);font-family:var(--sans);
  font-size:14.5px;font-weight:600;letter-spacing:0;text-indent:0;text-transform:none;
  padding:15px 30px;border:1px solid transparent;
  transition:transform .28s var(--ease),background .28s var(--ease-2),box-shadow .28s var(--ease);}
.btn{background:var(--cream);color:#fff;border-color:var(--cream);box-shadow:0 4px 14px rgba(20,17,14,.16);}
.btn:hover,.answer .ab:hover{background:var(--acc);border-color:var(--acc);color:#fff;
  transform:translateY(-2px);box-shadow:0 12px 30px rgba(161,80,46,.30);}
.answer .ab{background:var(--cream);color:#fff;}
.sticky a{background:var(--cream);color:#fff;}

/* ---- Surfaces: bigger radii, soft shadow, hover lift ---- */
.rbox,.cbox,.step,.fcard,.card,.split .col,.note,.warn,.bcard,.cta{border-radius:var(--r);}
.card,.bcard{border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--sh-1);
  transition:transform .45s var(--ease),box-shadow .45s var(--ease),border-color .3s var(--ease-2);}
.card:hover,.bcard:hover{transform:translateY(-4px);box-shadow:var(--sh-2);border-color:rgba(20,17,14,.18);}
.rbox,.cbox{background:var(--ink2);border:1px solid var(--line);box-shadow:none;
  transition:transform .4s var(--ease),box-shadow .4s var(--ease);}
.rbox:hover,.cbox:hover{transform:translateY(-3px);box-shadow:var(--sh-1);}
.rbox .v,.cbox .v{font-weight:600;letter-spacing:-.03em;}
.step{background:var(--ink2);border:1px solid var(--line);border-top:none;
  border-left:3px solid var(--acc);box-shadow:var(--sh-1);}
.fcard{background:var(--ink2);border:1px solid var(--line);box-shadow:var(--sh-1);}
.cta{background:linear-gradient(165deg,var(--ink2) 0%,#fff 78%);border:1px solid var(--line);
  box-shadow:var(--sh-1);border-radius:var(--r-lg);}
.note{background:var(--acc-tint);border-left:3px solid var(--acc);border-radius:var(--r-sm);}
.pull{border-left:3px solid var(--acc);font-family:var(--serif);font-style:italic;font-weight:500;}

/* ---- Full-bleed hero: same scrim recipe as Majord's page hero ---- */
.hero::after{background:
  linear-gradient(100deg,rgba(14,12,10,.86) 0%,rgba(14,12,10,.62) 42%,rgba(14,12,10,.30) 100%),
  linear-gradient(180deg,rgba(14,12,10,.55) 0%,transparent 26%,transparent 58%,rgba(14,12,10,.74) 100%);}
.hero::before{display:none;}
.hero h1{font-weight:600;letter-spacing:-.03em;}
.hero .hk{letter-spacing:.16em;font-size:11.5px;font-weight:600;color:var(--acc-glow);}
.shero{border-radius:var(--r-lg);box-shadow:var(--sh-2);}

/* ---- Menus and chrome ---- */
.mmenu{background:#fff;}
.mmenu a.ml{font-weight:600;letter-spacing:-.02em;border-bottom-color:var(--line);}
.mmenu a.ml:hover{color:var(--acc);}
.mclose:hover,.mfoot a:hover,.mfoot a.on{color:var(--acc);border-bottom-color:var(--acc);}
.globe{border:1px solid var(--line);box-shadow:var(--sh-1);}
.globe:hover{border-color:var(--acc);}
.lpop{border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh-2);background:#fff;}
.lpop a:hover{background:var(--acc-tint);color:var(--acc);}
.sticky{background:rgba(255,255,255,.90);backdrop-filter:blur(14px);border-top:1px solid var(--line);}
.crumb{letter-spacing:.04em;text-transform:none;font-size:12.5px;}
.fold summary{font-family:var(--serif);font-weight:600;font-size:17.5px;letter-spacing:-.015em;}
.fold summary:after{color:var(--acc);}
.faq .q{font-weight:600;}
.dfilter input{border-radius:var(--r-pill);border:1px solid var(--line);background:var(--ink2);font-family:var(--sans);}
.dfilter input:focus{border-color:var(--acc);outline:none;box-shadow:0 0 0 4px var(--acc-tint);}
.vs{border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--sh-2);}
.vsmid{background:#fff;box-shadow:var(--sh-1);}
.lad thead th{background:var(--acc-tint);color:var(--acc);}
.cmp td.win:after{background:var(--acc);}
footer{border-top:1px solid var(--line);letter-spacing:.06em;}
#wmap{border-radius:var(--r);border:1px solid var(--line);}

/* ---- Motion: identical system and timing to Majord ---- */
.reveal{opacity:0;transform:translateY(26px);
  transition:opacity .9s var(--ease),transform .9s var(--ease);}
.reveal.in{opacity:1;transform:none;}
.reveal[data-d="1"]{transition-delay:.07s}.reveal[data-d="2"]{transition-delay:.14s}
.reveal[data-d="3"]{transition-delay:.21s}.reveal[data-d="4"]{transition-delay:.28s}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  .reveal{opacity:1!important;transform:none!important;transition:none!important;}
  *,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important;}
}

/* Over a full-bleed dark hero the bar disappears and its contents invert, then settles
   back to the light bar once the hero is behind you. Same rule as Majord. */
header.over-hero{background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none;border-bottom-color:transparent;}
header.over-hero .brand .name{color:#fff;}
header.over-hero .brand .ai{color:var(--acc-glow);}
header.over-hero .burger span{background:#fff;}
header.over-hero .burger:hover span{background:var(--acc-glow);}
header.over-hero .brand .mark circle,header.over-hero .brand .mark line{stroke:#fff;}
header.over-hero .brand .mark path{stroke:var(--acc-glow);}

.dbr{position:relative}.dbr .dbp{position:absolute;top:100%;right:0;margin-top:8px;min-width:172px;background:#fff;border:1px solid rgba(20,17,14,.10);border-radius:12px;padding:7px;box-shadow:0 14px 40px rgba(20,17,14,.13);opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity .16s,transform .16s,visibility .16s;display:grid;gap:1px;z-index:60}.dbr:hover .dbp,.dbr:focus-within .dbp{opacity:1;visibility:visible;transform:none}.dbr .dbp a{display:block;padding:8px 12px;border-radius:8px;font-size:13px;white-space:nowrap}.dbr .dbp a:hover{background:#f7f3ed}.mbr{margin-top:26px}