
/* ==========================================================================
   V2 · warm white base, colour by touches, motion with intent
   ========================================================================== */
:root {
  --blanc: #FDFBF7;
  --encre: #3B2B22;
  --encre-2: #6F5747;
  --gris: #806A5B;
  --ligne: #E8DFD2;
  --terra: #B0603F;
  --terra-d: #7E3F28;
  --terra-t: #C2855E;
  --rose: #F6EAE3;
  --sable-l: #F4ECE0;
  --sauge-l: #EAEEE4;
  --bronze: #A0714F;
  --chic: "Tenor Sans", "Jost", "Helvetica Neue", Arial, sans-serif;
}
body { background: var(--blanc); color: var(--encre); }
body::after { display: none; }
::selection { background: var(--rose); }

/* Paper grain, used by touches only */
.grain { position: relative; isolation: isolate; }
.grain::after { content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none; opacity: .55; mix-blend-mode: multiply; border-radius: inherit; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .4 0 0 0 0 .3 0 0 0 0 .2 0 0 0 1.2 -.45'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); background-size: 220px 220px; }
.grain > * { position: relative; z-index: 1; }

/* Type: a finer capital for menus, labels and buttons; colour by touches */
.hdr__nav a { font-family: var(--chic); font-size: 12.5px; font-weight: 400; letter-spacing: .2em; }
.hdr__right, .label, .btn, .link, .hdr__cta { font-family: var(--chic); }
.label { color: var(--terra-t); letter-spacing: .22em; }
.label--rule::before { background: var(--terra); }
.h1, .h2, .h3 { color: inherit; }
.h2 em { color: var(--terra-t); }
.lead { color: var(--encre-2); }
.muted { color: var(--gris); }
.link { background-image: linear-gradient(var(--terra), var(--terra)); }
.link:hover { color: var(--terra-t); }
.btn { background: var(--terra-d); border-color: var(--terra-d); color: var(--blanc); }
.btn:hover { background: transparent; color: var(--terra-t); }
.btn--ghost { background: transparent; color: var(--encre); border-color: var(--encre); }
.btn--ghost:hover { background: var(--encre); color: var(--blanc); }
.hdr { background: rgba(253,251,247,.96); }
.hdr--clear { background: transparent; }
.ctrl button { border-color: rgba(59,43,34,.5); border-radius: 50%; }
.ctrl button:not(:disabled):hover { background: var(--terra-d); border-color: var(--terra-d); color: var(--blanc); }
.dd__panel { border-radius: 14px; background: var(--blanc); }
.wa { background: var(--terra-d); }
.ftr { color: #E3D5C7; }
.ftr h4, .ftr__brand span, .ftr__muted, .ftr__bot { color: #B9A290; }
.ftr__sig { color: #E3D5C7; }
.card__price, .aff__p { color: var(--terra-t); }

/* Split headings: words rise one after the other */
.sw.rv { opacity: 1; transform: none; }
.sw .w { display: inline-block; overflow: hidden; vertical-align: top; padding-bottom: .1em; margin-bottom: -.1em; }
.sw .w > span { display: inline-block; transform: translateY(108%); transition: transform 1.15s var(--ease); transition-delay: calc(var(--i, 0) * 55ms); }
.sw.is-in .w > span { transform: none; }

/* Curtain reveal for photos */
.rv-clip.rv { opacity: 1; transform: none; }
.rv-clip::before { content: ""; position: absolute; inset: 0; z-index: 5; background: var(--blanc); transform-origin: 50% 0; transition: transform 1.5s var(--ease); pointer-events: none; }
.rv-clip.is-in::before { transform: scaleY(0); }
.sl .rv-clip::before { background: var(--sauge-l); }

/* ---------- Hero ---------- */
.hero video, .hero__poster { filter: none; }
.hero__warm { display: none; }
.hero__shade { background: linear-gradient(180deg, rgba(25,18,14,.38) 0%, rgba(25,18,14,.06) 32%, rgba(25,18,14,.06) 58%, rgba(25,18,14,.5) 100%); }
.hero__title .label { color: rgba(253,251,247,.9); }
.hero__title .label::before { background: rgba(253,251,247,.8); }
.search { margin-top: 38px; max-width: 840px; grid-template-columns: repeat(3, minmax(0, 1fr)) auto; align-items: center; border-radius: 999px; padding: 6px 6px 6px 12px; background: rgba(253,251,247,.9); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); box-shadow: 0 24px 60px -34px rgba(20,12,8,.6); }
.search label { padding: 8px 24px; border-right: 1px solid var(--ligne); gap: 1px; }
.search label:nth-of-type(3) { border-right: 0; }
.search label span { font-family: var(--chic); font-size: 9.5px; color: var(--terra-t); }
.search .dd { font-size: 15px; color: var(--encre); text-transform: none; letter-spacing: 0; font-family: var(--sans); }
.search .dd__btn { color: var(--encre); }
.search .btn { height: 52px; min-height: 52px; border-radius: 999px; padding: 0 34px; }
.search .dd__panel { top: calc(100% + 18px); }

/* ---------- About ---------- */
.ab { padding: clamp(110px, 12vw, 190px) 0 clamp(90px, 10vw, 150px); position: relative; }
.ab__grid { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); gap: clamp(50px, 7vw, 120px); align-items: center; }
.ab__t { font-family: var(--serif); font-weight: 300; font-size: clamp(42px, 4.4vw, 70px); line-height: 1.04; margin: 22px 0 36px; color: var(--encre); }
.ab__t em { font-style: italic; color: var(--terra-t); }
.ab__lead { font-size: clamp(17px, 1.3vw, 19px); line-height: 1.85; color: var(--encre-2); margin: 0 0 34px; max-width: 560px; }
.ab__q { font-family: var(--serif); font-style: italic; font-size: clamp(22px, 1.9vw, 28px); line-height: 1.4; color: var(--encre); margin: 0 0 30px; padding: 4px 0 4px 28px; border-left: 1px solid var(--terra); max-width: 540px; }
.ab__p { line-height: 1.85; color: var(--encre-2); margin: 0 0 36px; max-width: 540px; }
.ab__vis { position: relative; height: clamp(560px, 52vw, 760px); }
.ab__big { position: absolute; right: 0; top: 0; width: 78%; height: 86%; margin: 0; overflow: hidden; background: var(--sable-l); border-radius: 220px 220px 0 0; }
.ab__small { position: absolute; left: 0; bottom: 0; width: 44%; aspect-ratio: 4 / 5; margin: 0; padding: 14px; background: var(--sable-l); box-shadow: 0 40px 70px -40px rgba(59,43,34,.45); }
.ab__small .ab__in { overflow: hidden; width: 100%; height: 100%; }
.ab__big img, .ab__small img { width: 100%; height: 100%; object-fit: cover; transform: translate3d(0, var(--py, 0px), 0) scale(1.14); opacity: 0; transition: opacity 1.2s var(--ease); }
.ab__big img.is-in, .ab__small img.is-in { opacity: 1; }
.ab__seal { position: absolute; right: 64%; top: 6%; width: 150px; height: 150px; color: var(--terra-t); z-index: 3; }
.ab__seal svg { width: 100%; height: 100%; animation: spin 38s linear infinite; }
.ab__seal b { position: absolute; inset: 0; display: grid; place-items: center; font-family: var(--serif); font-weight: 400; font-size: 30px; font-style: italic; color: var(--terra-t); }
@keyframes spin { to { transform: rotate(360deg); } }

/* ---------- Favourites ---------- */
.aff { background: linear-gradient(180deg, var(--blanc) 0%, var(--rose) 20%, var(--rose) 80%, var(--blanc) 100%); padding: clamp(100px, 11vw, 170px) 0 clamp(90px, 10vw, 150px); }
.aff__card { background: var(--sable-l); isolation: isolate; border-radius: 2px; }
.aff__card::before { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; opacity: .6; mix-blend-mode: multiply; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .4 0 0 0 0 .3 0 0 0 0 .2 0 0 0 1.2 -.45'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }
.aff__card .label { color: var(--terra-t); }
.aff__t { color: var(--encre); }
.aff__f { color: var(--encre-2); }
.aff__p small { color: var(--gris); }

/* ---------- Koh Samui: an arc of sketches and photographs ---------- */
.isl { position: relative; padding: clamp(90px, 9vw, 140px) 0 clamp(60px, 6vw, 90px); background: linear-gradient(180deg, var(--blanc) 0%, var(--sable-l) 55%, var(--sable-l) 100%); overflow: hidden; text-align: center; }
.isl__head { max-width: 860px; }
.isl__head .h2 { margin: 18px 0 24px; }
.isl__head .lead { margin: 0 auto; max-width: 660px; }
.isl__arc { position: relative; max-width: 1360px; height: clamp(440px, 42vw, 620px); margin: clamp(50px, 5vw, 80px) auto 0; }
.isl__it { position: absolute; left: var(--x); top: var(--y); width: var(--w); z-index: var(--z, 1); margin: 0; transform: translate3d(0, calc(var(--py, 0px) + 90px), 0) rotate(0deg); opacity: 0; transition: transform 1.6s var(--ease), opacity 1.2s var(--ease), box-shadow .5s; transition-delay: var(--d, 0s); }
.isl__arc.is-in .isl__it { opacity: 1; transform: translate3d(0, var(--py, 0px), 0) rotate(var(--r)); }
.isl__it .isl__f { display: block; aspect-ratio: 4 / 5; overflow: hidden; background: #fff; box-shadow: 0 34px 60px -36px rgba(59,43,34,.55); transition: transform .7s var(--ease), box-shadow .7s var(--ease); }
.isl__it--ph .isl__f { padding: 10px; background: #fff; }
.isl__it--sk .isl__f { background: #FBF7EF; }
.isl__it img { width: 100%; height: 100%; object-fit: cover; display: block; }
.isl__it--sk img { object-fit: contain; }
.isl__it:hover { z-index: 9; }
.isl__it:hover .isl__f { transform: translateY(-14px) rotate(calc(var(--r) * -1)) scale(1.03); box-shadow: 0 50px 80px -40px rgba(59,43,34,.6); }
.isl__it figcaption { position: absolute; left: 50%; bottom: -34px; transform: translateX(-50%); white-space: nowrap; font-family: var(--serif); font-style: italic; font-size: 17px; color: var(--encre-2); opacity: 0; transition: opacity .5s; }
.isl__it:hover figcaption { opacity: 1; }
.isl__facts { display: flex; justify-content: center; gap: clamp(40px, 7vw, 120px); margin: clamp(60px, 6vw, 90px) auto 0; padding-top: 30px; border-top: 1px solid rgba(126,63,40,.18); max-width: 820px; }
.isl__facts div { font-family: var(--chic); font-size: 10.5px; letter-spacing: .22em; text-transform: uppercase; color: var(--encre-2); }
.isl__facts b { display: block; font-family: var(--serif); font-weight: 300; font-size: 40px; letter-spacing: 0; text-transform: none; color: var(--terra-t); margin-bottom: 6px; }

/* ---------- The island map, warmer ---------- */
.mapsec { padding: clamp(40px, 4vw, 70px) 0 clamp(100px, 10vw, 160px); background: linear-gradient(180deg, var(--sable-l) 0%, var(--sable-l) 60%, var(--blanc) 100%); }
.map .map__water path { stroke: var(--terra-d); animation: drift 7s linear infinite; }
.map .map__water path:nth-child(2) { animation-duration: 10s; } .map .map__water path:nth-child(3) { animation-duration: 14s; }
@keyframes drift { to { stroke-dashoffset: -60; } }
.map .map__shadow { fill: rgba(126,63,40,.16); }
.map .map__land { fill: var(--blanc); }
.map .map__hills path, .map .coast, .map .coast2 { stroke: var(--terra-d); }
.map .dot .pin { fill: var(--blanc); stroke: var(--terra-d); }
.map .dot .halo { fill: var(--terra); }
.map .dot text { fill: var(--encre-2); }
.map .dot:hover .pin, .map .dot.is-on .pin, .map .dot.is-focus .pin { fill: var(--terra); stroke: var(--terra); }
.map .dot:hover text, .map .dot.is-on text, .map .dot.is-focus text { fill: var(--terra-d); }
.map .dot.is-on .halo, .map .dot:hover .halo { opacity: .22; animation: pulse 2.4s var(--ease) infinite; transform-box: fill-box; transform-origin: center; }
@keyframes pulse { 0% { transform: scale(.6); opacity: .35; } 100% { transform: scale(1.6); opacity: 0; } }
.area-list, .area-item { border-color: rgba(126,63,40,.16); }
.area-item:hover, .area-item.is-on { color: var(--terra-t); }

/* ---------- Nouveautés ---------- */
.news { padding: clamp(90px, 9vw, 140px) 0 clamp(100px, 10vw, 150px); }

/* ---------- Sell: a new chapter ---------- */
.sl { padding: clamp(100px, 10vw, 160px) 0; background: linear-gradient(180deg, var(--blanc) 0%, var(--sauge-l) 30%, var(--sauge-l) 70%, var(--blanc) 100%); }
.sl__grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); align-items: center; }
.sl__img { grid-column: 1 / span 7; grid-row: 1; position: relative; height: clamp(520px, 50vw, 720px); margin: 0; overflow: hidden; background: var(--sable-l); }
.sl__img img { width: 100%; height: 100%; object-fit: cover; transform: translate3d(0, var(--py, 0px), 0) scale(1.15); opacity: 0; transition: opacity 1.2s; }
.sl__img img.is-in { opacity: 1; }
.sl__img figcaption { position: absolute; left: 22px; bottom: 18px; font-family: var(--serif); font-style: italic; font-size: 17px; color: rgba(253,251,247,.92); text-shadow: 0 1px 12px rgba(0,0,0,.35); }
.sl__card { grid-column: 7 / span 6; grid-row: 1; background: var(--blanc); padding: clamp(40px, 4.4vw, 70px); box-shadow: 0 50px 90px -50px rgba(59,43,34,.45); }
.sl__card .h2 { margin: 20px 0 26px; }
.sl__card .lead { font-size: 17px; margin: 0; }
.sl__q { font-family: var(--serif); font-style: italic; font-size: clamp(20px, 1.6vw, 24px); line-height: 1.5; color: var(--terra-t); margin: 30px 0 36px; }
.sl__btns { display: flex; gap: 14px; flex-wrap: wrap; }

/* ---------- Let's talk: a card on the table, tags behind ---------- */
.lt { padding: clamp(110px, 11vw, 170px) 0 clamp(120px, 12vw, 190px); }
.lt__stage { position: relative; max-width: 920px; margin: 0 auto; }
.lt__stage.rv { opacity: 1; transform: none; }
.lt__frame { position: relative; z-index: 2; background: var(--rose); padding: 20px; box-shadow: 0 60px 100px -60px rgba(126,63,40,.5); }
.lt__card { background: var(--blanc); padding: clamp(50px, 6vw, 86px) clamp(30px, 6vw, 90px); text-align: center; }
.lt__card .h2 { margin: 22px auto 22px; max-width: 700px; font-size: clamp(34px, 3.6vw, 54px); }
.lt__card p { color: var(--encre-2); max-width: 520px; margin: 0 auto 38px; line-height: 1.8; }
.lt__act { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; }
.lt__tag { position: absolute; z-index: 1; display: flex; align-items: center; gap: 14px; padding: 16px 30px 16px 22px; border-radius: 6px 26px 26px 6px; font-family: var(--chic); font-size: 11px; letter-spacing: .26em; text-transform: uppercase; color: var(--blanc); box-shadow: 0 24px 40px -26px rgba(59,43,34,.6); transform: translate(var(--fx, 0), var(--fy, 0)) rotate(0deg) scale(.9); opacity: 0; transition: transform 1.4s var(--ease), opacity .8s; transition-delay: var(--d, 0s); }
.lt__tag::before { content: ""; width: 9px; height: 9px; border-radius: 50%; background: var(--blanc); box-shadow: inset 0 1px 2px rgba(0,0,0,.25); }
.lt__tag i { position: absolute; left: -46px; top: 50%; width: 52px; height: 1px; background: rgba(59,43,34,.35); transform-origin: right; transform: rotate(-12deg); }
.lt__stage.is-in .lt__tag { opacity: 1; transform: translate(0, 0) rotate(var(--r)) scale(1); }
.lt__tag.t1 { left: -118px; top: 34px; background: var(--terra-d); --r: -11deg; --fx: 90px; --fy: 20px; --d: .2s; }
.lt__tag.t2 { right: -116px; top: 70px; background: #8E9C84; --r: 8deg; --fx: -90px; --fy: 10px; --d: .35s; }
.lt__tag.t3 { left: -132px; bottom: 70px; background: #C9A88E; --r: 7deg; --fx: 80px; --fy: -10px; --d: .5s; }
.lt__tag.t4 { right: -120px; bottom: 40px; background: var(--terra); --r: -6deg; --fx: -80px; --fy: -10px; --d: .65s; }
.lt__tag.t2 i, .lt__tag.t4 i { left: auto; right: -46px; transform-origin: left; transform: rotate(12deg); }
.isl__arc.rv { opacity: 1; transform: none; }

/* ---------- Round 2: black buttons, fewer terracotta touches ---------- */
:root { --noir: #1E1F1C; }
.label { color: var(--encre-2); }
.label--rule::before { background: var(--bronze); }
.search label span { color: var(--encre-2); }
.link { background-image: linear-gradient(var(--bronze), var(--bronze)); }
.link:hover { color: var(--encre); }
.btn { background: var(--noir); border-color: var(--noir); color: var(--blanc); }
.btn:hover { background: transparent; color: var(--noir); }
.btn--ghost { background: transparent; color: var(--noir); border-color: var(--noir); }
.btn--ghost:hover { background: var(--noir); color: var(--blanc); }
.search .btn:hover { background: var(--noir); color: var(--blanc); opacity: .86; }
.ctrl button:not(:disabled):hover { background: var(--noir); border-color: var(--noir); }
.wa { background: var(--noir); }
.ftr { background: var(--noir); color: #CFCFC8; }
.ftr h4, .ftr__brand span { color: #9A9B94; }
.ftr__muted, .ftr__bot { color: #8A8B84; }
.ftr__sig { color: #CFCFC8; }
.card__price, .aff__p, .aff__card .label { color: var(--encre); }
.aff__card .label { color: var(--encre-2); }
.sl__q { color: var(--encre); }
.isl__facts b { color: var(--encre); }

/* About: tighter, a clean second photograph, the real logo in the seal */
.ab { padding-bottom: clamp(30px, 3vw, 50px); }
.ab__small { padding: 0; background: none; box-shadow: 0 40px 70px -36px rgba(59,43,34,.5); }
.ab__seal { color: var(--encre); }
.ab__seal img { position: absolute; left: 50%; top: 50%; height: 62px; width: auto; transform: translate(-50%, -50%); }

/* Coups de cœur: closer to the manifesto, a small heart under the word */
.aff { padding-top: clamp(60px, 6vw, 96px); background: linear-gradient(180deg, var(--blanc) 0%, var(--rose) 16%, var(--rose) 80%, var(--blanc) 100%); }
.aff__cw { position: relative; display: inline-block; }
.aff__heart { position: absolute; left: 50%; top: 100%; width: 26px; height: auto; margin-top: 2px; fill: rgba(190, 40, 45, .32); transform: translateX(-50%); animation: beat 2.8s ease-in-out infinite; }
@keyframes beat { 0%, 100% { transform: translateX(-50%) scale(1); } 12% { transform: translateX(-50%) scale(1.14); } 24% { transform: translateX(-50%) scale(1); } 36% { transform: translateX(-50%) scale(1.08); } 48% { transform: translateX(-50%) scale(1); } }

/* The island: a descending arc that hangs from the text, no frames */
.isl__head { max-width: 720px; }
.isl__arc { height: clamp(460px, 42vw, 600px); margin-top: 24px; }
.isl__it .isl__f { box-shadow: none; background: none; padding: 0; }
.isl__it--sk .isl__f { background: none; }
.isl__it--sk img { mix-blend-mode: multiply; object-fit: contain; }
.isl__it--arch .isl__f { aspect-ratio: 3 / 4; border-radius: 999px 999px 0 0; box-shadow: 0 40px 70px -40px rgba(59,43,34,.5); }
.isl__it--round .isl__f { aspect-ratio: 1 / 1; border-radius: 50%; box-shadow: 0 40px 70px -40px rgba(59,43,34,.5); }
.isl__it:hover .isl__f { transform: translateY(-10px) scale(1.03); box-shadow: 0 50px 80px -40px rgba(59,43,34,.55); }
.isl__it--sk:hover .isl__f { box-shadow: none; }
.isl__it figcaption { bottom: -30px; }

/* Let's talk: a longer, lower card */
.lt { padding: clamp(80px, 8vw, 120px) 0 clamp(100px, 10vw, 150px); }
.lt__stage { max-width: 1040px; }
.lt__frame { padding: 16px; }
.lt__card { padding: clamp(36px, 3.6vw, 52px) clamp(30px, 6vw, 90px); }
.lt__card .h2 { font-size: clamp(30px, 3vw, 44px); margin: 16px auto 14px; max-width: 820px; }
.lt__card p { margin-bottom: 26px; }
.isl__it--sk img { -webkit-mask-image: radial-gradient(ellipse 70% 70% at 50% 50%, #000 62%, transparent 100%); mask-image: radial-gradient(ellipse 70% 70% at 50% 50%, #000 62%, transparent 100%); }
.isl__head .h2 { white-space: nowrap; }


/* ---------- Round 3 ---------- */
/* Heart tucked behind the end of "cœur" */
.aff__cw { isolation: isolate; }
.aff__heart { left: auto; right: -15px; top: 14%; width: 38px; margin: 0; z-index: -1; fill: rgba(200, 42, 48, .26); transform: scale(0); transform-origin: 50% 60%; animation: none; }
.sw.is-in .aff__heart { animation: heartIn 1s cubic-bezier(.34,1.56,.64,1) 1.1s both, heartBeat 3s ease-in-out 2.4s infinite; }
@keyframes heartIn { from { transform: scale(0) rotate(-14deg); } to { transform: scale(1) rotate(8deg); } }
@keyframes heartBeat { 0%, 100% { transform: scale(1) rotate(8deg); } 10% { transform: scale(1.12) rotate(8deg); } 20% { transform: scale(1) rotate(8deg); } 30% { transform: scale(1.06) rotate(8deg); } 40% { transform: scale(1) rotate(8deg); } }

/* The island: a fuller collage, overlapping, gently floating */
.isl__arc { height: clamp(500px, 44vw, 620px); }
.isl__it { transition: transform 1.8s var(--ease), opacity 1.4s var(--ease); }
.isl__arc.is-in .isl__it { transform: translate3d(0, var(--py, 0px), 0); }
.isl__it .isl__f { animation: float var(--f, 7s) ease-in-out infinite alternate; }
@keyframes float { from { translate: 0 -6px; } to { translate: 0 6px; } }
.isl__it--ph .isl__f { border-radius: 14px; box-shadow: 0 36px 60px -34px rgba(59,43,34,.55); }
.isl__it--soft .isl__f { aspect-ratio: 4 / 5; }
.isl__it--land .isl__f { aspect-ratio: 5 / 4; }
.isl__it--arch .isl__f { aspect-ratio: 3 / 4; border-radius: 999px 999px 14px 14px; }
.isl__it--round .isl__f { aspect-ratio: 1 / 1; border-radius: 50%; }
.isl__it:hover .isl__f { animation-play-state: paused; transform: translateY(-8px) scale(1.035); }

/* Let's talk: a soft Majorelle gradient around the card */
.lt__frame { background: linear-gradient(115deg, rgba(15,78,163,.26) 0%, rgba(15,78,163,.12) 38%, rgba(15,78,163,.05) 70%, rgba(15,78,163,.14) 100%); box-shadow: 0 60px 100px -60px rgba(15,78,163,.4); }
.search .dd span, .search .dd__v { font-family: var(--sans); font-size: 15px; text-transform: none; letter-spacing: 0; color: var(--encre); }


/* ---------- Round 4: the island, Kretz-style; warm green card ---------- */
.isl2 { position: relative; overflow: hidden; padding: clamp(90px, 9vw, 140px) 0; background: linear-gradient(180deg, var(--blanc) 0%, #E8ECE3 10%, #E8ECE3 90%, var(--blanc) 100%); }
.isl2__in { display: grid; grid-template-columns: minmax(0, 41fr) minmax(0, 59fr); align-items: center; gap: clamp(30px, 4vw, 70px); padding-left: max(var(--gutter), calc((100vw - var(--max)) / 2 + var(--gutter))); }
.isl2__txt { max-width: 520px; position: relative; z-index: 5; }
.isl2__txt .h2 { margin: 18px 0 28px; }
.isl2__txt p { color: var(--encre-2); font-size: 16.5px; line-height: 1.9; margin: 0 0 44px; }
.isl2__facts { display: flex; gap: clamp(26px, 3vw, 50px); padding-top: 26px; border-top: 1px solid rgba(59,43,34,.15); }
.isl2__facts div { font-family: var(--chic); font-size: 10px; letter-spacing: .2em; text-transform: uppercase; color: var(--encre-2); }
.isl2__facts b { display: block; font-family: var(--serif); font-weight: 300; font-size: 34px; letter-spacing: 0; text-transform: none; color: var(--encre); margin-bottom: 4px; }
.isl2__col { position: relative; height: clamp(640px, 56vw, 820px); }
.isl2__it { position: absolute; left: var(--x); top: var(--y); width: var(--w); margin: 0; z-index: 2; }
.isl2__it.rv { opacity: 0; transform: translate3d(0, 70px, 0); transition: opacity 1.3s var(--ease), transform 1.7s var(--ease); transition-delay: var(--d, 0s); }
.isl2__it.rv.is-in { opacity: 1; transform: none; }
.isl2__it img { display: block; width: 100%; object-fit: cover; transform: translate3d(0, var(--py, 0px), 0); }
.isl2__ph { overflow: hidden; }
.isl2__ph img { transform: translate3d(0, var(--py, 0px), 0) scale(1.08); transition: transform .9s var(--ease); }
.isl2__ph:hover img { transform: translate3d(0, var(--py, 0px), 0) scale(1.13); }
.isl2__p1 img { aspect-ratio: 4 / 5; }
.isl2__p2 img { aspect-ratio: 4 / 3; }
.isl2__p3 { z-index: 3; }
.isl2__p3 img { aspect-ratio: 3 / 2; }
.isl2__p4 img { aspect-ratio: 3 / 4; }
.isl2__sk { z-index: 4; mix-blend-mode: multiply; pointer-events: none; }
.isl2__sk img { aspect-ratio: 1136 / 1408; object-fit: contain; -webkit-mask-image: radial-gradient(ellipse 72% 72% at 50% 50%, #000 60%, transparent 100%); mask-image: radial-gradient(ellipse 72% 72% at 50% 50%, #000 60%, transparent 100%); }
.mapsec { padding-top: clamp(90px, 9vw, 140px); background: linear-gradient(180deg, var(--blanc) 0%, var(--sable-l) 25%, var(--sable-l) 65%, var(--blanc) 100%); }
.lt__frame { background: linear-gradient(115deg, rgba(104,128,78,.32) 0%, rgba(134,152,104,.17) 42%, rgba(170,178,130,.09) 72%, rgba(118,140,88,.22) 100%); box-shadow: 0 60px 100px -60px rgba(80,100,60,.42); }
/* v2e: transparent sketches */
.isl2__sk{mix-blend-mode:normal}
.isl2__sk img{-webkit-mask-image:none;mask-image:none}
/* v2f: warmer olive frame for Let's talk */
.lt__frame{background:linear-gradient(115deg,#9EAA7C 0%,#B9C097 40%,#D3D3B3 70%,#A7B184 100%);box-shadow:0 60px 100px -60px rgba(80,95,55,.5)}
/* v2g: mirrored island collage, softer green frame, shorter footer */
.isl2__in{grid-template-columns:minmax(0,58fr) minmax(0,42fr);padding-left:0;padding-right:max(var(--gutter),calc((100vw - var(--max))/2 + var(--gutter)))}
.isl2__txt{justify-self:start;max-width:500px}
.isl2__col{height:clamp(600px,50vw,760px)}
.isl2__p1{z-index:3}.isl2__p1,.isl2__p1 img{border-radius:999px 999px 0 0}
.isl2__p1 img{aspect-ratio:3/4}
.isl2__p2{z-index:2}.isl2__p2 img{aspect-ratio:4/3}
.isl2__p3{z-index:3;border-radius:50%;box-shadow:0 0 0 10px #E8ECE3}.isl2__p3 img{aspect-ratio:1/1;border-radius:50%}
.isl2__p4{z-index:3;box-shadow:0 0 0 10px #E8ECE3}.isl2__p4 img{aspect-ratio:3/4}
.isl2__p1{box-shadow:0 0 0 10px #E8ECE3}
.lt__frame{background:linear-gradient(125deg,rgba(150,164,112,.62) 0%,rgba(176,186,142,.38) 32%,rgba(212,215,188,.18) 60%,rgba(166,177,128,.42) 100%);box-shadow:0 60px 100px -60px rgba(80,95,55,.38)}
.lt__card{box-shadow:0 0 34px 8px rgba(253,251,247,.85)}
.ftr{padding:clamp(48px,5vw,72px) 0 24px}
.ftr__top{padding-bottom:38px;gap:40px}
.ftr__brand img{height:64px}
.ftr__bot{padding-top:20px}
/* v2h: green frame, softer fade */
.lt__frame{background:linear-gradient(125deg,rgba(146,162,106,.9) 0%,rgba(170,182,132,.55) 28%,rgba(205,210,176,.22) 55%,rgba(170,182,132,.5) 80%,rgba(146,162,106,.8) 100%)}
.lt__card{box-shadow:0 0 22px 4px rgba(253,251,247,.75)}
/* v2i: island without outlines, typed title, even spacing around Let's talk */
.isl2__p1,.isl2__p3,.isl2__p4{box-shadow:0 34px 60px -32px rgba(38,48,30,.45)}
.isl2__p2{box-shadow:0 30px 70px -40px rgba(38,48,30,.35)}
.tw__c{opacity:0}
.tw__c.on{opacity:1}
.tw__caret{display:inline-block;width:2px;height:.82em;margin:0 1px 0 2px;vertical-align:-.04em;background:var(--terra-d);animation:twBlink 1s steps(1) infinite}
.tw__caret.done{animation:none;opacity:0;transition:opacity .8s}
@keyframes twBlink{50%{opacity:0}}
.news{padding-bottom:0}
.lt{padding-top:clamp(100px,10vw,150px)}
/* v2j: island parallax moves whole figures (no gaps), drop transition */
.isl2__it{translate:0 var(--py,0px)}
.isl2__it img,.isl2__ph img{transform:scale(1.04)}
.isl2__ph:hover img{transform:scale(1.09)}
.isl2{background:linear-gradient(180deg,var(--blanc) 0%,#E8ECE3 10%,#E8ECE3 100%)}
.drop{position:relative;height:190vh;background:#E8ECE3;margin-top:-1px}
.drop__stick{position:sticky;top:0;height:100vh;overflow:hidden}
.drop__svg{display:block;width:100%;height:100%}
.mapsec{background:linear-gradient(180deg,#F4ECE0 0%,#F4ECE0 60%,var(--blanc) 100%);margin-top:-1px}
@media (prefers-reduced-motion:reduce){.drop{display:none}.isl2{background:linear-gradient(180deg,var(--blanc) 0%,#E8ECE3 10%,#E8ECE3 90%,var(--blanc) 100%)}}
/* v2k: feathered overlaps, quick drop, slower reveals */
.isl2__p1,.isl2__p3,.isl2__p4{box-shadow:none}
.isl2__p1{-webkit-mask-image:linear-gradient(to left,transparent 0,#000 18%),linear-gradient(to top,transparent 0,#000 14%);-webkit-mask-composite:source-in;mask-image:linear-gradient(to left,transparent 0,#000 18%),linear-gradient(to top,transparent 0,#000 14%);mask-composite:intersect}
.isl2__p4{-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 16%),linear-gradient(to left,transparent 0,#000 16%);-webkit-mask-composite:source-in;mask-image:linear-gradient(to bottom,transparent 0,#000 16%),linear-gradient(to left,transparent 0,#000 16%);mask-composite:intersect}
.isl2__p3{-webkit-mask-image:radial-gradient(circle closest-side,#000 78%,transparent 100%);mask-image:radial-gradient(circle closest-side,#000 78%,transparent 100%)}
.isl2{padding-bottom:clamp(50px,5vw,80px)}
.drop{height:34vh;min-height:240px;background:linear-gradient(180deg,#E8ECE3 0%,#E8ECE3 50%,#F4ECE0 100%)}
.drop__stick{position:absolute;inset:0;height:auto}
.drop.is-done{background:#F4ECE0}
.mapsec{padding-top:clamp(40px,4vw,70px)}
@media (prefers-reduced-motion: no-preference){
.rv{transform:translateY(44px);transition:opacity 1.7s var(--ease),transform 1.9s var(--ease)}
.rv-d1{transition-delay:.25s}.rv-d2{transition-delay:.5s}
.sw .w > span{transition:transform 1.6s var(--ease);transition-delay:calc(var(--i,0) * 90ms)}
.rv-clip::before{transition:transform 2.4s var(--ease)}
.ab__big img,.ab__small img{transition:opacity 1.8s var(--ease)}
.isl2__it.rv{transition:opacity 1.8s var(--ease),transform 2.2s var(--ease);transition-delay:calc(var(--d,0s) * 1.6)}
}
.drop.is-done{background:linear-gradient(180deg,#E8ECE3 0%,#F4ECE0 55%,#F4ECE0 100%)}
/* v2l: favourites controls lower; circle fades only where it overlaps the coast photo */
.aff__foot{margin-top:clamp(40px,4vw,64px)}
.isl2__p3{-webkit-mask-image:linear-gradient(to bottom,transparent 0,rgba(0,0,0,.55) 16%,#000 40%);mask-image:linear-gradient(to bottom,transparent 0,rgba(0,0,0,.55) 16%,#000 40%)}
/* v2m: heart on the light ground, drop bursting on the island, separator */
.aff__ic{position:relative;display:inline-block;isolation:isolate}
.aff__hl{position:absolute;left:-13px;top:-4px;width:28px;height:auto;z-index:-1;fill:rgba(200,42,48,.26);transform:scale(0);transform-origin:50% 60%}
.aff:has(.sw.is-in) .aff__hl{animation:heartInL 1s cubic-bezier(.34,1.56,.64,1) 1.9s both,heartBeatL 3s ease-in-out 3.2s infinite}
@keyframes heartInL{from{transform:scale(0) rotate(14deg)}to{transform:scale(1) rotate(-10deg)}}
@keyframes heartBeatL{0%,100%{transform:scale(1) rotate(-10deg)}10%{transform:scale(1.12) rotate(-10deg)}20%{transform:scale(1) rotate(-10deg)}30%{transform:scale(1.06) rotate(-10deg)}40%{transform:scale(1) rotate(-10deg)}}
@media (prefers-reduced-motion:reduce){.aff__hl{transform:rotate(-10deg)}}
.drop,.drop.is-done{background:linear-gradient(180deg,#E8ECE3 0%,#F4ECE0 100%)}
.drop__fx{position:fixed;inset:0;width:100%;height:100%;z-index:30;pointer-events:none}
.mapsec{padding-bottom:clamp(40px,4vw,60px)}
.sep{display:flex;justify-content:center;padding:6px 0}
.sep__l.rv{display:block;width:1px;height:96px;background:linear-gradient(180deg,rgba(59,43,34,0),rgba(59,43,34,.35));opacity:1;transform:scaleY(0);transform-origin:50% 0;transition:transform 1.8s var(--ease);position:relative}
.sep__l.rv.is-in{transform:scaleY(1)}
.sep__l::after{content:"";position:absolute;left:50%;bottom:-3px;width:5px;height:5px;margin-left:-2.5px;border-radius:50%;background:var(--terra-d);opacity:.55}
.news{padding-top:clamp(40px,4vw,60px)}
/* v2n: tighter island→map gap, scroll-drawn thread */
.isl2{padding-bottom:0}
.drop{height:110px;min-height:0}
.mapsec{padding-top:clamp(20px,2vw,32px)}
.sep__l.rv,.sep__l.rv.is-in{height:120px;transform:scaleY(var(--p,0));transition:none}
.sep__l::after{opacity:0;transform:scale(0);transition:opacity .5s var(--ease),transform .6s cubic-bezier(.34,1.56,.64,1)}
.sep.is-end .sep__l::after{opacity:.6;transform:scale(1)}
@media (prefers-reduced-motion:reduce){.sep__l.rv,.sep__l.rv.is-in{transform:none}.sep__l::after{opacity:.6;transform:none}}
/* v2o: About text, one body style, a more assertive italic quote */
.ab__lead,.ab__p{font-family:inherit;font-size:16px;font-weight:300;line-height:1.95;letter-spacing:.005em;color:var(--encre-2);max-width:520px;margin:0 0 34px}
.ab__q{font-family:var(--serif);font-style:italic;font-weight:400;font-size:clamp(26px,2.15vw,32px);line-height:1.3;letter-spacing:-.005em;color: var(--terra-t);max-width:500px;margin:6px 0 36px;padding:2px 0 2px 26px;border-left:1px solid rgba(176,96,63,.45)}
/* v2p: homepage order island > new developments > thread > map */
.fadeband{height:110px;background:linear-gradient(180deg,#E8ECE3 0%,var(--blanc) 100%);margin-top:-1px}
.drop,.drop.is-done{height:90px;background:linear-gradient(180deg,var(--blanc) 0%,#F4ECE0 100%)}
.news{padding-bottom:clamp(30px,3vw,50px)}
.mapsec{padding-bottom:clamp(60px,6vw,90px)}
/* v2q: favourites as a 3D coverflow */
.aff__view{--w:min(980px,66vw);perspective:1900px;perspective-origin:50% 38%;height:calc(var(--w)*9/16 + 72px);margin-top:clamp(36px,4vw,60px)}
.aff__track{position:absolute;inset:0;display:block;transform:none!important;transition:none;will-change:auto;transform-style:preserve-3d}
.aff__s{position:absolute;top:0;left:50%;width:var(--w);margin-left:calc(var(--w) / -2);flex:none;transform-style:preserve-3d;transition:transform 1.15s var(--ease),opacity .9s var(--ease);will-change:transform}
.aff__img{border-radius:18px;overflow:hidden;transform:translateZ(0);box-shadow:0 50px 70px -45px rgba(59,43,34,.5)}
.aff__s:not(.is-on) .aff__img{cursor:pointer}
.aff__s:not(.is-on) .aff__img img{filter:brightness(.8) saturate(.9)}
.aff__card{border-radius:14px}
.aff__card::before{border-radius:inherit}
.cf__btn{position:absolute;z-index:30;top:calc(var(--w) * 9 / 32);width:48px;height:48px;margin-top:-24px;padding:0;border:0;border-radius:50%;display:grid;place-items:center;background:rgba(253,251,247,.78);color:var(--encre);box-shadow:0 12px 30px -14px rgba(59,43,34,.45);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);cursor:pointer;transition:background .3s,color .3s,transform .4s var(--ease)}
.cf__btn:hover{background:var(--blanc);color: var(--terra-t);transform:scale(1.07)}
.cf__btn--l{left:max(14px,calc(50% - var(--w) / 2 - 130px))}
.cf__btn--r{right:max(14px,calc(50% - var(--w) / 2 - 130px))}
@media (max-width:760px){.aff__view{--w:84vw;height:auto}.cf__btn{width:40px;height:40px;margin-top:-20px;top:calc(var(--w) * 3 / 8)}}
/* v2r: deeper coverflow perspective */
.aff__view{perspective:1300px}
/* v2s: side homes sit behind the main one and show the heart of their photo */
.aff__track,.aff__s{transform-style:flat}
.aff__img img{transition:opacity 1s,transform 1.15s var(--ease),filter .9s}
.aff__s.is-r .aff__img img{transform:translateX(37%) scale(1.3)}
.aff__s.is-l .aff__img img{transform:translateX(-37%) scale(1.3)}
/* v2t: island copy in three short paragraphs */
.isl2__copy{margin:0 0 44px}
.isl2__txt .isl2__copy p{margin:0 0 18px}
.isl2__txt .isl2__copy p:last-child{margin-bottom:0}
/* v2u: the island copy closes on an italic terracotta line */
.isl2__txt .isl2__copy p:last-child{font-family:var(--serif);font-style:italic;font-weight:400;font-size:clamp(22px,1.8vw,27px);line-height:1.35;color: var(--terra-t);margin-top:28px}
/* v2v: hero search menus open upwards (the hero clips anything below it) */
.hero .search .dd__panel{top:auto;bottom:calc(100% + 20px);transform:translateY(6px);max-height:min(470px,calc(100vh - 200px))}
.hero .search .dd.is-open .dd__panel{transform:none}
/* Unified pill buttons */
.btn,.btn2,.gd-btn,.cf__btn,.dv-btn{border-radius:999px}
/* Home: discreet seller band */
.selb{padding:0 0 clamp(16px,1.6vw,26px)}
.selb__in{display:flex;align-items:center;justify-content:center;gap:18px 34px;flex-wrap:wrap;padding:28px 0;border-top:1px solid rgba(126,63,40,.2);border-bottom:1px solid rgba(126,63,40,.2);text-align:center}
.selb p{margin:0;font-family:'Cormorant Garamond',serif;font-weight:300;font-size:23px;line-height:1.3;color:#3B2B22}
.selb p em{color:#C2855E}
.selb__l{font-family:'Tenor Sans',Jost,sans-serif;font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:#3B2B22;text-decoration:none;border-bottom:1px solid #7E3F28;padding-bottom:4px;transition:color .3s}
.selb__l:hover{color:#C2855E}

/* Home search: currency between property and budget */
@media (min-width: 901px) {
  .search { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, .62fr) minmax(0, 1fr) auto; max-width: 960px; }
  .search label:nth-of-type(3) { border-right: 1px solid var(--ligne); }
  .search label:nth-of-type(4) { border-right: 0; }
}
/* ---------- Phones and tablets (Nov 2026) ---------- */
@media (max-width:900px){
.search{grid-template-columns:1fr 1fr;border-radius:22px;padding:8px}
.search label{padding:10px 16px;border-right:0;border-bottom:1px solid var(--ligne)}
.search label:nth-of-type(1){grid-column:span 2}
.search label:nth-of-type(2){border-right:1px solid var(--ligne);grid-column:auto}
.search label:nth-of-type(3){border-right:0;grid-column:auto}
.search label:nth-of-type(4){grid-column:span 2;border-bottom:0}
.search .btn{grid-column:span 2;width:100%;margin-top:6px}
.ab__grid{grid-template-columns:1fr;gap:56px}
.ab__vis{height:clamp(420px,110vw,620px)}
.ab__seal{right:auto;left:2%;top:0;width:118px;height:118px}
.isl2__in{grid-template-columns:1fr;gap:40px;padding-left:20px;padding-right:20px}
.isl2__txt{order:-1;max-width:none}
.isl2__col{height:clamp(440px,125vw,680px)}
.isl2__facts{gap:24px;flex-wrap:wrap}
.isl2__facts b{font-size:30px}
}
@media (max-width:900px){.hero__shade{background:linear-gradient(rgba(25,18,14,.38) 0%,rgba(25,18,14,.12) 28%,rgba(25,18,14,.42) 55%,rgba(25,18,14,.62) 100%)}}

@media (max-width:760px){.hero .label--rule{letter-spacing:.16em;font-size:10px;white-space:nowrap}.hero .h1 .l2 em{font-size:.8em}.aff__card{background:transparent!important;padding:20px 2px 0!important;border-radius:0!important}.aff__card::before{display:none!important}.aff__hl,.aff__f i{display:none}.isl2__facts{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 14px!important}.isl2__facts b{font-size:28px!important;white-space:nowrap}.isl2__facts div{font-size:9px!important;letter-spacing:.14em!important;line-height:1.5}.isl2__col{width:90%;margin:0 auto;height:clamp(300px,80vw,420px)!important}.isl2__it.rv{transition-delay:0s!important}.isl2__col:has(.is-in) .isl2__it.rv{opacity:1;transform:none}.isl2 + .fadeband{height:56px}}

@media (max-width:900px){.search label:nth-of-type(2){grid-column:span 2;border-right:0}.search label:nth-of-type(3){grid-column:auto;border-right:1px solid var(--ligne);border-bottom:0}.search label:nth-of-type(4){grid-column:auto;border-bottom:0}}
.map__sheet{display:none}
@media (max-width:820px){#areas .area-list{display:none}#areas .areas>div:not(.map):not(.map__sheet){order:-1}#areas .areas>div:not(.map):not(.map__sheet) p.muted{margin-bottom:18px!important}.map__sheet{order:1}.map__sheet .fvb{display:none}.map__sheet.is-on{display:block;width:250px;margin:4px auto 0}.map__sheet .map__ph{height:150px}.map__sheet .map__ph a{opacity:1;transform:rotate(calc(-5deg + var(--i) * 4deg))}.map__sheet .map__cap{white-space:normal;flex-wrap:wrap}}

.map__sp{display:none}.map__sp.is-on{display:block}

@media (max-width:760px){#drop{display:none!important}.news + .sep{padding-top:12px!important;padding-bottom:12px!important;height:auto!important;min-height:0!important}.news + .sep .sep__l{height:48px!important}}

@media (max-width:760px){.mapsec{background:linear-gradient(#FDFBF7 0,#F4ECE0 110px,#F4ECE0 60%,#FDFBF7 100%)!important}}

.hero .label--rule{text-shadow:0 1px 14px rgba(20,14,10,.5)}
