/* Self-hosted brand fonts (SIL Open Font License): Jost for the logo/display, Manrope for text. Variable woff2. */
/* Jost latin */
@font-face {
  font-family: 'Jost';
  font-style: normal;
  font-weight: 300 500;
  font-display: swap;
  src: url(/fonts/jost-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* Manrope greek */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 400 600;
  font-display: swap;
  src: url(/fonts/manrope-greek.woff2) format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* Manrope latin-ext */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 400 600;
  font-display: swap;
  src: url(/fonts/manrope-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* Manrope latin */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 400 600;
  font-display: swap;
  src: url(/fonts/manrope-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* Fallback with Manrope's widths, so text does not re-wrap (layout shift) when the web font arrives a moment later */
@font-face {
  font-family: 'Manrope Fallback';
  src: local('Arial'), local('ArialMT'), local('Roboto');
  size-adjust: 106%;
}

:root{color-scheme:light;
  --lime:#f3efe7; --paper:#faf8f3; --ink:#1c1b19; --ochre:#a8692a; --ochre-l:#d39a56; --sea:#1e4a55; --muted:#6b665c; --muted-2:#4c4840; --line:#e3dccf;
  --head:"Manrope","Manrope Fallback",sans-serif; --headw:500; --body:"Manrope","Manrope Fallback",sans-serif; --track:-.01em;
}
*{box-sizing:border-box;margin:0;padding:0}
body{background:var(--paper);color:var(--ink);font-family:var(--body);font-size:16px;line-height:1.6}
h1,h2,h3{font-family:var(--head);font-weight:var(--headw);letter-spacing:var(--track);line-height:1.15}
a{color:inherit;text-decoration:none}
.wrap{max-width:1180px;margin:0 auto;padding:0 24px}
img{display:block;width:100%;height:100%;object-fit:cover}
picture{display:contents}

/* header */
header{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:rgba(250,248,243,.94);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
header .wrap{display:flex;align-items:center;justify-content:space-between;height:72px;gap:16px}
nav{display:flex;gap:26px;font-size:14px}
nav a:hover{color:var(--ochre)}
.hright{display:flex;align-items:center;gap:16px;font-size:13px}
.btn{display:inline-block;background:var(--ink);color:var(--lime);padding:11px 20px;border-radius:2px;font-size:14px;font-weight:500;letter-spacing:.02em}
button.btn{border:0;font-family:var(--body);cursor:pointer}
.btn.o{background:transparent;color:var(--ink);border:1px solid var(--ink)}
.btn.ochre{background:var(--ochre);color:#fff}

/* hero */

section{padding:96px 0}
.eyebrow{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--ochre);margin-bottom:12px}
.sh{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:36px}
.sh h2{font-size:clamp(28px,3.2vw,42px);max-width:640px}
.sh a{font-size:14px;border-bottom:1px solid var(--ink);padding-bottom:2px}

/* villas */
.villas{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.v .ph{aspect-ratio:4/5;overflow:hidden;background:#ddd;position:relative}
.v .tag{position:absolute;top:12px;left:12px;background:var(--lime);font-size:11px;letter-spacing:.08em;text-transform:uppercase;padding:5px 8px}
.v h3{font-size:22px;margin-top:14px}
.v .meta{font-size:13px;color:var(--muted);margin-top:4px}
.v .price{font-size:14px;margin-top:8px}
.v .price b{font-weight:600}

/* why */
.why{background:var(--lime)}
.three{display:grid;grid-template-columns:repeat(3,1fr);gap:40px}
.three h3{font-size:22px;margin-bottom:8px}
.three p{color:#4c4840}
.num{font-family:var(--head);color:var(--ochre);font-size:15px;margin-bottom:10px}

/* owners */
.owners{background:var(--sea);color:var(--lime)}
.split{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.owners h2{font-size:clamp(30px,3.4vw,46px)}
.owners p{opacity:.9;margin:16px 0 26px;max-width:480px}
.owners ul{list-style:none;margin:0 0 28px}
.owners li{padding:10px 0;border-bottom:1px solid rgba(243,239,231,.2)}
.owners .ph{aspect-ratio:4/3;overflow:hidden}

/* real estate */
.re .cards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.re .c{border:1px solid var(--line);background:#fff;padding:26px}
.re .c h3{font-size:20px;margin-bottom:8px}
.re .c p{color:#4c4840;font-size:15px}
.soon{display:inline-block;font-size:11px;letter-spacing:.08em;text-transform:uppercase;background:var(--lime);padding:4px 8px;margin-bottom:14px}

/* guide */
.guide{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.g .ph{aspect-ratio:3/2;overflow:hidden}
.g h3{font-size:20px;margin-top:12px}
.g small{color:var(--muted)}

/* reviews */
.reviews{background:var(--lime)}
.q{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.q blockquote{font-family:var(--head);font-size:21px;line-height:1.4}
.q cite{display:block;font-style:normal;font-size:13px;color:var(--muted);margin-top:10px}

footer{background:var(--ink);color:var(--lime);padding:64px 0 32px;font-size:14px}
footer .cols{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:32px}
footer h4{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--ochre-l);margin-bottom:12px;font-weight:500}
footer li{list-style:none;margin:6px 0;opacity:.85}
footer .legal{border-top:1px solid #3a3835;margin-top:40px;padding-top:18px;font-size:12px;opacity:.7;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}

/* sitemap note */
.map{background:#fff;border-top:4px solid var(--ochre)}
.map .tree{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;font-size:14px}
.map .node{border:1px solid var(--line);padding:14px;background:var(--paper)}
.map .node b{display:block;margin-bottom:4px}
.map .node small{color:var(--muted);line-height:1.4;display:block}

@media (max-width:900px){
  nav{display:none}
  .villas{grid-template-columns:repeat(2,1fr)}
  .three,.re .cards,.guide,.q,.map .tree{grid-template-columns:1fr}
  .split{grid-template-columns:1fr}
  .panel{left:16px;right:16px;max-width:none}
  footer .cols{grid-template-columns:1fr 1fr}
}
footer .cols>div{min-width:0}footer li{overflow-wrap:anywhere}

:root{color-scheme:light}
html{background:var(--paper);padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
header{top:env(safe-area-inset-top,0px)}

html{-webkit-text-size-adjust:100%}
[hidden]{display:none!important}
.hright{white-space:nowrap}
@media (max-width:620px){.hright span{display:none}header .wrap{height:64px}}
body{margin:0}
.mock{background:var(--ink);color:var(--lime);font:12px Inter,sans-serif;text-align:center;padding:7px 16px;letter-spacing:.02em}
.mock b{color:var(--ochre-l);font-weight:500}
nav a.on{color:var(--ochre)}
.crumb{font-size:13px;color:var(--muted);padding:22px 0 0}
.crumb a:hover{color:var(--ink)}
.chip{display:inline-block;font-size:11px;letter-spacing:.08em;text-transform:uppercase;border:1px solid var(--line);padding:4px 8px;background:#fff}
.chip.ochre{border-color:var(--ochre);color:var(--ochre);background:transparent}
.todo{display:inline-block;font:11px Inter,sans-serif;background:#fff3e0;color:#8a5a1f;border:1px dashed #d9a35d;padding:1px 6px;margin-left:6px;vertical-align:middle;letter-spacing:0;text-transform:none}

/* villa title + gallery */
.vtitle{display:flex;justify-content:space-between;align-items:end;gap:24px;flex-wrap:wrap;padding:14px 0 26px}
.vtitle h1{font-size:clamp(40px,5vw,64px)}
.vtitle .tagline{font-size:19px;color:#4c4840;margin-top:6px}
.facts{display:flex;flex-wrap:wrap;gap:8px 22px;font-size:14px;color:#4c4840}
.facts span{display:flex;align-items:center;gap:8px}
.facts span::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--ochre)}
.gallery{display:grid;grid-template-columns:2fr 1fr 1fr;grid-template-rows:240px 240px;gap:8px;position:relative}
.gallery .g1{grid-row:1/3}
.gallery>div{overflow:hidden;background:#ddd;cursor:zoom-in}
.gallery img{transition:transform .5s ease}
.gallery>div:hover img{transform:scale(1.02)}
.gallery .all{position:absolute;right:14px;bottom:14px;background:#fff;color:var(--ink);font-size:13px;padding:9px 14px;border:1px solid var(--line);cursor:pointer}
.lb{position:fixed;inset:0;background:rgba(20,19,17,.94);z-index:100;display:flex;align-items:center;justify-content:center;padding:40px 16px}
.lb img{max-width:min(1200px,100%);max-height:82vh;width:auto;height:auto;object-fit:contain}
.lb .x,.lb .pv,.lb .nx{position:absolute;color:#fff;background:none;border:0;font-size:30px;cursor:pointer;padding:12px}
.lb .x{top:16px;right:16px}.lb .pv{left:8px}.lb .nx{right:8px}
.lb .cap{position:absolute;bottom:calc(18px + env(safe-area-inset-bottom,0px));left:16px;right:16px;text-align:center;color:#ddd;font-size:13px}

.subnav{position:sticky;top:calc(72px + env(safe-area-inset-top,0px));z-index:15;background:var(--paper);border-bottom:1px solid var(--line);margin-top:40px}
.subnav{max-width:100%;overflow:hidden}
.subnav .wrap{display:flex;gap:26px;overflow-x:auto;font-size:14px;height:52px;align-items:center;white-space:nowrap}
.subnav a{color:var(--muted)}.subnav a:hover{color:var(--ink)}

.vcols{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:64px;align-items:start;padding:48px 0 24px}
.block{padding:8px 0 48px;border-bottom:1px solid var(--line);margin-bottom:48px}
.block:last-child{border-bottom:0}
.block h2{font-size:30px;margin-bottom:18px}
.lede{font-size:19px;line-height:1.65;max-width:62ch}
.prose p{max-width:65ch;margin-bottom:14px;color:#3c3934}
.hl{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:28px}
.hl div{border-top:2px solid var(--ochre);padding-top:12px}
.hl b{display:block;font-family:var(--head);font-weight:500;font-size:17px;margin-bottom:4px}
.hl p{font-size:14px;color:#4c4840}
.rooms{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.room .ph{aspect-ratio:4/3;overflow:hidden;background:#ddd}
.room b{display:block;margin-top:10px;font-weight:600;font-size:15px}
.room small{color:var(--muted);font-size:13px;line-height:1.5;display:block;margin-top:2px}
.amen{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.amen h4{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--ochre);margin-bottom:10px;font-weight:500}
.amen li{list-style:none;padding:7px 0;border-bottom:1px solid var(--line);font-size:15px}
.map{position:relative;background:#e9e4d9;aspect-ratio:16/9;overflow:hidden;margin-bottom:18px}
.dist{display:grid;grid-template-columns:repeat(2,1fr);gap:0 28px}
.dist div{display:flex;justify-content:space-between;padding:10px 0;border-bottom:1px solid var(--line);font-size:15px}
.dist span:last-child{color:var(--muted);font-variant-numeric:tabular-nums}
table.prices{width:100%;border-collapse:collapse;font-size:15px;font-variant-numeric:tabular-nums}
table.prices th{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:500;text-align:left;padding:10px 12px;border-bottom:1px solid var(--ink)}
table.prices td{padding:13px 12px;border-bottom:1px solid var(--line)}
table.prices td:last-child,table.prices th:last-child{text-align:right}
table.prices tr.peak td{background:#f6efe3}
.note{font-size:13px;color:var(--muted);margin-top:12px;line-height:1.55}
.know{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}
.know div{background:#fff;border:1px solid var(--line);padding:20px}
.know b{display:block;margin-bottom:6px;font-weight:600}
.know p{font-size:14px;color:#4c4840}
.rev{display:flex;gap:40px;align-items:start;flex-wrap:wrap}
.score{font-family:var(--head);font-size:56px;line-height:1}
.score small{display:block;font-family:var(--body);font-size:13px;color:var(--muted);margin-top:6px}
.rev blockquote{font-family:var(--head);font-size:22px;line-height:1.45;max-width:30ch}
.rev cite{display:block;font-style:normal;font-size:13px;color:var(--muted);margin-top:10px}

.vcols>aside{position:sticky;top:calc(140px + env(safe-area-inset-top,0px));align-self:start}
.book{background:#fff;border:1px solid var(--line);padding:26px;box-shadow:0 12px 40px rgba(28,27,25,.06)}
.book .from{font-size:14px;color:var(--muted)}
.book .from b{font-family:var(--head);font-weight:500;font-size:30px;color:var(--ink)}
.book .grid2{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--line);margin:18px 0 0}
.book label{display:block;padding:10px 12px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.book label+label{border-left:1px solid var(--line)}
.book input,.book select{display:block;width:100%;border:0;background:none;font:15px var(--body);color:var(--ink);margin-top:3px;padding:0;letter-spacing:0;text-transform:none}
.book .full{grid-column:1/3;border-top:1px solid var(--line)}
.book .btn{width:100%;text-align:center;margin-top:16px;border:0;cursor:pointer;font-family:var(--body)}
.book .sum{margin-top:16px;font-size:14px}
.book .sum div{display:flex;justify-content:space-between;padding:6px 0;border-bottom:1px solid var(--line);font-variant-numeric:tabular-nums}
.book .sum div:last-child{border-bottom:0;font-weight:600}
.book .small{font-size:12px;color:var(--muted);margin-top:12px;line-height:1.5;text-align:center}
.wa{display:block;text-align:center;margin-top:12px;font-size:14px;border-top:1px solid var(--line);padding-top:14px}
.wa b{color:var(--sea)}
.fwa{position:fixed;right:16px;bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:40;background:var(--sea);color:#fff;border-radius:999px;padding:12px 18px;font-size:14px;box-shadow:0 8px 24px rgba(0,0,0,.18)}

/* owners */
.ohero{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center;padding:64px 0 80px}
.ohero h1{font-size:clamp(40px,5vw,62px)}
.ohero p{font-size:19px;color:#4c4840;margin:18px 0 28px;max-width:52ch}
.ohero .ph{aspect-ratio:4/5;overflow:hidden}
.ohero .ctas{display:flex;gap:12px;flex-wrap:wrap}
.trust{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.trust div{padding:22px 24px;font-size:15px}
.trust div+div{border-left:1px solid var(--line)}
.trust b{display:block;font-family:var(--head);font-weight:500;font-size:18px;margin-bottom:2px}
.care{display:grid;grid-template-columns:repeat(4,1fr);gap:28px 24px}
.care div b{display:block;font-family:var(--head);font-weight:500;font-size:18px;margin:10px 0 6px}
.care div p{font-size:14px;color:#4c4840}
.care .ic{width:28px;height:2px;background:var(--ochre)}
.steps{display:grid;grid-template-columns:repeat(5,1fr);gap:0;counter-reset:s}
.steps div{padding:0 20px 0 0;border-top:1px solid rgba(243,239,231,.35);padding-top:18px}
.steps .n{font-family:var(--head);color:var(--ochre-l);font-size:15px}
.steps b{display:block;font-family:var(--head);font-weight:500;font-size:19px;margin:8px 0 6px}
.steps p{font-size:14px;opacity:.85;padding-right:12px}
.two{display:grid;grid-template-columns:1fr 1fr;gap:40px}
.panelbox{background:#fff;border:1px solid var(--line);padding:30px}
.panelbox h3{font-size:24px;margin-bottom:12px}
.panelbox p{color:#4c4840;margin-bottom:10px}
.panelbox ul{list-style:none;margin-top:12px}
.panelbox li{padding:9px 0;border-bottom:1px solid var(--line);font-size:15px;display:flex;gap:10px}
.panelbox li::before{content:"";flex:0 0 6px;height:6px;border-radius:50%;background:var(--ochre);margin-top:9px}
.form{background:var(--lime);padding:36px;display:grid;grid-template-columns:1fr 1fr;gap:16px}
.form .full{grid-column:1/3}
.form label{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);display:block}
.form input,.form select,.form textarea{display:block;width:100%;margin-top:6px;border:1px solid var(--line);background:#fff;padding:12px;font:15px var(--body);color:var(--ink);border-radius:0}
.form textarea{min-height:90px;resize:vertical}
.form .btn{border:0;cursor:pointer;font-family:var(--body)}
.ok{background:#fff;border:1px solid var(--line);padding:24px;grid-column:1/3}
.faq details{border-bottom:1px solid var(--line);padding:18px 0}
.faq summary{cursor:pointer;font-family:var(--head);font-weight:500;font-size:19px;list-style:none;display:flex;justify-content:space-between;gap:16px}
.faq summary::after{content:"+";color:var(--ochre);font-size:22px;line-height:1}
.faq p{margin-top:10px;color:#4c4840;max-width:68ch}
.svc{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.svc div{border:1px solid var(--line);background:#fff;padding:22px}
.svc b{display:block;font-family:var(--head);font-weight:500;font-size:17px;margin-bottom:6px}
.svc p{font-size:14px;color:#4c4840}
.svc small{display:block;margin-top:10px;font-size:12px;color:var(--ochre)}

/* real estate */
.rebanner{background:#fff3e0;border-bottom:1px solid #ecd2a8;color:#6e4a16;font-size:14px;text-align:center;padding:10px 16px}
.rehero{padding:64px 0 36px}
.rehero h1{font-size:clamp(40px,5vw,62px);max-width:16ch}
.rehero p{font-size:19px;color:#4c4840;margin-top:16px;max-width:58ch}
.filters{display:flex;flex-wrap:wrap;gap:10px;align-items:center;padding:18px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-bottom:28px}
.filters button{font:14px var(--body);background:#fff;border:1px solid var(--line);padding:9px 14px;cursor:pointer;color:var(--ink)}
.filters button.on{background:var(--ink);color:var(--lime);border-color:var(--ink)}
.filters .sp{flex:1}
.filters select{font:14px var(--body);border:1px solid var(--line);background:#fff;padding:9px 10px;color:var(--ink)}
.list{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.lst .ph{aspect-ratio:4/3;overflow:hidden;position:relative;background:#ddd}
.lst .ex{position:absolute;top:10px;left:10px;background:#fff3e0;color:#6e4a16;font-size:11px;letter-spacing:.06em;text-transform:uppercase;padding:4px 8px}
.lst .typ{position:absolute;top:10px;right:10px;background:var(--lime);font-size:11px;letter-spacing:.08em;text-transform:uppercase;padding:4px 8px}
.lst h3{font-size:21px;margin-top:12px}
.lst .meta{font-size:13px;color:var(--muted);margin-top:4px;display:flex;flex-wrap:wrap;gap:4px 14px;font-variant-numeric:tabular-nums}
.lst .pr{margin-top:8px;font-size:15px;font-weight:600}
.lst .pr span{font-weight:400;color:var(--muted);font-size:13px}
.proc{display:grid;grid-template-columns:repeat(5,1fr);gap:20px}
.proc div{border-top:2px solid var(--ink);padding-top:14px}
.proc .n{font-family:var(--head);color:var(--ochre);font-size:14px}
.proc b{display:block;font-family:var(--head);font-weight:500;font-size:18px;margin:6px 0}
.proc p{font-size:14px;color:#4c4840}
.gv{background:var(--sea);color:var(--lime);padding:40px;display:grid;grid-template-columns:1fr 1fr;gap:40px}
.gv h2{font-size:clamp(28px,3vw,40px)}
.gv dl{display:grid;grid-template-columns:auto 1fr;gap:12px 20px;font-size:15px}
.gv dt{color:var(--ochre-l)}
.gv .note{color:rgba(243,239,231,.7)}
.sellgrid{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.sellgrid .ph{aspect-ratio:4/3;overflow:hidden}

@media (max-width:980px){
  .vcols{grid-template-columns:minmax(0,1fr);gap:24px}
  .vcols>aside{position:static}
  .care,.svc{grid-template-columns:repeat(2,1fr)}
  .steps,.proc{grid-template-columns:1fr 1fr;gap:24px}
  .list{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:700px){
  .gallery{grid-template-columns:1fr 1fr;grid-template-rows:220px 120px}
  .gallery .g1{grid-column:1/3;grid-row:1}
  .gallery .g4,.gallery .g5{display:none}
  .hl,.rooms,.amen,.know,.dist,.two,.trust,.ohero,.gv,.sellgrid,.list,.care,.svc,.steps,.proc,.rehero,.pfacts,.pcols{grid-template-columns:1fr!important}
  .trust div+div{border-left:0;border-top:1px solid var(--line)}
  .form{grid-template-columns:1fr;padding:22px}
  .form .full,.ok{grid-column:1}
  .ohero{padding-top:32px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}

/* from property.html */
.pcols{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:56px;align-items:start;padding:40px 0 24px}
.pcols>aside{position:sticky;top:calc(96px + env(safe-area-inset-top,0px));align-self:start}
.ptitle{display:flex;justify-content:space-between;align-items:end;gap:24px;flex-wrap:wrap;padding:14px 0 24px}
.ptitle h1{font-size:clamp(34px,4.4vw,56px);max-width:18ch}
.ptitle .price{font-family:var(--head);font-size:clamp(30px,3.4vw,44px);font-weight:500}
.ptitle .price small{display:block;font-family:var(--body);font-size:13px;color:var(--muted);font-weight:400;text-align:right}
.pfacts{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line);margin:28px 0 8px}
.pfacts div{border-right:1px solid var(--line);border-bottom:1px solid var(--line);padding:14px 16px}
.pfacts small{display:block;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.pfacts b{font-family:var(--head);font-weight:500;font-size:20px;font-variant-numeric:tabular-nums}
.check li{list-style:none;display:flex;gap:12px;padding:12px 0;border-bottom:1px solid var(--line);font-size:15px}
.check li span:first-child{flex:0 0 22px;height:22px;border-radius:50%;background:#e6efe9;color:#2f6b47;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:600}
.check li.wait span:first-child{background:#fff3e0;color:#8a5a1f}
.check li em{display:block;font-style:normal;color:var(--muted);font-size:13px}
table.cost{width:100%;border-collapse:collapse;font-size:15px;font-variant-numeric:tabular-nums}
table.cost td{padding:11px 0;border-bottom:1px solid var(--line)}
table.cost td:last-child{text-align:right}
table.cost tr.tot td{font-weight:600;border-bottom:0;border-top:1px solid var(--ink)}
.agent{background:#fff;border:1px solid var(--line);padding:24px;box-shadow:0 12px 40px rgba(28,27,25,.06)}
.agent .who{display:flex;gap:14px;align-items:center;padding-bottom:16px;border-bottom:1px solid var(--line);margin-bottom:16px}
.agent .av{width:46px;height:46px;border-radius:50%;background:var(--sea);color:var(--lime);display:flex;align-items:center;justify-content:center;font-family:Jost,sans-serif;font-weight:500}
.agent .av i{font-style:normal;color:var(--ochre-l)}
.agent label{display:block;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-top:12px}
.agent input,.agent select,.agent textarea{display:block;width:100%;margin-top:6px;border:1px solid var(--line);background:var(--paper);padding:11px;font:15px var(--body);color:var(--ink)}
.agent textarea{min-height:80px;resize:vertical}
.agent .btn{width:100%;text-align:center;border:0;cursor:pointer;margin-top:16px;font-family:var(--body)}
.agent .row{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}
.agent .row .btn{margin-top:0}
.gvnote{background:var(--lime);padding:16px 18px;font-size:14px;color:#4c4840;margin-top:18px}
.tour{position:relative;display:block;aspect-ratio:16/9;max-width:100%;overflow:hidden;background:var(--ink);color:#fff;text-decoration:none}
.tour img{width:100%;height:100%;object-fit:cover;opacity:.62;transition:transform .6s,opacity .3s}
.tour:hover img{transform:scale(1.03);opacity:.5}
.tour .in{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;text-align:center;padding:16px}
.tour .play{width:72px;height:72px;border-radius:50%;background:var(--ochre);display:flex;align-items:center;justify-content:center;box-shadow:0 10px 30px rgba(0,0,0,.3)}
.tour .play svg{margin-left:4px}
.tour b{font-size:20px;font-weight:600}
.tour span.s{font-size:14px;opacity:.85}
.tmodes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:14px}
.tmodes div{border:1px solid var(--line);padding:14px;font-size:14px;color:var(--muted)}
.tmodes b{display:block;color:var(--ink);font-size:15px;margin-bottom:4px}
.gallery .t3d{position:absolute;left:14px;bottom:14px;background:var(--ink);color:#fff;font-size:13px;font-weight:600;padding:9px 14px;text-decoration:none}
@media (max-width:640px){.tmodes{grid-template-columns:minmax(0,1fr)}.tour .play{width:52px;height:52px}.tour .in{gap:8px}.tour b{font-size:17px}.tour span.s{display:none}}
@media (max-width:980px){.pcols{grid-template-columns:minmax(0,1fr)}.pcols>aside{position:static}.pfacts{grid-template-columns:repeat(2,1fr)}}

/* ===== site additions ===== */
.skip{position:absolute;left:-999px;top:0;background:var(--ink);color:var(--lime);padding:10px 14px;z-index:200}.skip:focus{left:12px;top:12px}
:focus-visible{outline:2px solid var(--ochre);outline-offset:2px}
.lang a{color:var(--muted)}.lang a.on{color:var(--ink);font-weight:600}
.burger{display:none;background:none;border:0;font:15px var(--body);color:var(--ink);cursor:pointer;padding:8px}
@media (max-width:900px){.burger{display:block}nav.open{display:flex;position:absolute;top:100%;left:0;right:0;flex-direction:column;gap:0;background:var(--paper);border-bottom:1px solid var(--line);padding:6px 24px 14px}nav.open a{padding:12px 0;border-bottom:1px solid var(--line);font-size:16px}}
.page-hero{padding-block:56px 24px}.page-hero h1{font-size:clamp(36px,4.6vw,58px);max-width:20ch}.page-hero p{font-size:19px;color:#4c4840;margin-top:14px;max-width:60ch}
.content{max-width:760px}.content h2{font-size:28px;margin:40px 0 14px}.content h3{font-size:20px;margin:26px 0 8px}
.content p,.content li{color:#3c3934;margin-bottom:12px}.content .tbl{overflow-x:auto;margin:8px 0 24px}.content table{width:100%;border-collapse:collapse;font-size:15px;line-height:1.45}.content th,.content td{text-align:left;vertical-align:top;padding:10px 14px 10px 0;border-bottom:1px solid var(--line);color:#3c3934}.content th{font:600 12px Inter,sans-serif;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}.content td:first-child{font-weight:600;color:var(--ink)}@media (max-width:600px){.content table{font-size:14px}.content th,.content td{padding-right:10px}}.content ul,.content ol{padding-left:22px;margin-bottom:14px}.content a{border-bottom:1px solid var(--ochre)}
.todo{display:inline-block;font:12px Inter,sans-serif;background:#fff3e0;color:#8a5a1f;border:1px dashed #d9a35d;padding:1px 6px;letter-spacing:0;text-transform:none}
.article .lead{font-size:20px;line-height:1.6;color:#3c3934;margin:18px 0 26px;max-width:62ch}
.article .meta{font-size:13px;color:var(--muted)}
.draft{display:inline-block;font-size:11px;letter-spacing:.08em;text-transform:uppercase;background:#fff3e0;color:#8a5a1f;padding:3px 8px;margin-left:8px}
/* forms */
.field{display:block;margin-bottom:14px}.field>span{display:block;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:6px}
.field input,.field select,.field textarea{display:block;width:100%;border:1px solid var(--line);background:#fff;padding:12px;font:16px var(--body);color:var(--ink);border-radius:0}
.field textarea{min-height:110px;resize:vertical}
.field.err input,.field.err select,.field.err textarea{border-color:#b4472a}
.field .msg{display:block;color:#a13d22;font-size:13px;margin-top:6px}
.check-row{display:flex;gap:10px;align-items:flex-start;font-size:14px;color:#3c3934;margin:10px 0}.check-row input{margin-top:4px;width:18px;height:18px;flex:0 0 18px;accent-color:var(--ochre)}
.check-row.err{color:#a13d22}
.check-row{flex-wrap:wrap}.check-row>.msg{flex-basis:100%;padding-left:28px;margin-top:-4px;font-size:13px}
.field>.msg{text-transform:none;letter-spacing:0;margin-bottom:0;font-size:13px;color:#a13d22}
.hp{position:absolute;left:-5000px;width:1px;height:1px;overflow:hidden}
.formbox{background:var(--lime);padding:32px}.formbox .grid2f{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}
.formbox .btn{border:0;cursor:pointer;font-family:var(--body)}
.notice{border:1px solid var(--line);background:#fff;padding:18px 20px;margin:16px 0}.notice.ok{border-color:#9cc3a8;background:#f2f8f3}.notice.bad{border-color:#e0b4a4;background:#fbf1ed}
.btn[disabled]{opacity:.55;cursor:not-allowed}
/* booking flow */
.steps-bar{display:flex;gap:0;margin:26px 0 30px;border-bottom:1px solid var(--line);overflow-x:auto}
.steps-bar li{list-style:none;padding:12px 18px 12px 0;margin-right:18px;font-size:14px;color:var(--muted);border-bottom:2px solid transparent;white-space:nowrap}
.steps-bar li b{font-family:var(--head);font-weight:500;color:var(--ochre);margin-right:8px}
.steps-bar li.on{color:var(--ink);border-bottom-color:var(--ink)}.steps-bar li.done{color:var(--ink)}
.bk{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:56px;align-items:start;padding-bottom:80px}
.bk aside{position:sticky;top:calc(96px + env(safe-area-inset-top,0px))}
.sumcard{background:#fff;border:1px solid var(--line);box-shadow:0 12px 40px rgba(28,27,25,.06)}
.sumcard .ph{aspect-ratio:16/9;overflow:hidden}.sumcard .in{padding:22px}
.sumcard h3{font-size:22px}.sumcard .sub{font-size:13px;color:var(--muted);margin-top:2px}
.lines{margin-top:14px;font-size:14px;font-variant-numeric:tabular-nums}
.lines div{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid var(--line)}
.lines div.tot{font-weight:600;border-bottom:0;border-top:1px solid var(--ink);margin-top:4px}
.lines div.now{color:var(--ochre);font-weight:600}
.cal-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:14px}
.cal-head button{background:#fff;border:1px solid var(--line);width:40px;height:40px;cursor:pointer;font-size:18px}
.cal-head button:disabled{opacity:.35;cursor:default}
.cal{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:26px}
.month h4{font-family:var(--head);font-weight:500;font-size:18px;margin-bottom:10px}
.dow,.days{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));text-align:center}
.dow span{font-size:11px;color:var(--muted);letter-spacing:.06em;padding:6px 0}
.days button,.days span{aspect-ratio:1;display:flex;align-items:center;justify-content:center;font:14px var(--body);border:0;background:none;color:var(--ink);font-variant-numeric:tabular-nums;position:relative}
.days button{cursor:pointer}
.days .sat{font-weight:600}.days .sat:not(:disabled):hover{background:var(--lime)}
.days .off{color:#c9c2b4;cursor:default}
.days .busy{color:#b7aea0;text-decoration:line-through;cursor:not-allowed;background:repeating-linear-gradient(135deg,transparent 0 5px,#efe9dd 5px 7px)}
.days .inr{background:#efe4d3}.days .start,.days .end{background:var(--ink);color:var(--lime)}
.legend{display:flex;gap:18px;flex-wrap:wrap;font-size:13px;color:var(--muted);margin-top:16px}
.legend i{display:inline-block;width:14px;height:14px;vertical-align:-2px;margin-right:6px;border:1px solid var(--line)}
.weeks{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0 6px}
.weeks button{font:14px var(--body);border:1px solid var(--line);background:#fff;padding:9px 14px;cursor:pointer}
.weeks button.on{background:var(--ink);color:var(--lime);border-color:var(--ink)}
.guests{display:flex;align-items:center;gap:14px;margin-top:10px}.guests button{width:38px;height:38px;border:1px solid var(--line);background:#fff;font-size:18px;cursor:pointer}
.guests b{min-width:24px;text-align:center;font-variant-numeric:tabular-nums}
.paybox{border:1px solid var(--line);background:#fff;padding:22px;margin:18px 0}
.paybox .lock{font-size:13px;color:var(--muted)}
.timeline{list-style:none;margin:18px 0;border-left:2px solid var(--line);padding-left:20px}
.timeline li{position:relative;padding:0 0 18px}.timeline li::before{content:"";position:absolute;left:-27px;top:6px;width:12px;height:12px;border-radius:50%;background:var(--paper);border:2px solid var(--ochre)}
.timeline li.done::before{background:var(--ochre)}.timeline b{display:block}
.timeline span{font-size:14px;color:var(--muted)}
.estim{background:#fff;border:1px solid var(--line);padding:28px}
.estim .out{font-family:var(--head);font-size:38px;margin:10px 0 4px}
.estim input[type=range]{width:100%;accent-color:var(--ochre)}
.mapbtn{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:10px;width:100%;height:100%;border:0;background:none;cursor:pointer;font:15px var(--body);color:var(--ink)}
.map iframe{width:100%;height:100%;border:0}
.cards3{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.card{background:#fff;border:1px solid var(--line);padding:26px}.card h3{font-size:20px;margin-bottom:8px}.card p{color:#4c4840;font-size:15px}
.nf{padding-block:120px;text-align:center}.nf>a.btn{margin:0 4px 10px}.nf h1{font-size:clamp(40px,6vw,72px)}
@media (max-width:980px){.bk{grid-template-columns:minmax(0,1fr);gap:24px}.bk aside{position:static;order:-1}.cards3{grid-template-columns:1fr}}
@media (max-width:700px){.cal{grid-template-columns:1fr}.formbox{padding:20px}.formbox .grid2f{grid-template-columns:1fr}.pcols{grid-template-columns:1fr!important}}
/* phones: compact header, steps bar and booking summary */
@media (max-width:560px){
  .hright{gap:10px}.hright .btn{padding:9px 13px;font-size:13px}.burger{padding:8px 0 8px 4px}
  header .lang{display:none}nav.open .lang-m{display:block}
  .steps-bar li{padding-right:0;margin-right:14px}.steps-bar li:not(.on){font-size:0}.steps-bar li:not(.on) b{font-size:14px;margin:0}
  .bk aside .ph{display:none}
}
.lang-m{display:none}

/* ---------- structure layer (2026-10-10): breadcrumbs, FAQ, articles, hubs ---------- */
.crumbs{padding-top:22px}.crumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:6px;font-size:13px;color:var(--muted)}
.crumbs li+li::before{content:"/";margin-right:6px;color:var(--line)}
.crumbs a{color:var(--muted)}.crumbs a:hover{color:var(--ink)}.crumbs [aria-current]{color:var(--ink)}
.crumbs+.wrap .page-hero,.crumbs+.page-hero{padding-top:28px}
.sec{padding:40px 0}
.faq{border-top:1px solid var(--line);margin-top:8px}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;list-style:none;padding:18px 36px 18px 0;font-weight:500;font-size:17px;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:4px;top:14px;font-size:22px;color:var(--ochre);transition:transform .2s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details>div{padding:0 0 20px;color:#3c3934;max-width:68ch}
.formtitle{font-size:24px;margin-bottom:6px}
.vname{font-size:20px;margin-top:14px}
.vh1sub{font-size:.5em;color:var(--muted);font-weight:400;letter-spacing:0;display:inline-block;margin-left:4px;vertical-align:middle}
a.ul,.ul{border-bottom:1px solid var(--ochre)}
.booktitle{font-size:clamp(34px,4vw,50px);margin-top:14px}
footer .fh{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--ochre-l);margin-bottom:12px;font-weight:500;font-family:var(--body)}
footer .cols{grid-template-columns:1.4fr 1fr 1.2fr 1fr 1.1fr}
.villas.n1{grid-template-columns:minmax(0,420px)}.villas.n2{grid-template-columns:repeat(2,1fr)}.villas.n3{grid-template-columns:repeat(3,1fr)}
.guide.g2{grid-template-columns:repeat(2,1fr)}
.gallery>button{border:0;padding:0;overflow:hidden;background:#ddd;cursor:zoom-in;display:block}
.gallery>button:hover img{transform:scale(1.02)}
.gallery>button:focus-visible{outline:3px solid var(--ochre);outline-offset:-3px}
.hl h3,.room h3,.know h3,.amen h3{font-size:17px;font-weight:500;margin-bottom:4px}
.amen h3{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:10px}
.rev figure{margin:0}.rev figcaption{font-size:13px;color:var(--muted);margin-top:8px;font-style:normal}
/* article */
.art-head{padding:28px 24px 0;max-width:900px}
.art-head h1{font-size:clamp(36px,5vw,62px);max-width:18ch;margin-top:10px;text-wrap:balance}
.art-head .lead{font-size:21px;line-height:1.55;color:#3c3934;margin:20px 0 14px;max-width:60ch}
.art-head .meta{font-size:13px;color:var(--muted)}
.art-hero{margin-top:30px;max-width:1180px}
.art-hero img{aspect-ratio:16/8;height:auto;width:100%;object-fit:cover}
.credit{font-size:12px;color:var(--muted);margin-top:8px}.credit a{border-bottom:1px solid var(--line)}
.art-body{margin:16px auto 0;max-width:720px;font-size:17.5px;line-height:1.75}
.art-body p,.art-body li{color:#2f2c28}
.art-body h2{font-size:30px;margin:48px 0 14px}
.article .content{margin-left:auto;margin-right:auto}
.article>.wrap>.content h2{font-size:30px}
/* hubs */
.feature{display:grid;grid-template-columns:1.3fr 1fr;gap:0;background:#fff;border:1px solid var(--line)}
.feature .ph{aspect-ratio:4/3;overflow:hidden}.feature .ph img{transition:transform .6s ease}.feature:hover .ph img{transform:scale(1.02)}
.feature .txt{padding:40px;display:flex;flex-direction:column;justify-content:center;gap:14px}
.feature h2{font-size:clamp(28px,3vw,40px)}.feature p{color:var(--muted-2)}.feature .btn{align-self:flex-start;margin-top:8px}
.coastband .ph{aspect-ratio:4/3;overflow:hidden}.coastband h2{font-size:clamp(28px,3.2vw,42px);margin:10px 0 14px}.coastband .lede{color:var(--muted-2);margin-bottom:24px;font-size:18px}
@media (max-width:900px){
  footer .cols{grid-template-columns:1fr 1fr}
  .feature{grid-template-columns:1fr}.feature .txt{padding:26px}
  .villas.n3,.villas.n2{grid-template-columns:repeat(2,1fr)}.guide.g2{grid-template-columns:1fr}
  .art-hero img{aspect-ratio:4/3}
}
@media (max-width:560px){
  .villas.n3,.villas.n2,.villas.n1{grid-template-columns:1fr}
  .art-body{font-size:17px}.art-head{padding-top:18px}
  footer .cols{grid-template-columns:1fr}
}
/* components layer: editorial doc sections, lede, notice, flexible grids */
.docsec{padding:34px 0}
.doc{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2.1fr);gap:48px;padding-top:34px;position:relative}
/* the hairline spans the content box only, so it lines up with the text (not the .wrap padding) */
.doc::before{content:"";position:absolute;top:0;left:24px;right:24px;border-top:1px solid var(--line)}
.doc>h2{font-size:clamp(24px,2.4vw,30px);position:sticky;top:110px;align-self:start}
.doc .content{max-width:68ch}
.ledeblock{max-width:780px}.ledeblock h2{font-size:clamp(26px,3vw,38px);margin-bottom:14px}.ledeblock p{font-size:20px;line-height:1.6;color:#3c3934;margin-bottom:14px}
.noticebar{background:#fff3e0;border:1px solid #ecd2a8;color:#6e4a16;font-size:15px;padding:14px 18px;margin:6px 0 10px}
.noticebar p{display:inline}
.ohp p{font-size:19px;color:var(--muted-2);margin:18px 0 0;max-width:52ch}.ohero .ctas{margin-top:28px}
.steps{grid-template-columns:repeat(var(--n,5),minmax(0,1fr))}
.proc{grid-template-columns:repeat(var(--n,5),minmax(0,1fr))}
.svc{grid-template-columns:repeat(var(--n,4),minmax(0,1fr))}.svc div p{margin-bottom:8px}
.care.c3{grid-template-columns:repeat(3,1fr)}
.panelbox .ph3{font-size:24px;margin-bottom:12px}
.panelbox ul li span{flex:1}
.trust div p{display:inline}
.why .whyh{font-size:clamp(28px,3vw,40px);margin:6px 0 34px;max-width:22ch}
.re a.c{display:block;transition:border-color .2s}.re a.c:hover{border-color:var(--ink)}
.re .soon{display:inline-block;font-size:11px;letter-spacing:.1em;text-transform:uppercase;background:var(--lime);padding:4px 8px;margin-bottom:12px;color:var(--muted-2)}
.split2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.95fr);gap:48px;align-items:center}
.split2 .ph{aspect-ratio:4/3;overflow:hidden}
.gv p{opacity:.92;margin-bottom:10px}.gv a.btn{opacity:1}
@media (max-width:980px){
  .steps,.proc{grid-template-columns:repeat(2,minmax(0,1fr));gap:26px 20px}
  .svc,.care,.care.c3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .doc{grid-template-columns:1fr;gap:12px}.doc>h2{position:static}
  .split2,.sellgrid,.ohero,.gv{grid-template-columns:1fr}
  .trust{grid-template-columns:1fr}.trust div+div{border-left:0;border-top:1px solid var(--line)}
}
@media (max-width:560px){.steps,.proc,.svc,.care,.care.c3{grid-template-columns:1fr}.ohero{padding:28px 0 40px;gap:28px}}
/* villa page: map placeholder (mockup), highlights grid, subnav alignment */
.mapph{background-color:#efe9dd;background-image:linear-gradient(rgba(168,105,42,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(168,105,42,.08) 1px,transparent 1px);background-size:28px 28px}
.mapph .mapbtn{background:none;border:0;width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;cursor:pointer;color:var(--ink);font:inherit}
.mapph .ring{width:120px;height:120px;border-radius:50%;border:1.5px dashed rgba(168,105,42,.55);background:rgba(168,105,42,.08);display:grid;place-items:center;margin-bottom:8px;transition:transform .3s}
.mapph .ring i{width:10px;height:10px;border-radius:50%;background:var(--ochre)}
.mapph .mapbtn:hover .ring{transform:scale(1.05)}
.mapph small{color:var(--muted)}
.hl{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:22px}
.subnav .wrap{justify-content:flex-start}
/* ---------- demo / island-wide layer: filters, chips, areas, property agent, hero slides ---------- */
.vfilters{position:sticky;top:calc(72px + env(safe-area-inset-top,0px));z-index:12;background:rgba(250,248,243,.96);backdrop-filter:blur(6px);border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-top:18px}
.fbar,.filters{display:flex;flex-wrap:wrap;gap:12px 18px;align-items:end;padding:14px 0}
.fbar label,.filters label{display:flex;flex-direction:column;gap:4px;font-size:15px}
.fbar small,.filters small{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.fbar select,.filters select{font:15px var(--body);border:1px solid var(--line);background:#fff;padding:9px 30px 9px 12px;color:var(--ink);border-radius:0;min-width:150px}
.fbar .count,.filters .count{margin-left:auto;font-size:14px;color:var(--muted);align-self:center}
.filters{border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin:28px 0}
.filters .kinds{display:flex;flex-wrap:wrap;gap:8px;align-self:center}
.filters .kinds button{font:14px var(--body);background:#fff;border:1px solid var(--line);padding:9px 14px;cursor:pointer;color:var(--ink)}
.filters .kinds button.on{background:var(--ink);color:var(--lime);border-color:var(--ink)}
.filters .sp{flex:1}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0 4px}
.chip{border:1px solid var(--line);background:#fff;padding:8px 14px;font-size:14px;transition:border-color .2s}
.chip span{color:var(--muted);margin-left:4px}.chip:hover,.chip.on{border-color:var(--ink)}.chip.on{background:var(--ink);color:var(--lime)}.chip.on span{color:var(--ochre-l)}
.linkbtn{background:none;border:0;border-bottom:1px solid var(--ochre);font:inherit;cursor:pointer;color:var(--ink);padding:0}
[hidden]{display:none!important}
.areahero{position:relative;height:min(62vh,560px);overflow:hidden;color:#fff}
.areahero>picture img,.areahero>img{position:absolute;inset:0}
.areahero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,18,15,.05) 30%,rgba(20,18,15,.6))}
.areahero .txt{position:absolute;left:0;right:0;bottom:40px;z-index:2}.areahero h1{font-size:clamp(38px,5.4vw,70px);max-width:16ch;text-wrap:balance}.areahero .eyebrow{color:#f3d9b5}
.areahero .credit{position:absolute;right:12px;bottom:8px;z-index:2;color:rgba(255,255,255,.75)}.areahero .credit a{border-color:rgba(255,255,255,.4)}
.areaintro{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:56px;align-items:start}
.areaintro .lede{font-size:21px;line-height:1.6;color:#2f2c28}
.bestfor ul{list-style:none;margin-top:10px}.bestfor li{padding:12px 0;border-bottom:1px solid var(--line);font-size:16px}
.areas-sec{padding:72px 0}
.areagrid{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:240px;gap:14px}
.areagrid .ac{position:relative;overflow:hidden;color:#fff}.areagrid .ac.big{grid-column:span 2;grid-row:span 2}
.areagrid .ac img{transition:transform .8s ease}.areagrid .ac:hover img{transform:scale(1.04)}
.areagrid .ac::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(20,18,15,.62))}
.areagrid .ac span{position:absolute;left:18px;bottom:16px;z-index:2;display:flex;flex-direction:column}
.areagrid .ac b{font-family:var(--head);font-weight:500;font-size:22px}.areagrid .ac.big b{font-size:34px}.areagrid .ac small{opacity:.85;font-size:13px}
.agentcard{display:flex;gap:14px;align-items:center;margin-top:18px;padding:16px;border:1px solid var(--line);background:#fff}
.agentcard .av{width:48px;height:48px;border-radius:50%;background:var(--ink);color:var(--lime);display:grid;place-items:center;font-family:Jost,var(--head);font-size:20px}
.agentcard .av i{font-style:normal;color:var(--ochre-l)}.agentcard small{display:block;color:var(--muted);font-size:13px}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:10px}.row2 .btn{text-align:center}
.pcols aside{position:sticky;top:calc(96px + env(safe-area-inset-top,0px));align-self:start}
.price small{display:block;font-size:14px;color:var(--muted);font-weight:400;margin-top:4px}
@media (max-width:900px){
  .areagrid{grid-template-columns:repeat(2,1fr);grid-auto-rows:180px}.areaintro{grid-template-columns:1fr;gap:24px}
  .vfilters{position:static}.fbar select,.filters select{min-width:0;width:100%}.fbar label,.filters label{flex:1 1 140px}
  .pcols aside{position:static}
}
@media (max-width:560px){.areagrid .ac.big{grid-column:span 2;grid-row:span 1}.fbar .count,.filters .count{margin-left:0;width:100%}}
.revwrap{display:grid;grid-template-columns:auto minmax(0,1fr);gap:40px;align-items:start}
.revwrap .score{font-family:var(--head);font-size:56px;line-height:1}.revwrap .score small{display:block;font-family:var(--body);font-size:13px;color:var(--muted);margin-top:6px}
.revwrap .stars{display:block;color:var(--ochre);font-size:16px;letter-spacing:2px;margin-top:6px}
.rev{display:grid;gap:26px}.rev blockquote{font-family:var(--head);font-size:20px;line-height:1.45}
@media (max-width:700px){.revwrap{grid-template-columns:1fr;gap:18px}}
@media (max-width:560px){header .wrap>a svg{width:150px;height:28px}.fwa{bottom:calc(14px + env(safe-area-inset-bottom,0px));right:12px}}
/* header on small phones: logo + favourites heart + Κράτηση + Μενού must fit 360px (and 320px without the heart) */
@media (max-width:420px){header .wrap{gap:10px}
  header .wrap:has(.hfav:not([hidden]))>a svg{width:124px;height:23px}
  header .wrap:has(.hfav:not([hidden])) .hright{gap:6px}
  header .wrap:has(.hfav:not([hidden])) .hfav{width:34px}
  header .wrap:has(.hfav:not([hidden])) .hright .btn{padding:9px 11px}}
@media (max-width:340px){header .wrap>a svg{width:124px;height:23px}.hright{gap:6px}.hright .btn{padding:9px 11px}
  header .wrap:has(.hfav:not([hidden])) .hright .btn{display:none}}
.rv{opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1)}.rv.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.rv{opacity:1;transform:none}}
.v .ph img,.g .ph img,.lst .ph img{transition:transform .8s ease}.v:hover .ph img,.g:hover .ph img,.lst:hover .ph img{transform:scale(1.035)}
.v .ph,.g .ph,.lst .ph{overflow:hidden}
.ccards{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.ccards div{padding:20px 22px}.ccards div+div{border-left:1px solid var(--line)}
.ccards small{display:block;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:4px}.ccards b{font-weight:500;font-size:17px}
@media (max-width:700px){.ccards div+div{border-left:0;border-top:1px solid var(--line)}}
.tablewrap{overflow-x:auto}table.credits{width:100%;border-collapse:collapse;font-size:14px}
table.credits th{text-align:left;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);padding:8px 10px;border-bottom:1px solid var(--line)}
table.credits td{padding:8px 10px;border-bottom:1px solid var(--line);vertical-align:middle}.credits .cimg{width:96px}.credits .cimg img{width:84px;height:56px}
/* phones: each credit is a small card (photo left; subject, photographer, licence stacked) instead of a 4-column table */
@media (max-width:600px){
  table.credits,table.credits tbody{display:block}table.credits thead{display:none}
  table.credits tr{display:grid;grid-template-columns:84px minmax(0,1fr);column-gap:14px;row-gap:2px;padding:12px 0;border-bottom:1px solid var(--line)}
  table.credits td{display:block;padding:0;border:0;overflow-wrap:anywhere}
  table.credits td.cimg{grid-row:1/span 3;width:auto}
  table.credits td:nth-child(n+3){font-size:13px;color:var(--muted)}
}
/* accessibility (WCAG AA): small ochre text and ochre buttons use a deeper tone of the brand ochre; decorative lines keep --ochre */
:root{--ochre-t:#8f5a22;--ochre-btn:#94591f;--ochre-lt:#e6b87c}
.eyebrow,.num,.proc .n,.steps-bar li b,.svc small,.chip.on span,.faq summary::after{color:var(--ochre-t)}
.btn.ochre{background:var(--ochre-btn)}.btn.ochre:hover{background:#7f4b19}
.owners .eyebrow,.gv .eyebrow,.gv dt,.steps .n,footer .fh,.areahero .eyebrow{color:var(--ochre-lt)!important}
.btn{transition:background .2s,color .2s,border-color .2s}.btn.o:hover{background:var(--ink);color:var(--lime)}
a:focus-visible,button:focus-visible,select:focus-visible,input:focus-visible,textarea:focus-visible,summary:focus-visible{outline:2px solid var(--ochre-t);outline-offset:2px}
.longfact{margin:-14px 0 28px;font-size:15px;color:var(--muted-2)}.longfact small{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-right:6px}
.chip{text-transform:none;letter-spacing:0}
@media (max-width:700px){
  .chips{flex-wrap:nowrap;overflow-x:auto;margin-inline:-24px;padding:2px 24px 8px;scrollbar-width:none}.chips::-webkit-scrollbar{display:none}.chip{white-space:nowrap;flex:0 0 auto}
  .pfacts{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .vh1sub{display:block;margin:6px 0 0;font-size:.42em}.vh1sub .cm{display:none}
}

/* ===================== foundations (redesign step 1, 2026-10-10) =====================
   Type tokens, the header over a hero photo, the floating WhatsApp button, reveals, view transitions and the bottom sheet.
   New page sections build on these; keep them scoped (fd- / sheet / hdr-) and inside .wrap. */

/* --- type tokens: display / H1 / H2 / H3, body 17px, nothing that is read as text under 15px --- */
:root{
  --fs-display:clamp(44px,7.2vw,104px); --fs-h1:clamp(36px,4.8vw,62px); --fs-h2:clamp(30px,4.2vw,60px); --fs-h3:22px;
  --fs-body:17px; --lh-body:1.65; --fs-min:15px; --fs-label:12px;
  --w-display:400; --w-h2:400; --w-h3:600; --tr-display:-.03em; --tr-h2:-.02em;
  --ochre-t:#8f5a22;   /* small ochre text (BRAND.md); #a8692a stays for buttons, dots and lines */
  --hh:72px;           /* header height */
}
/* Greek words run longer: a smaller clamp keeps H1s to two or three lines */
html[lang=el]{--fs-display:clamp(38px,6.2vw,88px); --fs-h1:clamp(32px,4.2vw,54px); --fs-h2:clamp(28px,3.8vw,52px)}
@media (max-width:620px){:root{--hh:64px}}
body{font-size:var(--fs-body);line-height:var(--lh-body)}
.t-display{font-family:var(--head);font-size:var(--fs-display);font-weight:var(--w-display);letter-spacing:var(--tr-display);line-height:1.02;text-wrap:balance}
.t-h1{font-size:var(--fs-h1);text-wrap:balance}
.t-h2{font-size:var(--fs-h2);font-weight:var(--w-h2);letter-spacing:var(--tr-h2);line-height:1.08;text-wrap:balance}
.t-h3{font-size:var(--fs-h3);font-weight:var(--w-h3);letter-spacing:-.005em;line-height:1.25}
.t-small{font-size:var(--fs-min)}
.t-label{font-size:var(--fs-label);letter-spacing:.14em;text-transform:uppercase;color:var(--ochre-t)}
.tnum{font-variant-numeric:tabular-nums}
/* applied to the existing templates */
.page-hero h1,.ohero h1,.rehero h1,.art-head h1{font-size:var(--fs-h1)}
.sh h2,.why .whyh{font-size:var(--fs-h2);font-weight:var(--w-h2);letter-spacing:var(--tr-h2);line-height:1.08;max-width:20ch;text-wrap:balance}
.three h3,.re .c h3,.card h3,.care div b,.proc b,.steps b,.svc b{font-size:var(--fs-h3);letter-spacing:-.005em;line-height:1.25}
.care div p,.steps p,.proc p,.svc p,.hl p,.know p,.room small,.note,.tmodes div,.gvnote,.check-row,.v .meta,.v .price,.lst .meta,.mapph small,.book .small{font-size:var(--fs-min)}
.v .price,.price,.lst .pr,.pfacts b,.book .from,.score,.estim .out,.lines,.dist span:last-child{font-variant-numeric:tabular-nums}
nav a:hover,nav a.on,.lines div.now,.chip.ochre,.amen h4{color:var(--ochre-t)}
.agentcard img.av{flex:0 0 48px;width:48px;height:48px;border-radius:50%}

/* --- header: one palette, swapped as a whole (paper by default; white over a hero photo) --- */
header{--h-fg:var(--ink);--h-muted:var(--muted);--h-hover:var(--ochre-t);--h-logo:#1c1b19;--h-acc:#a8692a;--h-btn-bg:var(--ink);--h-btn-fg:var(--lime);
  color:var(--h-fg);transition:background-color .3s ease,border-color .3s ease,color .3s ease}
header .logo{display:block;color:inherit}
header .logo text{fill:var(--h-logo);transition:fill .3s ease}header .logo .acc{fill:var(--h-acc)}
header nav a,header .burger{color:var(--h-fg)}
header nav a:hover,header nav a.on{color:var(--h-hover)}
header .lang a{color:var(--h-muted)}header .lang a.on{color:var(--h-fg)}
header .hright>.btn{background:var(--h-btn-bg);color:var(--h-btn-fg)}
/* body.over-hero: the page opens on a full-bleed photo ([data-hero]); the header floats over it, transparent, and turns
   paper once the photo has scrolled under it (app.js adds .hdr-solid via a sentinel) or while the menu is open.
   Without JS the <noscript> style in layout() keeps the header paper. */
body.over-hero header{margin-bottom:calc(-1px - var(--hh));background:linear-gradient(rgba(20,18,15,.42),rgba(20,18,15,0));border-bottom-color:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;
  --h-fg:#fff;--h-muted:rgba(255,255,255,.8);--h-hover:#f3d9b5;--h-logo:#fff;--h-acc:#fff;--h-btn-bg:#fff;--h-btn-fg:var(--ink)}
body.over-hero.hdr-solid header,body.over-hero.menu-open header{background:rgba(250,248,243,.94);border-bottom-color:var(--line);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  --h-fg:var(--ink);--h-muted:var(--muted);--h-hover:var(--ochre-t);--h-logo:#1c1b19;--h-acc:#a8692a;--h-btn-bg:var(--ink);--h-btn-fg:var(--lime)}
body.over-hero header:has(nav.open){background:rgba(250,248,243,.94);border-bottom-color:var(--line);--h-fg:var(--ink);--h-muted:var(--muted);--h-hover:var(--ochre-t);--h-logo:#1c1b19;--h-acc:#a8692a;--h-btn-bg:var(--ink);--h-btn-fg:var(--lime)}
body.over-hero:not(.hdr-solid):not(.menu-open) header a:focus-visible,body.over-hero:not(.hdr-solid):not(.menu-open) header button:focus-visible{outline-color:#fff}
.hdr-sentinel{position:absolute;left:0;bottom:var(--hh);width:1px;height:1px;pointer-events:none;visibility:hidden}

/* --- floating WhatsApp: appears after 600px of scroll, hides while a [data-nofwa] block (hero, search, form, sticky bar) is on screen (app.js) --- */
.fwa{display:inline-flex;align-items:center;gap:8px;opacity:0;visibility:hidden;transform:translateY(10px);transition:opacity .25s ease,transform .25s ease,visibility 0s linear .25s}
.fwa.on{opacity:1;visibility:visible;transform:none;transition:opacity .25s ease,transform .25s ease}
.fwa svg{flex:0 0 auto;width:20px;height:20px}
.fwa:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
@media (max-width:700px){
  .fwa{width:48px;height:48px;padding:0;justify-content:center;border-radius:50%}
  .fwa svg{width:24px;height:24px}
  .fwa span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
}

/* --- reveals: .rv (fade up) and .rv-clip (photo unveiled top to bottom), once, below the fold only (app.js); off with reduced motion --- */
.rv-clip{clip-path:inset(0 0 100% 0);transition:clip-path .9s cubic-bezier(.2,.7,.2,1)}.rv-clip.in{clip-path:inset(0 0 0 0)}
@media (prefers-reduced-motion:reduce){.rv-clip{clip-path:none}}

/* --- view transitions between pages (Chrome/Edge/Safari 18+; other browsers just navigate). A villa card's photo grows into
   the villa page's first photo: app.js names the clicked card 'vt-hero' on pageswap; the villa page names its first photo. --- */
@media (prefers-reduced-motion:no-preference){@view-transition{navigation:auto}}
::view-transition-old(root),::view-transition-new(root){animation-duration:.26s}
::view-transition-group(vt-hero){animation-duration:.42s;animation-timing-function:cubic-bezier(.2,.7,.2,1)}
::view-transition-old(vt-hero),::view-transition-new(vt-hero){height:100%;object-fit:cover;overflow:clip}
@media (prefers-reduced-motion:reduce){::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none!important}}

/* --- bottom sheet on <dialog class="sheet"> (scrim, Esc, focus back to the opener): a sheet from the bottom on phones,
   a centred panel from 701px. Markup: <button data-sheet="id" aria-haspopup="dialog">…</button>
   <dialog class="sheet" id="id" aria-labelledby="id-t"><div class="sheet-head"><h2 id="id-t">…</h2><button class="sheet-x" data-sheet-close>…</button></div><div class="sheet-body">…</div></dialog>
   Openers should be links or controls that still work without JS (the sheet only re-hosts content). --- */
dialog.sheet{position:fixed;inset:auto 0 0 0;margin:0;width:100%;max-width:none;max-height:min(88vh,88dvh);border:0;padding:0 0 env(safe-area-inset-bottom,0px);
  background:var(--paper);color:var(--ink);border-radius:16px 16px 0 0;box-shadow:0 -12px 40px rgba(20,18,15,.18);overflow:auto;overscroll-behavior:contain}
dialog.sheet::backdrop{background:rgba(20,18,15,.5)}
dialog.sheet[open]{animation:sheet-up .34s cubic-bezier(.2,.8,.2,1)}
dialog.sheet[open]::backdrop{animation:sheet-fade .34s ease}
.sheet-head{position:sticky;top:0;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px 10px 20px;background:var(--paper);border-bottom:1px solid var(--line)}
.sheet-head::before{content:"";position:absolute;top:6px;left:50%;width:36px;height:4px;margin-left:-18px;border-radius:2px;background:var(--line)}
.sheet-head h2{font-size:20px;font-weight:500;padding-top:6px}
.sheet-x{flex:0 0 44px;width:44px;height:44px;border:0;background:none;color:var(--ink);font:28px/1 var(--body);cursor:pointer;border-radius:50%}
.sheet-x:hover{background:var(--lime)}
.sheet-body{padding:20px}
.sheet-foot{position:sticky;bottom:0;display:flex;gap:10px;padding:12px 20px;background:var(--paper);border-top:1px solid var(--line)}
.sheet-foot .btn{flex:1;text-align:center;border:0;cursor:pointer;font-family:var(--body)}
html.sheet-open{overflow:hidden}
@keyframes sheet-up{from{transform:translateY(100%)}}
@keyframes sheet-pop{from{opacity:0;transform:translateY(14px)}}
@keyframes sheet-fade{from{opacity:0}}
@media (min-width:701px){
  dialog.sheet{inset:0;margin:auto;width:min(560px,calc(100% - 48px));max-height:min(82vh,760px);border-radius:4px;padding-bottom:0;box-shadow:0 24px 60px rgba(20,18,15,.25)}
  dialog.sheet[open]{animation-name:sheet-pop}
  .sheet-head::before{display:none}.sheet-head h2{padding-top:0}
}
@media (prefers-reduced-motion:reduce){dialog.sheet[open],dialog.sheet[open]::backdrop{animation:none}}

/* --- home hero "Two coasts" (build.mjs heroTwoCoasts): east = sunrise, west = sunset. Desktop: one stage, two photos and a
   divider (--s = the east's share, set by app.js); phones (≤760px): the halves stack and the search moves into a bottom sheet.
   Every edge sits on the .wrap edge (--gut). The big words are decorative (aria-hidden); the H1 is the page's only heading 1. --- */
.hero2c{position:relative;padding:0;--gut:max(24px,calc((100% - 1180px) / 2 + 24px))}
.tc-stage{--s:.5;position:relative;height:clamp(620px,100svh,960px);overflow:hidden;background:#17191b;color:#fff;touch-action:pan-y;-webkit-user-select:none;user-select:none;isolation:isolate}
.tc-side{position:absolute;inset:0;overflow:hidden}
.tc-e{clip-path:inset(0 calc((1 - var(--s)) * 100%) 0 0)}
.tc-w{clip-path:inset(0 0 0 calc(var(--s) * 100%))}
.tc-img{position:absolute;inset:0}
.tc-e .tc-img{transform:translate3d(calc((var(--s) - 1) * 50%),0,0)}
.tc-w .tc-img{transform:translate3d(calc(var(--s) * 50%),0,0)}
.tc-img picture,.tc-img img{display:block;width:100%;height:100%;object-fit:cover}
.tc-w .tc-img img{object-position:30% 50%}
/* no real dusk photo yet: only the sky above the west coast takes a warm grade */
.tc-w .tc-img::before{content:"";position:absolute;inset:0 0 58% 0;z-index:1;pointer-events:none;mix-blend-mode:soft-light;background:linear-gradient(180deg,rgba(255,150,100,.6),rgba(255,170,110,0))}
.tc-side::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(12,14,16,.5) 0%,rgba(12,14,16,.18) 26%,rgba(12,14,16,0) 44%,rgba(12,14,16,0) 50%,rgba(12,14,16,.42) 74%,rgba(12,14,16,.72) 100%)}
.tc-stage::before{content:"";position:absolute;z-index:1;left:50%;top:0;width:min(1100px,96%);height:50%;transform:translateX(-50%);background:radial-gradient(50% 55% at 50% 52%,rgba(12,14,18,.34),rgba(12,14,18,0) 100%);pointer-events:none}
.tc-head{position:absolute;z-index:3;left:0;right:0;top:calc(var(--hh) + clamp(18px,4.6vh,60px));text-align:center;pointer-events:none}
.tc-kicker{display:inline-flex;align-items:center;gap:14px;font-size:12px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.92)}
.tc-kicker::before,.tc-kicker::after{content:"";width:28px;height:1px;background:rgba(255,255,255,.6)}
.tc-head h1{font-size:clamp(40px,min(5.4vw,8.4vh),84px);font-weight:400;line-height:1.04;letter-spacing:-.03em;margin:14px auto 0;max-width:15em;text-wrap:balance;text-shadow:0 1px 30px rgba(0,0,0,.28)}
html[lang=el] .tc-head h1{font-size:clamp(36px,min(4.8vw,7.6vh),74px)}
.tc-ochre{color:var(--ochre-lt)}
.tc-copy{position:absolute;z-index:2;bottom:clamp(124px,16vh,164px);width:min(32rem,calc(50% - var(--gut) - 56px));transition:opacity .45s ease}
.tc-e .tc-copy{left:var(--gut)}
.tc-w .tc-copy{right:var(--gut);text-align:right}
.tc-eb{display:flex;align-items:center;flex-wrap:wrap;gap:6px 14px;margin:0 0 12px;font-size:12px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:#f7dfbd}
.tc-w .tc-eb{justify-content:flex-end}
.tc-gr{letter-spacing:.04em;text-transform:none;font-size:14px;font-weight:400;color:#fff}
.tc-sun{display:inline-block;min-width:5ch;color:#fff;letter-spacing:.08em;font-variant-numeric:tabular-nums}
.tc-sun:has(time[hidden]){visibility:hidden}
.tc-word{font-family:var(--head);font-size:clamp(64px,min(8.6vw,13.5vh),132px);line-height:.86;letter-spacing:-.045em;font-weight:400;margin:0 0 18px;text-shadow:0 2px 40px rgba(0,0,0,.18)}
.tc-e .tc-word{margin-left:-.05em}
.tc-p{font-size:17px;line-height:1.5;color:rgba(255,255,255,.92);max-width:36ch}
.tc-w .tc-p{margin-left:auto}
.tc-go{display:inline-flex;align-items:center;gap:14px;min-height:48px;margin-top:12px;font-size:15px;font-weight:500;color:#fff}
.tc-w .tc-go{flex-direction:row-reverse}
.tc-arr{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;border:1px solid rgba(255,255,255,.7);transition:background .3s,color .3s,transform .4s cubic-bezier(.34,1.56,.64,1)}
.tc-arr svg{width:16px;height:16px}
.tc-go:hover .tc-arr{background:#fff;color:var(--ink);transform:translateX(3px)}
.tc-w .tc-go:hover .tc-arr{transform:translateX(-3px)}
.tc-go:focus-visible,.tc-knob:focus-visible,.tc-find:focus-visible,.tc-after a:focus-visible{outline:2px solid currentColor;outline-offset:4px}
/* the coast you are not looking at folds into a quiet vertical label */
.tc-peek{position:absolute;z-index:2;top:52%;display:flex;align-items:center;gap:14px;writing-mode:vertical-rl;transform:translate(-50%,-50%) rotate(180deg);white-space:nowrap;opacity:0;transition:opacity .5s ease;pointer-events:none}
.tc-e .tc-peek{left:calc(var(--s) * 50%)}
.tc-w .tc-peek{left:calc((1 + var(--s)) * 50%)}
.tc-peek b{font-size:30px;font-weight:400;letter-spacing:-.02em}
.tc-peek small{font-size:11px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:#f7dfbd}
.tc-stage[data-side=west] .tc-e .tc-peek,.tc-stage[data-side=east] .tc-w .tc-peek{opacity:1;transition-delay:.15s}
.tc-stage[data-side=west] .tc-e .tc-copy,.tc-stage[data-side=east] .tc-w .tc-copy{opacity:0}
.tc-stage[data-side=west] .tc-e,.tc-stage[data-side=east] .tc-w{cursor:pointer}
/* the divider: a hairline with the sun on the horizon (no chevrons); it springs a little on hover */
.tc-div{position:absolute;z-index:4;top:0;bottom:0;left:calc(var(--s) * 100%);width:0;pointer-events:none}
.tc-div::before{content:"";position:absolute;top:0;bottom:0;left:-.5px;width:1px;background:linear-gradient(180deg,rgba(255,255,255,0) 0%,rgba(255,255,255,0) 44%,rgba(255,255,255,.85) 56%,rgba(255,255,255,.85) 100%)}
.tc-knob{pointer-events:auto;position:absolute;left:0;top:66%;width:64px;height:64px;margin:-32px 0 0 -32px;border-radius:50%;display:grid;place-items:center;color:#fff;background:rgba(16,18,20,.28);-webkit-backdrop-filter:blur(14px) saturate(1.3);backdrop-filter:blur(14px) saturate(1.3);border:1px solid rgba(255,255,255,.8);cursor:ew-resize;touch-action:none;transition:transform .5s cubic-bezier(.34,1.56,.64,1),background .3s}
.tc-knob:hover,.tc-stage.is-drag .tc-knob{transform:scale(1.1);background:rgba(16,18,20,.44)}
.tc-knob svg{width:38px;height:38px}
.tc-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
/* search: plain stacked form (phones without JS, and inside the sheet); a smoked-glass pill over the photos from 761px */
.tc-search{position:relative;z-index:6;padding-top:16px}
.tc-bar{display:grid;grid-template-columns:1fr 1fr;background:#fff;color:var(--ink);border:1px solid var(--line)}
.tc-f{position:relative;display:flex;flex-direction:column;justify-content:center;gap:2px;min-width:0;padding:12px 16px;border-bottom:1px solid var(--line);transition:background .6s}
.tc-where,.tc-villa{grid-column:1/-1}
.tc-date,.tc-f:nth-child(5){border-right:1px solid var(--line)}
.tc-f:nth-child(5){border-bottom:0}
.tc-f small{font-size:11px;font-weight:600;letter-spacing:.13em;text-transform:uppercase;color:var(--muted)}
.tc-f select,.tc-f input{width:100%;min-width:0;border:0;background:none;padding:3px 0;font:500 16px/1.4 var(--body);color:inherit;-webkit-appearance:none;appearance:none;border-radius:0;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;cursor:pointer}
.tc-f select{padding-right:18px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%236b665c' stroke-width='1.3'/%3E%3C/svg%3E") no-repeat right 2px center}
.tc-f option,.tc-f optgroup{color:var(--ink);background:#fff}
.tc-f:focus-within{background:#fbf8f2}
.tc-f:focus-within small{color:var(--ochre-t)}
.tc-f select:focus-visible,.tc-f input:focus-visible{outline:0;box-shadow:inset 0 -2px 0 var(--ochre)}
.tc-f.is-flash{background:#f6eadb}
.tc-ph{display:none;position:absolute;left:16px;bottom:15px;font:500 16px/1.4 var(--body);color:var(--muted-2);pointer-events:none}
.tc-date.is-empty .tc-ph{display:block}
.tc-date.is-empty input,.tc-date.is-empty input::-webkit-datetime-edit{color:transparent}
.tc-btn{margin:10px;min-height:52px;padding:0 22px;border:0;border-radius:2px;background:var(--ochre-btn);color:#fff;font:600 16px var(--body);cursor:pointer;transition:background .2s}
.tc-btn:hover{background:#7f4b19}
.tc-find{display:none}
.sheet .tc-search{padding:0}.sheet .tc-search .wrap{padding:0}
.tc-after{padding-top:30px;text-align:center}
.tc-folio{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 28px;font-size:15px;color:var(--muted-2);font-variant-numeric:tabular-nums}
.tc-folio>*{display:inline-flex;align-items:center;gap:10px}
.tc-folio>*::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--ochre)}
.tc-folio a,.tc-credit a{color:var(--ochre-t);text-decoration:underline;text-underline-offset:3px}
.tc-bridge{max-width:44rem;margin:34px auto 0;font-size:clamp(18px,1.7vw,21px);line-height:1.6}
.tc-credit{margin-top:20px;font-size:13px;color:var(--muted)}
@media (min-width:761px){
  .hero2c .tc-search{position:absolute;left:0;right:0;bottom:clamp(22px,3.6vh,40px);padding:0}
  .hero2c .tc-bar{grid-template-columns:1.3fr 1.4fr 1fr .65fr auto;padding-left:14px;background:rgba(18,17,15,.36);-webkit-backdrop-filter:blur(18px) saturate(1.25);backdrop-filter:blur(18px) saturate(1.25);border:1px solid rgba(255,255,255,.3);border-radius:999px;color:#fff;box-shadow:0 24px 60px -30px rgba(0,0,0,.55)}
  .hero2c .tc-f{grid-column:auto;border:0;border-right:1px solid rgba(255,255,255,.2);padding:11px 18px}
  .hero2c .tc-f small{color:rgba(255,255,255,.78)}
  .hero2c .tc-f select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%23ffffff' stroke-width='1.3'/%3E%3C/svg%3E")}
  .hero2c .tc-f:focus-within{background:rgba(255,255,255,.1)}
  .hero2c .tc-f:focus-within small{color:#f7dfbd}
  .hero2c .tc-f select:focus-visible,.hero2c .tc-f input:focus-visible{box-shadow:inset 0 -2px 0 var(--ochre-lt)}
  .hero2c .tc-f.is-flash{background:rgba(247,223,189,.22)}
  .hero2c .tc-ph{left:18px;bottom:13px;color:rgba(255,255,255,.75)}
  .hero2c .tc-f input::-webkit-calendar-picker-indicator{filter:invert(1);opacity:.7}
  .hero2c .tc-btn{margin:7px;border-radius:999px;padding:0 26px;min-height:50px}
}
@media (min-width:761px) and (max-width:1100px){
  .hero2c .tc-bar{grid-template-columns:1fr 1.3fr 1fr auto}
  .hero2c .tc-f:nth-child(4),.hero2c .tc-f:nth-child(5){display:none}
  .tc-p{font-size:16px}
}
@media (min-width:761px) and (max-height:760px){.tc-p{display:none}.tc-word{margin-bottom:8px}}
@media (max-width:760px){
  .tc-stage{height:clamp(600px,100svh,900px)}
  .tc-e,.tc-w{clip-path:none}
  .tc-e{bottom:46%}.tc-w{top:54%}
  .tc-e .tc-img,.tc-w .tc-img{transform:none}
  .tc-stage::before,.tc-kicker,.tc-p,.tc-peek,.tc-knob{display:none}
  .tc-head{top:calc(var(--hh) + 12px);text-align:left}
  .tc-head h1{font-size:clamp(27px,7.6vw,34px);margin:0;max-width:none}
  html[lang=el] .tc-head h1{font-size:clamp(26px,7vw,32px)}
  .tc-copy,.tc-stage[data-side] .tc-copy{opacity:1;left:16px;right:16px;width:auto;bottom:16px}
  .tc-stage .tc-w .tc-copy{bottom:88px}
  .tc-eb{margin:0 0 4px;font-size:11px;gap:4px 10px}
  .tc-gr{font-size:12.5px}
  .tc-word{font-size:clamp(64px,19vw,84px);margin:0 0 4px}
  .tc-go{min-height:44px;margin-top:2px}
  .tc-arr{width:34px;height:34px}
  .tc-div{left:0;right:0;top:54%;bottom:auto;width:auto;height:0}
  .tc-div::before{top:-.5px;bottom:auto;left:0;right:0;width:auto;height:1px;background:rgba(255,255,255,.8)}
  .tc-find{display:flex;position:absolute;z-index:5;left:16px;right:16px;bottom:20px;min-height:52px;align-items:center;justify-content:center;border-radius:999px;background:rgba(18,17,15,.38);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.5);color:#fff;font-weight:600;font-size:16px}
  .hero2c.tc-js .tc-search{display:none}
  .tc-search .wrap{padding:0 16px}
  .tc-btn{grid-column:1/-1}
  .tc-after{padding-top:26px}
  .tc-folio{justify-content:flex-start;text-align:left}
  .tc-bridge,.tc-credit{text-align:left}
}
@media (prefers-reduced-motion:no-preference){
  .tc-img img{animation:tcSettle 2.6s cubic-bezier(.2,.7,.2,1) both}
}
@media (prefers-reduced-motion:no-preference) and (min-width:761px){
  .tc-div::before{animation:tcLine 1.4s cubic-bezier(.6,0,.2,1) .15s both;transform-origin:50% 100%}
}
@keyframes tcSettle{from{transform:scale(1.06)}to{transform:scale(1)}}
@keyframes tcLine{from{transform:scaleY(0)}to{transform:scaleY(1)}}

/* ---------- owners page: hero, example report, season, €0 / 60 days, law band, estimator, form ---------- */
body.over-hero main>.crumbs{position:absolute;left:0;right:0;top:calc(var(--hh) + 6px);z-index:2;padding-top:0}
body.over-hero main>.crumbs ol,body.over-hero main>.crumbs a,body.over-hero main>.crumbs [aria-current]{color:rgba(255,255,255,.88)}
body.over-hero main>.crumbs li+li::before{color:rgba(255,255,255,.5)}
.oh{position:relative;min-height:clamp(600px,94svh,920px);display:flex;align-items:flex-end;color:#fff;background:#23292b;isolation:isolate}
.oh-ph{position:absolute;inset:0;z-index:-1;overflow:hidden}
.oh-ph::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(12,14,16,.5) 0%,rgba(12,14,16,0) 28%,rgba(12,14,16,.12) 48%,rgba(12,14,16,.8) 100%)}
.oh-in{width:100%;padding-top:calc(var(--hh) + 72px);padding-bottom:clamp(36px,7vh,72px);display:flex;align-items:flex-end;justify-content:space-between;gap:32px}
.oh-copy{max-width:760px}
.oh .eyebrow{color:#f3d9b5}
.oh h1{font-size:clamp(36px,5.2vw,68px);line-height:1.04;color:#fff;text-wrap:balance;text-shadow:0 2px 24px rgba(0,0,0,.25)}
.oh-lede{font-size:clamp(17px,1.5vw,20px);max-width:54ch;margin:18px 0 26px;color:#fff}
.oh-ctas{display:flex;gap:12px;flex-wrap:wrap}
.btn.oh-o{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.85)}
.oh-ticks{list-style:none;display:flex;flex-wrap:wrap;gap:6px 22px;margin-top:22px;font-size:14px}
.oh-ticks li::before{content:"✓";color:var(--ochre-l);margin-right:8px}
.oh-cap{font-size:12px;letter-spacing:.04em;opacity:.85;white-space:nowrap}
.orep-g{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(32px,5vw,72px);align-items:center}
.orep-copy h2,.osn h2,.oest h2{font-size:clamp(28px,3.2vw,44px);margin-bottom:16px;text-wrap:balance}
.orep-copy p{color:var(--muted-2);max-width:48ch}
.orep-doc{background:#fff;border:1px solid var(--line);box-shadow:0 22px 48px -28px rgba(28,27,25,.4);padding:clamp(20px,3vw,36px);margin:0;font-size:15px}
.orep-tag{display:inline-block;background:var(--ink);color:var(--lime);font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;padding:7px 12px;margin-bottom:18px}
.orep-hd{display:flex;justify-content:space-between;flex-wrap:wrap;gap:2px 16px;border-bottom:2px solid var(--ink);padding-bottom:10px}
.orep-hd b{font-family:var(--head);font-size:19px;font-weight:500}.orep-hd span{color:var(--muted)}
.orep-doc table{width:100%;border-collapse:collapse;margin:6px 0 18px;font-variant-numeric:tabular-nums}
.orep-doc th,.orep-doc td{text-align:right;padding:10px 0 10px 12px;border-bottom:1px solid var(--line);font-weight:400}
.orep-doc th:first-child{text-align:left;padding-left:0}
.orep-doc thead th{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.orep-doc tfoot th,.orep-doc tfoot td{font-weight:600;border-bottom:0}
.orep-dl{display:grid;gap:8px}
.orep-dl div{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:12px;padding:10px 12px;background:var(--lime)}
.orep-dl dt{font-size:13px;font-weight:600;color:var(--muted-2)}
.orep-dl .wait{background:#f6e7d3;box-shadow:inset 3px 0 var(--ochre)}
.osn-rib{list-style:none;display:grid;grid-template-columns:repeat(12,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin:28px 0 0;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);background:var(--paper)}
.osn-rib li{padding:10px 0;text-align:center}
.osn-rib li.on{color:var(--ink);font-weight:600;box-shadow:inset 0 -3px var(--ochre)}
.osn-ch{display:grid;grid-template-columns:120px minmax(0,1fr) minmax(0,1.1fr);gap:clamp(20px,3vw,48px);padding:clamp(36px,5vw,64px) 0;border-bottom:1px solid var(--line)}
.osn-n{font-family:var(--head);font-size:clamp(56px,7vw,96px);line-height:.9;color:var(--ochre);align-self:start;position:sticky;top:calc(var(--hh) + 64px)}
.osn-b h3{font-size:clamp(21px,2vw,27px);margin-bottom:10px}.osn-b h3 span{color:var(--ochre)}
.osn-b p{color:var(--muted-2);max-width:46ch}
.osn-note{margin-top:18px;background:#fff;border:1px solid var(--line);padding:12px 14px;font-size:14px;color:var(--ink)!important;box-shadow:0 10px 24px -18px rgba(28,27,25,.45)}
.osn-note small{display:block;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:2px}
.osn-ph{margin:0}.osn-ph>div{aspect-ratio:4/3;overflow:hidden}
.osn-ph figcaption,.oform-ph small{display:block;font-size:12px;color:var(--muted);margin-top:8px}
.ocov{margin-top:48px;display:grid;grid-template-columns:1fr 1fr;gap:0 48px}
.ocov h3{grid-column:1/-1;font-size:22px;margin-bottom:14px}
.ocov>div{padding:14px 0;border-top:1px solid var(--line);font-size:15px;color:var(--muted-2)}
.ocov b{display:block;color:var(--ink);font-weight:600}
.ocov .ocov-not{grid-column:1/-1;font-size:14px}
.oearn h2{font-size:clamp(30px,3.6vw,48px);margin-bottom:28px}
.oearn-g{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.oearn-c{padding:clamp(24px,3.5vw,44px);min-height:280px;display:flex;flex-direction:column;justify-content:flex-end}
.oearn-c b{font-family:var(--head);font-weight:500;font-size:clamp(56px,7vw,96px);line-height:1;color:var(--ochre-l)}
.oearn-c h3{font-size:22px;margin:10px 0 8px}
.oearn-c p{max-width:46ch;opacity:.9}
.oearn-c.ink{background:var(--ink);color:var(--lime)}
.oearn-c.lime{background:var(--lime)}.oearn-c.lime b{color:var(--ochre)}
.oearn-more{margin-top:32px}
.olaw{background:var(--sea);color:var(--lime);padding:clamp(56px,8vw,96px) 0}
.olaw-g{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,.8fr);gap:clamp(28px,5vw,72px);align-items:start}
.olaw h2{font-size:clamp(28px,3.2vw,42px);margin-bottom:16px}
.olaw p{opacity:.92;margin:12px 0;max-width:64ch}
.olaw ul{list-style:none;margin:18px 0;display:grid;grid-template-columns:1fr 1fr;gap:10px 28px}
.olaw li{padding-left:28px;position:relative}
.olaw li::before{content:"";position:absolute;left:0;top:.3em;width:14px;height:14px;border:1.5px solid var(--ochre-l)}
.olaw-facts{display:grid;gap:14px;position:sticky;top:calc(var(--hh) + 24px)}
.olaw-facts div{border:1px solid rgba(243,239,231,.35);padding:22px;font-size:15px}
.olaw-facts b{display:block;font-family:var(--head);font-weight:500;font-size:clamp(34px,4vw,52px);line-height:1.05;color:var(--ochre-l);margin-bottom:6px}
.oest-intro{margin-bottom:8px}
.oest-tool{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,4vw,56px);margin:32px 0 48px}
.oest-in{display:grid;grid-template-columns:minmax(130px,190px) minmax(0,1fr);gap:24px;align-items:start}
.oest-map{position:relative}
.oest-mapc{position:relative;aspect-ratio:606/819;overflow:hidden}
.oest-mapc img{position:absolute;max-width:none;height:auto;object-fit:fill;pointer-events:none}
.oest-map .pin{position:absolute;width:24px;height:24px;margin:-12px 0 0 -12px;border:0;background:none;cursor:pointer;padding:0}
.oest-map .pin::after{content:"";position:absolute;left:7px;top:7px;width:10px;height:10px;border-radius:50%;background:var(--paper);border:2px solid var(--sea)}
.oest-map .pin.on::after{background:var(--ochre);border-color:var(--ochre);transform:scale(1.3)}
.oest-call{position:absolute;transform:translate(14px,-50%);background:var(--ink);color:var(--lime);font-size:12px;padding:4px 8px;white-space:nowrap;pointer-events:none;z-index:1;max-width:160px;overflow:hidden;text-overflow:ellipsis}
.oest-pool{border:0;margin-bottom:14px}.oest-pool legend{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:6px}
.oest-pool label{display:flex;align-items:center;gap:10px;min-height:36px;font-size:15px}
.oest-wk output{color:var(--ink);font-weight:600}
.oest-wk input{padding:0;border:0;background:none;accent-color:var(--ochre);min-height:36px}
.oest-wk small{display:block;font-size:13px;color:var(--muted)}
.oest-out{background:var(--lime);padding:clamp(20px,3vw,36px);align-self:start}
.oest-lbl{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--ochre)}
.oest-fig{font-family:var(--head);font-size:clamp(34px,4.4vw,56px);line-height:1.05;margin:4px 0;font-variant-numeric:tabular-nums}
.oest-per,.oest-basis{font-size:14px;color:var(--muted-2)}
.oest-basis{margin:6px 0 18px}
.oest-out.nopool .oest-fig,.oest-out.nopool .oest-per,.oest-out.nopool .oest-chart{display:none}
.oest-nopool{margin:6px 0 4px;max-width:52ch}
.oest-bars{list-style:none;display:flex;align-items:flex-end;gap:2px;height:120px;margin:22px 0 6px}
.oest-bars li{flex:1;background:#e2d6c2;position:relative;min-height:2px}
.oest-bars li i{position:absolute;left:0;right:0;bottom:0;background:#cdbca0}
.oest-bars li.b{background:var(--ochre-l)}.oest-bars li.b i{background:var(--ochre)}
.oest-axis{display:flex;justify-content:space-between;font-size:12px;color:var(--muted)}
.oest-ch{font-size:22px;margin-bottom:4px}
.oest-note{font-size:14px;color:var(--muted);margin-bottom:16px}
.oest-comps{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.oest-comps .th{aspect-ratio:4/3;overflow:hidden;margin-bottom:10px}
.oest-comps b{display:block;font-family:var(--head);font-weight:500;font-size:18px}
.oest-comps span{display:block;font-size:14px;color:var(--muted-2)}
.oest-comps .pr{color:var(--ink);margin-top:2px}
.oest-comps a:hover b{color:var(--ochre)}
.oest-how{margin-top:24px;border-top:1px solid var(--line);padding-top:14px}
.oest-how summary{cursor:pointer;font-weight:600}
.oest-how .content{margin-top:10px}
.ofaq .faq-sec .content{max-width:none;display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);gap:48px;align-items:start}
.ofaq .faq-sec h2{margin-top:0;position:sticky;top:calc(var(--hh) + 24px)}
.oform-g{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(24px,4vw,56px);align-items:start}
.oform-ph{margin:0;position:sticky;top:calc(var(--hh) + 24px)}
.oform-ph .arch{aspect-ratio:3/4;overflow:hidden;border-radius:999px 999px 0 0}
.oform-ph figcaption{margin-top:16px;color:var(--muted-2)}
.oform-ph figcaption b{display:block;font-family:var(--head);font-size:22px;font-weight:500;color:var(--ink);margin-bottom:4px}
.osk{background:#fff;box-shadow:inset 3px 0 var(--ochre);padding:12px 14px;margin-bottom:18px;display:grid;gap:2px}
.osk[hidden]{display:none}
.osk small{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.osk a{font-size:14px;color:var(--ochre)}
.o-mbar{display:none}
@media (max-width:900px){
  .orep-g,.olaw-g,.oform-g,.oest-tool,.ofaq .faq-sec .content{grid-template-columns:1fr}
  .osn-ch{grid-template-columns:1fr;gap:14px}.osn-n{position:static;font-size:56px}
  .olaw-facts,.oform-ph,.ofaq .faq-sec h2{position:static}
  .oform-ph .arch{aspect-ratio:4/3;border-radius:240px 240px 0 0}
}
@media (max-width:700px){
  .oh-in{flex-direction:column;align-items:flex-start;gap:18px;padding-top:calc(var(--hh) + 56px)}
  .oh-lede{font-size:16px}
  .oearn-g,.ocov,.olaw ul{grid-template-columns:1fr}
  .oearn-c{min-height:0}
  .osn-rib{font-size:9px;letter-spacing:0}
  .oest-in{grid-template-columns:1fr}.oest-map{display:none}
  .oest-comps{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:76%;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:8px}
  .oest-comps li{scroll-snap-align:start}
  .orep-doc{font-size:14px}.orep-doc th,.orep-doc td{padding-left:8px}
  .orep-dl div{grid-template-columns:1fr;gap:2px}
}
@media (max-width:760px){
  .o-mbar{display:block;position:fixed;left:0;right:0;bottom:0;z-index:30;padding:10px 16px calc(10px + env(safe-area-inset-bottom,0px));background:var(--bg,#faf8f3);border-top:1px solid var(--line);transition:transform .25s ease}
  .o-mbar .btn{display:block;text-align:center}
  .o-mbar.off{transform:translateY(110%)}
  body:has(.o-mbar) footer{padding-bottom:96px}
}
@media (prefers-reduced-motion:reduce){.o-mbar{transition:none}}


/* ===== Island chart (build.mjs islandMap; prototype proto/extra-map.html) ===== */
.im,.alm-map{--im-sea:#1e4a55;--im-sea-d:#123640;--im-land:#f3efe7;--im-main:#3b6169;--im-och:#a8692a;--im-och-s:#8f5a22;--im-och-l:#d39a56}
.im-sprite{position:absolute;width:0;height:0;overflow:hidden}
.im-pan{background:var(--im-sea);color:var(--im-land)}
.im-ch{position:relative;width:100%}
.im-ch--isl{aspect-ratio:620/832}
.im-ch--loc{aspect-ratio:284/256}
.im-svg{position:absolute;inset:0;width:100%;height:100%;display:block}
.im-sea{fill:var(--im-sea)}
.im-rg{fill:none;stroke:var(--im-land);stroke-width:calc(var(--r) * 2px + 2.6px);stroke-linejoin:round;opacity:calc(.24 - var(--k) * .06)}
.im-rs{fill:none;stroke:var(--im-sea);stroke-width:calc(var(--r) * 2px);stroke-linejoin:round}
.im-main{fill:var(--im-main);stroke:rgba(243,239,231,.25);stroke-width:.8px}
.im-isle,.im-lef{fill:var(--im-land)}
.im-lef{stroke:#c9bba2;stroke-width:.8px;stroke-linejoin:round}
.im-approx{fill:rgba(168,105,42,.24);stroke:var(--im-och-s);stroke-width:1.5px;stroke-dasharray:5 4;vector-effect:non-scaling-stroke}
.im-ov{position:absolute;inset:0}
.im-lb{position:absolute;z-index:1;white-space:nowrap;font:600 10px/1.25 var(--body);letter-spacing:.14em;text-transform:uppercase;color:rgba(28,27,25,.8);text-shadow:0 0 2px var(--im-land),0 0 3px var(--im-land),0 0 6px var(--im-land);pointer-events:none}
a.im-lb{pointer-events:auto;text-decoration:none}
a.im-lb:hover{color:var(--im-och-s);text-decoration:underline}
a.im-lb:focus-visible{outline:2px solid var(--im-land);outline-offset:2px}
.im-lb.is-cull{visibility:hidden}
.im-lb--e{transform:translate(12px,-50%)}
.im-lb--w{transform:translate(calc(-100% - 12px),-50%);text-align:right}
.im-lb--s{transform:translate(-50%,12px);text-align:center}
.im-lb--n{transform:translate(-50%,calc(-100% - 6px))}
.im-lb--c{transform:translate(-50%,-50%)}
.im-lb--sea{color:rgba(243,239,231,.6);text-shadow:none;font-weight:500;letter-spacing:.4em}
.im-lb--villa{z-index:2;background:var(--im-land);color:var(--ink);text-shadow:none;text-transform:none;letter-spacing:0;font-size:12.5px;padding:4px 8px;border-radius:2px;box-shadow:0 2px 8px rgba(6,23,27,.3)}
.im-pin{position:absolute;z-index:3;width:30px;height:30px;margin:-15px 0 0 -15px;translate:var(--dx,0) var(--dy,0);display:grid;place-items:center;border-radius:50%;-webkit-tap-highlight-color:transparent}
.im-pin[hidden]{display:none}
.im-pin i{width:12px;height:12px;border-radius:50%;background:var(--im-och);box-shadow:0 0 0 2px var(--im-land),0 1px 5px rgba(6,23,27,.45);transition:transform .2s cubic-bezier(.2,.8,.2,1),background .2s}
.im-pin::after{content:"";position:absolute;inset:2px;border:1.5px solid var(--im-och-l);border-radius:50%;opacity:0;transform:scale(.5);transition:opacity .2s,transform .25s cubic-bezier(.2,.8,.2,1)}
.im-pin:hover i{transform:scale(1.2)}
.im-pin.is-on{z-index:4}
.im-pin.is-on i{background:var(--im-och-s);transform:scale(1.3)}
.im-pin.is-on::after{opacity:1;transform:scale(1)}
.im-pin:focus-visible{outline:2px solid var(--im-land);outline-offset:0}
.im-ad{position:absolute;z-index:2;width:26px;height:26px;margin:-13px 0 0 -13px;display:grid;place-items:center}
.im-ad i{width:10px;height:10px;border-radius:50%;background:var(--im-land);border:1.75px solid var(--ink)}
.im-scl{position:absolute;left:12px;bottom:12px;z-index:1;font-size:10.5px;letter-spacing:.06em;color:rgba(18,54,64,.7);white-space:nowrap}
.im-scl i{display:block;height:5px;border:1px solid currentColor;border-top:0;margin-bottom:3px}
.im-inset{position:absolute;right:10px;top:10px;width:56px;aspect-ratio:606/819;background:var(--im-sea-d);border:1px solid rgba(243,239,231,.3)}
.im-inset svg{display:block;width:100%;height:100%}
.im-inset rect{fill:none;stroke:var(--im-och-l);stroke-width:14px}
.im-cap{display:flex;flex-wrap:wrap;gap:6px 16px;align-items:center;font-size:12px;color:var(--muted);margin-top:10px}
.im-cap a{text-decoration:underline;text-underline-offset:2px}
.im-leg{display:inline-flex;align-items:center;gap:6px}
.im-leg i{display:inline-block;width:12px;height:12px;border-radius:50%}
.im-leg-c{background:rgba(168,105,42,.3);border:1.5px dashed var(--im-och-s)}
.im-leg-a{background:var(--im-land);border:1.75px solid var(--ink)}
.im-loc{margin:0 0 18px}
.im-grid{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:32px;padding:28px}
.im-chart{display:flex;justify-content:center;align-items:flex-start;min-width:0}
.im-chart .im-ch{max-width:540px}
.im-side{align-self:start;position:sticky;top:96px;min-width:0}
.im-card{background:var(--paper);color:var(--ink);box-shadow:0 10px 30px rgba(6,23,27,.35)}
.im-card[hidden]{display:none}
.im-card .v{display:block;padding-bottom:16px}
.im-card .v .ph{aspect-ratio:4/3}
.im-card .v>:not(.ph){padding:0 16px}
.im-card .v h3{font-size:20px}
.im-nav{display:flex;align-items:center;gap:12px;margin-top:14px;font-size:13px;letter-spacing:.08em;color:rgba(243,239,231,.8)}
.im-pos{font-variant-numeric:tabular-nums;margin-right:auto}
.im-nav button{width:44px;height:44px;border-radius:50%;border:1px solid rgba(243,239,231,.45);background:none;color:var(--im-land);display:grid;place-items:center;cursor:pointer}
.im-nav button:hover{background:rgba(243,239,231,.12)}
.im-nav button:focus-visible{outline:2px solid var(--im-land);outline-offset:2px}
.im-nav svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6}
.im-villas:not(.is-js) .im-nav{display:none}
.im-villas.is-empty .im-nav{visibility:hidden}
.im-lead{font-size:15px;color:rgba(243,239,231,.8);margin-bottom:14px}
.im-alist{list-style:none;margin:0;padding:0;border-top:1px solid rgba(243,239,231,.2)}
.im-alist a{display:flex;justify-content:space-between;gap:12px;padding:12px 2px;border-bottom:1px solid rgba(243,239,231,.14);color:var(--im-land);font-size:16px;text-decoration:none}
.im-alist a span+span{color:rgba(243,239,231,.62);font-size:13px;white-space:nowrap}
.im-alist a:hover{color:var(--im-och-l)}
.im-alist a:focus-visible{outline:2px solid var(--im-land);outline-offset:2px}
/* /villas/: List | Map (radios, works without JS where :has() is supported) */
.vview-bar{display:flex;justify-content:flex-end;margin-bottom:18px}
.im-seg{display:inline-flex;border:1px solid var(--ink);border-radius:2px}
.im-seg input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
.im-seg label{padding:9px 18px;min-width:76px;text-align:center;font-size:13px;font-weight:600;letter-spacing:.04em;cursor:pointer;user-select:none}
.im-seg input:checked+label{background:var(--ink);color:var(--lime)}
.im-seg input:focus-visible+label{outline:2px solid var(--ochre);outline-offset:2px}
.vview:has(#vview-m:checked) .js-vlist{display:none!important}
.vview:not(:has(#vview-m:checked)) .vview-map{display:none}
@media (max-width:1000px){.im-grid{grid-template-columns:minmax(0,1fr) 280px;gap:20px;padding:20px}}
@media (max-width:760px){
  .im-grid{grid-template-columns:1fr;padding:0 0 16px;gap:8px}
  .im-side{position:static;padding:0 16px}
  .im-card .v{display:grid;grid-template-columns:118px 1fr;column-gap:12px;padding:0}
  .im-card .v .ph{grid-row:1/span 4;aspect-ratio:auto;height:100%;min-height:110px}
  .im-card .v>:not(.ph){padding:0 12px 0 0}
  .im-card .v h3{font-size:17px;margin-top:10px}
  .im-card .v .price{margin-bottom:10px}
  .im-lb[data-p="3"],.im-lb[data-p="4"]{display:none}
  .im-lb{letter-spacing:.08em;font-size:10.5px}
  .im-lb--sea{letter-spacing:.3em}
}

/* ===== Today on Lefkada (build.mjs almanac; prototype proto/extra-almanac.html) ===== */
.alm{--a-bg:var(--lime);--a-ink:var(--ink);--a-mut:#6b665c;--a-mut2:#4c4840;--a-line:#ddd4c4;--a-sea:#fbf9f4;--a-land:#e4d9c6;--a-main:#ebe3d4;--a-acc:var(--ochre);--a-acc-t:#8f5a22;--a-glow:rgba(211,154,86,.5);
  background:var(--a-bg);color:var(--a-ink);padding:72px 0}
.alm .eyebrow{color:var(--a-acc-t)}
.alm a{color:inherit}
.alm a:focus-visible{outline:2px solid var(--a-acc-t);outline-offset:3px}
.alm-head{display:flex;justify-content:space-between;align-items:flex-end;gap:12px 24px;flex-wrap:wrap;padding-bottom:24px;border-bottom:1px solid var(--a-line);margin-bottom:48px}
.alm-head h2{font-size:clamp(28px,3.2vw,42px)}
.alm-now{font-size:19px;min-height:1.35em}
.alm-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);grid-template-areas:"say map" "figs map";column-gap:clamp(40px,6vw,88px);row-gap:44px;align-items:start}
.alm-say{grid-area:say}
.alm-figs{grid-area:figs;align-self:end}
.alm-map{grid-area:map;margin:0}
.alm-k{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--a-mut)}
.alm-big{font-size:clamp(46px,6vw,84px);line-height:1;letter-spacing:-.03em;font-weight:400;margin:18px 0 22px;text-wrap:balance}
.alm-big.is-long{font-size:clamp(34px,3.9vw,54px);line-height:1.06;max-width:13ch}
.alm-dot-o{color:var(--a-acc)}
.alm-why{font-size:18px;line-height:1.62;color:var(--a-mut2);max-width:48ch}
.alm-go{margin-top:24px;display:flex;flex-wrap:wrap;gap:12px 30px}
.alm-link{font-size:15px;font-weight:500;border-bottom:1px solid currentColor;padding-bottom:3px;text-decoration:none}
.alm-link::after{content:"\2009\2192"}
.alm-link:hover{color:var(--a-acc-t)}
.alm-figs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--a-ink);margin:0}
.alm:not(.is-js) .alm-live,.alm.no-sun .alm-sun{display:none}
.alm-fig{padding:16px 14px 0 0;min-width:0}
.alm-fig+.alm-fig{padding-left:16px;border-left:1px solid var(--a-line)}
.alm-fig dt{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--a-mut)}
.alm-fig .v{display:flex;align-items:baseline;gap:1px;margin:10px 0 0;font-size:clamp(32px,3.1vw,44px);line-height:1;letter-spacing:-.03em;font-variant-numeric:tabular-nums;white-space:nowrap}
.alm-fig .v b{font-weight:400}
.alm-fig .u{font-size:15px;letter-spacing:0;color:var(--a-mut2)}
.alm-fig .n{font-size:13px;line-height:1.35;color:var(--a-mut);margin:8px 0 0}
.alm:not(.has-data) .alm-fig .v b{opacity:.35}
.alm-arrow{width:20px;height:20px;align-self:center;margin-left:6px;transform:rotate(var(--rot,0deg));transition:transform .8s cubic-bezier(.2,.7,.2,1);opacity:0}
.alm-arrow path{fill:none;stroke:var(--a-acc);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.has-dir .alm-arrow{opacity:1}
.alm .alm-map{--im-sea:var(--a-sea);--im-land:var(--a-land);--im-main:var(--a-main)}
.alm-map .im-rings{display:none}
.alm-map .im-lef,.alm-map .im-main{stroke:none}
.alm-map .im-ch{border:1px solid var(--a-line)}
.alm-calm path{fill:none;stroke:var(--a-acc);stroke-width:3.2;stroke-linejoin:round;stroke-linecap:round;opacity:0;transition:opacity .6s}
.alm-calm path.halo{stroke:var(--a-glow);stroke-width:22}
.alm-map[data-coast="east"] .alm-calm [data-coast="east"],.alm-map[data-coast="west"] .alm-calm [data-coast="west"]{opacity:1}
.alm-dot{fill:var(--a-sea);stroke:var(--a-mut);stroke-width:1.6}
.alm-dot.on{fill:var(--a-acc);stroke:var(--a-sea);stroke-width:2.4}
.alm-pl{position:absolute;white-space:nowrap;font-size:12.5px;line-height:1.15;color:var(--a-mut2);opacity:0;transition:opacity .4s}
.alm-pl.s-l{transform:translate(calc(-100% - 10px),-50%)}
.alm-pl.s-r{transform:translate(10px,-50%)}
.alm-pl.s-b{transform:translate(-30%,10px)}
.alm-pl.on{opacity:1;color:var(--a-ink);font-weight:600}
.alm-coast{position:absolute;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;text-align:center;gap:3px;white-space:nowrap}
.alm-coast b{font-size:11px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--a-mut2)}
.alm-coast i{font-style:normal;font-size:12.5px;color:var(--a-mut)}
.alm-coast.on b,.alm-coast.on i{color:var(--a-acc-t)}
.alm-cap{margin-top:14px;font-size:13px;line-height:1.45;color:var(--a-mut);max-width:46ch}
.alm-cap .osm{display:block;font-size:11.5px;margin-top:2px}
.alm-cap a{text-decoration:underline;text-underline-offset:2px}
.alm-sun{margin-top:64px}
.alm-suntimes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:14px 0 0;border-top:1px solid var(--a-line)}
.alm-suntimes>div{padding:16px 12px 0 0;min-width:0}
.alm-suntimes>div+div{padding-left:16px;border-left:1px solid var(--a-line)}
.alm-suntimes dt{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--a-mut)}
.alm-suntimes dd{font-size:30px;margin:8px 0 0;font-variant-numeric:tabular-nums;letter-spacing:-.02em;white-space:nowrap}
.alm-count{font-size:16px;color:var(--a-mut2);margin-top:16px;min-height:1.5em}
.alm-src{margin-top:40px;font-size:13px;line-height:1.55;color:var(--a-mut);max-width:92ch}
.alm-src a{border-bottom:1px solid currentColor;text-decoration:none}
@media (max-width:900px){
  .alm{padding:56px 0}
  .alm-head{margin-bottom:32px}
  .alm-grid{grid-template-columns:minmax(0,1fr);grid-template-areas:"say" "map" "figs";row-gap:36px}
  .alm-map{max-width:520px}
  .alm-figs{grid-template-columns:repeat(2,minmax(0,1fr))}
  .alm-fig{padding-bottom:18px}
  .alm-fig:nth-child(3){padding-left:0;border-left:0}
  .alm-fig:nth-child(n+3){border-top:1px solid var(--a-line)}
  .alm-sun{margin-top:48px}
}
@media (max-width:480px){
  .alm-why{font-size:17px}
  .alm-pl{font-size:11.5px}
  .alm-coast i{font-size:11.5px}
  .alm-suntimes dd{font-size:22px}
}
@media (prefers-reduced-motion:reduce){.im *,.im *::after,.alm,.alm *{transition:none!important}}
/* ================= VILLA · CINEMATIC  =================
   One villa page, built from the villa's own data: a full-bleed opener (name and tagline as the headline,
   one thin line of facts), the booking card beside an honest "Before you book" block, a room-by-room tour
   whose room name stays pinned while that room's photos pass, then the 3D model if any, amenities, prices, the island chart, reviews and other villas. On phones a fixed bar carries
   "from €X / week · Check dates" with WhatsApp merged into it.
   Everything is scoped under body.vc and .vc-* and sits on .wrap, so it lines up with the header and footer.
   Pinning is plain CSS (position: sticky), so the tour works without JavaScript; motion only when allowed. */
:root{--vc-ink:#151412; --vc-rule:rgba(28,27,25,.14); --vc-rule-d:rgba(243,239,231,.16);
  --vc-ease:cubic-bezier(.2,.7,.2,1); --vc-sub:52px;
  --vc-bleed:max(24px,calc((100vw - 1180px) / 2 + 24px));
}
html:has(body.vc){scroll-padding-top:calc(var(--hh) + var(--vc-sub) + 12px)}
@media (max-width:900px){html:has(body.vc){scroll-padding-top:calc(var(--hh) + 8px)}}
@media (prefers-reduced-motion:no-preference){html:has(body.vc){scroll-behavior:smooth}}
body.vc{font-size:17px}
body.vc main{overflow-x:clip}
.vc h1,.vc h2,.vc h3{text-wrap:balance}
.vc p,.vc li,.vc blockquote{text-wrap:pretty}
.vc-sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
.vc-eye{font-size:13px;letter-spacing:.16em;text-transform:uppercase;font-weight:600;color:var(--ochre-t)}
.vc-h2{font-size:clamp(34px,3.7vw,54px);line-height:1.02;letter-spacing:-.035em;font-weight:500;margin-top:14px}
.vc-lab{font-size:13px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:var(--muted-2)}
.vc a.vc-ul{border-bottom:1px solid var(--ochre);padding-bottom:1px;transition:color .2s}
.vc a.vc-ul:hover{color:var(--ochre-t)}

/* ---------- opener ---------- */
.vc-open{position:relative;height:100vh;height:100svh;min-height:620px;max-height:1080px;color:#fff;background:#23292a;overflow:hidden;isolation:isolate}
.vc-open-ph{position:absolute;inset:0;z-index:-2;overflow:hidden}
.vc-open-ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:var(--focus,50% 50%);transform-origin:var(--focus,50% 50%)}
@media (prefers-reduced-motion:no-preference){
  .vc-open-ph img{animation:vc-settle 4.8s cubic-bezier(.2,.6,.2,1) both}
  .vc-open-foot>*{animation:vc-rise 1s var(--vc-ease) both}
  .vc-open-foot>*:nth-child(2){animation-delay:.08s}.vc-open-foot>*:nth-child(3){animation-delay:.16s}
}
@keyframes vc-settle{from{transform:scale(1.07)}to{transform:none}}
@keyframes vc-rise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.vc-open::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:
  linear-gradient(180deg,rgba(12,14,15,.55) 0,rgba(12,14,15,.22) 120px,rgba(12,14,15,0) 240px),
  linear-gradient(0deg,rgba(12,14,15,.84) 0,rgba(12,14,15,.64) 22%,rgba(12,14,15,.32) 44%,rgba(12,14,15,0) 66%),
  linear-gradient(90deg,rgba(12,14,15,.34) 0,rgba(12,14,15,0) 60%)}
.vc-open-in{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;padding-top:var(--hh)}
.vc-open-foot{padding-bottom:clamp(28px,4.4vw,56px)}
.vc-h1{display:flex;flex-direction:column-reverse;font-weight:500}
.vc-h1-name{display:block;font-size:clamp(64px,9.6vw,150px);line-height:.88;letter-spacing:-.052em;margin-left:-.04em;text-wrap:balance}
.vc-h1-place{display:block;font-size:13px;letter-spacing:.18em;text-transform:uppercase;font-weight:600;line-height:1.4;color:var(--ochre-lt);margin-bottom:clamp(14px,1.8vw,24px)}
.vc-tag{font-size:clamp(20px,1.95vw,28px);line-height:1.3;letter-spacing:-.012em;max-width:30ch;margin-top:clamp(16px,1.8vw,26px);color:rgba(255,255,255,.94)}
.vc-facts{display:flex;align-items:center;justify-content:space-between;gap:16px 28px;flex-wrap:wrap;margin-top:clamp(22px,3vw,40px);padding-top:16px;border-top:1px solid rgba(255,255,255,.34)}
.vc-facts ul{display:flex;flex-wrap:wrap;list-style:none;font-size:15px;line-height:1.5;color:rgba(255,255,255,.9);font-variant-numeric:tabular-nums}
.vc-facts li+li::before{content:"";display:inline-block;width:4px;height:4px;border-radius:50%;background:var(--ochre-l);margin:0 12px;vertical-align:3px}
.vc-open-cta{display:flex;align-items:center;gap:12px}
.vc-open-price{font-size:15px;color:rgba(255,255,255,.86);margin-right:6px;white-space:nowrap}
.vc-open-price b{font-size:22px;font-weight:600;color:#fff;letter-spacing:-.01em}
.vc .btn.ochre{border:0;cursor:pointer;font-family:var(--body)}
.vc-glass{display:inline-flex;align-items:center;gap:9px;min-height:44px;padding:0 18px;border-radius:999px;border:1px solid rgba(255,255,255,.55);background:rgba(20,19,17,.26);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);color:#fff;font:500 14px var(--body);cursor:pointer;white-space:nowrap;transition:background .2s,color .2s}
.vc-glass:hover{background:#fff;color:var(--ink)}
.vc-glass:focus-visible{outline:2px solid #fff;outline-offset:2px}
.vc-glass svg{flex:0 0 auto}
.vc-open-cta .btn{min-height:44px;display:inline-flex;align-items:center;border-radius:999px;padding:0 22px;font-size:15px}

/* ---------- sub-navigation: the page's chapters, plus the price and the booking link ---------- */
.vc-sub{position:sticky;top:var(--hh);z-index:15;background:rgba(250,248,243,.96);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.vc-sub .wrap{display:flex;align-items:center;gap:24px;height:var(--vc-sub)}
nav.vc-links{display:flex;gap:26px;font-size:14px;overflow-x:auto;scrollbar-width:none;height:100%;align-items:stretch}
nav.vc-links::-webkit-scrollbar{display:none}
nav.vc-links a{display:flex;align-items:center;white-space:nowrap;color:var(--muted-2);border-bottom:2px solid transparent;transition:color .2s,border-color .2s}
nav.vc-links a:hover{color:var(--ink)}
nav.vc-links a.on{color:var(--ink);border-bottom-color:var(--ochre)}
.vc-sub-cta{margin-left:auto;display:flex;align-items:center;gap:16px;font-size:14px;color:var(--muted-2);white-space:nowrap}
.vc-sub-cta b{color:var(--ink);font-weight:600;font-size:16px}
.vc-sub-cta .btn{padding:8px 16px;font-size:14px}

/* ---------- overview, before you book, booking card ---------- */
.vc-ov{padding-top:clamp(56px,7vw,104px)}
.vc-ov-g{display:grid;grid-template-columns:minmax(0,1fr) 372px;gap:clamp(40px,6.4vw,96px);align-items:start}
.vc-lede{font-size:clamp(22px,2.05vw,29px);line-height:1.42;letter-spacing:-.014em;color:var(--ink);max-width:34ch}
.vc-prose p{font-size:17px;line-height:1.72;color:var(--muted-2);max-width:62ch;margin-top:18px}
.vc-prose p:first-child{margin-top:26px}
.vc-bb{margin-top:clamp(64px,7vw,104px);padding-top:26px;border-top:1px solid var(--ink)}
.vc-bb-lead{font-size:18px;line-height:1.55;color:var(--muted-2);max-width:48ch;margin-top:14px}
.vc-bb-cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));margin-top:34px}
.vc-bb-col{padding-right:28px}
.vc-bb-col+.vc-bb-col{padding:0 0 0 28px;border-left:1px solid var(--vc-rule)}
.vc-bb-col h3{display:flex;align-items:center;gap:10px;font-size:13px;letter-spacing:.16em;text-transform:uppercase;font-weight:600;font-family:var(--body);padding-bottom:14px;border-bottom:1px solid var(--ink)}
.vc-mk{flex:0 0 10px;width:10px;height:10px;border-radius:50%;background:var(--ochre)}
.vc-mk.ring{background:none;border:1.5px solid var(--ink)}
.vc-bb ol{list-style:none}
.vc-bb li{padding:18px 0 20px;border-bottom:1px solid var(--vc-rule)}
.vc-bb li b{display:block;font-size:19px;line-height:1.3;font-weight:500;letter-spacing:-.01em}
.vc-bb li p{font-size:16px;line-height:1.6;color:var(--muted-2);margin-top:6px}
.vc-bb figure{margin:14px 0 0;padding-left:14px;border-left:2px solid var(--ochre-l)}
.vc-bb blockquote{font-size:16px;line-height:1.55;color:var(--ink)}
.vc-bb figcaption{font-size:14px;color:var(--muted-2);margin-top:4px}
.vc-ov aside{position:sticky;top:calc(var(--hh) + var(--vc-sub) + 24px)}
.vc-card{background:#fff;border:1px solid var(--line);box-shadow:0 18px 50px rgba(28,27,25,.07);padding:28px 28px 22px}
.vc-card h2{font-size:13px;letter-spacing:.16em;text-transform:uppercase;font-weight:600;font-family:var(--body);color:var(--muted-2)}
.vc-card-price{margin-top:10px;font-size:15px;color:var(--muted-2)}
.vc-card-price b{font-size:36px;font-weight:500;letter-spacing:-.03em;color:var(--ink);margin:0 4px;font-variant-numeric:tabular-nums}
.vc-card-season{font-size:15px;color:var(--muted-2);margin-top:4px}
.vc-fields{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--line);margin-top:20px}
.vc-fields label{display:block;padding:10px 14px 9px;font-size:12px;letter-spacing:.1em;text-transform:uppercase;font-weight:600;color:var(--muted-2);cursor:pointer}
.vc-fields label+label{border-left:1px solid var(--line)}
.vc-fields .full{grid-column:1/-1;border-top:1px solid var(--line);border-left:0!important}
.vc-fields input,.vc-fields select{display:block;width:100%;border:0;background:none;font:16px var(--body);color:var(--ink);margin-top:4px;padding:2px 0;letter-spacing:0;text-transform:none;min-height:28px}
.vc-fields label:focus-within{box-shadow:inset 0 -2px 0 var(--ochre)}
.vc-fields input:focus-visible,.vc-fields select:focus-visible{outline:none}
.vc-form .btn.ochre{width:100%;margin-top:16px;min-height:52px;font-size:16px;text-align:center}
.vc-rule-note{font-size:15px;color:var(--muted-2);text-align:center;margin-top:12px}
.vc-card-foot{margin-top:18px;padding-top:16px;border-top:1px solid var(--line);font-size:15px;line-height:1.55;color:var(--muted-2)}
.vc-card-foot p+p{margin-top:10px}
.vc-card-links{display:flex;flex-wrap:wrap;gap:6px 18px;margin-top:8px}
.vc-card-links a{color:var(--ink);font-weight:600;border-bottom:1px solid var(--ochre);padding-bottom:1px}
.vc-card-links a.wa{border-color:var(--sea);color:var(--sea)}

/* ---------- the room tour: the room stays pinned while its photos pass (CSS sticky, no script needed) ---------- */
.vc-tour{background:var(--vc-ink);color:var(--lime);margin-top:clamp(88px,9vw,144px);padding:clamp(72px,8vw,120px) 0 clamp(72px,8vw,120px);overflow-x:clip}
.vc-tour .vc-eye{color:var(--ochre-lt)}
.vc-tour-h{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(28px,4vw,64px);align-items:end;margin-bottom:clamp(48px,6vw,88px)}
.vc-tour-h .vc-h2{color:#fff}
.vc-tour-h p{font-size:17px;color:rgba(243,239,231,.72);margin-top:14px;max-width:34ch}
.vc-idx{list-style:none;display:grid;grid-template-columns:repeat(var(--cols,2),minmax(0,1fr));column-gap:28px}
.vc-idx a{display:flex;align-items:baseline;gap:14px;padding:12px 0;border-top:1px solid var(--vc-rule-d);font-size:16px;color:rgba(243,239,231,.86);transition:color .2s}
.vc-idx a span{font-size:13px;letter-spacing:.1em;color:var(--ochre-lt);font-variant-numeric:tabular-nums;font-weight:600}
.vc-idx a:hover{color:#fff}
.vc-idx a:focus-visible,.vc-tour a:focus-visible{outline-color:var(--ochre-lt)}
.vc-stop{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(28px,4vw,64px);padding-bottom:clamp(64px,8vw,128px)}
.vc-stop:last-of-type{padding-bottom:0}
.vc-stop-txt{position:sticky;top:calc(var(--hh) + var(--vc-sub) + 36px);align-self:start}
.vc-seg{display:flex;gap:4px;margin-bottom:24px}
.vc-seg i{flex:1;height:2px;background:rgba(243,239,231,.16)}
.vc-seg i.d{background:rgba(243,239,231,.5)}
.vc-seg i.on{background:var(--ochre-l)}
.vc-stop-n{font-size:13px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:var(--ochre-lt);font-variant-numeric:tabular-nums}
.vc-stop h3{font-size:clamp(32px,3.3vw,50px);line-height:1.02;letter-spacing:-.034em;color:#fff;margin-top:10px}
.vc-stop-txt p{font-size:17px;line-height:1.6;color:rgba(243,239,231,.76);margin-top:14px;max-width:30ch}
.vc-stop-ph{display:grid;gap:16px;margin-right:calc(-1 * var(--vc-bleed))}
.vc-stop-ph figure{margin:0;overflow:hidden}
.vc-stop-ph .vc-im{overflow:hidden;background:#24221f}
.vc-stop-ph img{height:auto}
.vc-stop-ph figcaption{font-size:14px;color:rgba(243,239,231,.62);margin-top:10px}
html.vc-motion .vc-stop-ph .vc-im{clip-path:inset(9% 0 0 0);transition:clip-path 1.1s var(--vc-ease)}
html.vc-motion .vc-stop-ph .vc-im img{transform:scale(1.06);transition:transform 1.6s var(--vc-ease)}
html.vc-motion .vc-stop-ph .vc-in .vc-im{clip-path:inset(0)}
html.vc-motion .vc-stop-ph .vc-in .vc-im img{transform:none}

/* ---------- information sections ---------- */
.vc-sec{padding-top:clamp(88px,9vw,144px)}
.vc-sec-g{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(28px,4vw,64px);padding-top:26px;border-top:1px solid var(--ink)}
.vc-sec-g>div:first-child .vc-h2{margin-top:0}
.vc-side p{font-size:16px;line-height:1.6;color:var(--muted-2);margin-top:16px;max-width:34ch}
.vc-nums{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));margin-top:30px;border-top:1px solid var(--vc-rule)}
.vc-nums div{padding:16px 0 14px;border-bottom:1px solid var(--vc-rule)}
.vc-nums div:nth-child(odd){padding-right:16px;border-right:1px solid var(--vc-rule)}
.vc-nums div:nth-child(even){padding-left:18px}
.vc-nums b{display:block;font-size:44px;line-height:1;font-weight:500;letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.vc-nums span{font-size:15px;color:var(--muted-2)}
.vc-am{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
.vc-am h3,.vc-inc h3{font-size:13px;letter-spacing:.16em;text-transform:uppercase;font-weight:600;font-family:var(--body);color:var(--muted-2);padding-bottom:12px;border-bottom:1px solid var(--ink)}
.vc-am ul,.vc-inc ul{list-style:none}
.vc-am li{padding:11px 0;border-bottom:1px solid var(--vc-rule);font-size:16px;line-height:1.45}
.vc-pt{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
.vc-pt caption{text-align:left}
.vc-pt th{text-align:left;font-size:13px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:var(--muted-2);padding:0 0 12px;border-bottom:1px solid var(--ink)}
.vc-pt th:last-child{text-align:right}
.vc-pt td{padding:15px 0;border-bottom:1px solid var(--vc-rule);font-size:16px;vertical-align:middle}
.vc-pt td:first-child{width:36%;padding-right:16px;white-space:nowrap}
.vc-pt .vc-pc{display:flex;align-items:center;gap:16px}
.vc-pt .vc-bar{flex:1;height:8px;background:var(--lime);position:relative}
.vc-pt .vc-bar i{position:absolute;left:0;top:0;bottom:0;width:calc(var(--w) * 100%);background:#d9c7ab}
.vc-pt tr.pk .vc-bar i{background:var(--ochre)}
.vc-pt .vc-pc b{min-width:84px;text-align:right;font-weight:600;font-size:17px}
.vc-pt tr.pk td:first-child::after{content:attr(data-pk);margin-left:10px;font-size:12px;letter-spacing:.1em;text-transform:uppercase;font-weight:600;color:var(--ochre-t)}
.vc-inc{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px;margin-top:44px}
.vc-inc li{display:flex;gap:12px;padding:11px 0;border-bottom:1px solid var(--vc-rule);font-size:16px;line-height:1.45}
.vc-inc li::before{content:"";flex:0 0 12px;height:7px;margin-top:8px;border-left:1.6px solid var(--ochre-t);border-bottom:1.6px solid var(--ochre-t);transform:rotate(-45deg) translateY(-2px)}
.vc-inc .no li::before{height:0;border-left:0;border-bottom:1.6px solid var(--muted);transform:none;margin-top:11px}
.vc-loc{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(28px,4vw,64px);align-items:start}
.vc-dist{list-style:none;border-top:1px solid var(--ink)}
.vc-dist li{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:14px 0;border-bottom:1px solid var(--vc-rule);font-size:16px}
.vc-dist li span:last-child{color:var(--muted-2);font-variant-numeric:tabular-nums;white-space:nowrap}
.vc-loc-notes{margin-top:18px}
.vc-loc-notes p{font-size:15px;color:var(--muted-2);line-height:1.55}
.vc-loc-notes p+p{margin-top:6px}
.vc-loc-notes .vc-ul{display:inline-block;margin-top:18px;font-size:16px}
.vc-rev-h{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;flex-wrap:wrap}
.vc-score{display:flex;align-items:flex-end;gap:16px}
.vc-score b{font-size:clamp(64px,6.4vw,96px);line-height:.86;font-weight:500;letter-spacing:-.05em}
.vc-score span{font-size:15px;color:var(--muted-2);line-height:1.4}
.vc-score i{display:block;font-style:normal;color:var(--ochre);letter-spacing:3px;font-size:16px}
.vc-chip{display:inline-block;font-size:12px;letter-spacing:.12em;text-transform:uppercase;font-weight:600;color:var(--ochre-t);border:1px solid #e2c9a6;background:#fbf3e7;padding:4px 10px;border-radius:999px;margin-left:10px;vertical-align:middle}
.vc-quotes{display:grid;grid-template-columns:repeat(var(--n,3),minmax(0,1fr));gap:clamp(24px,3vw,44px);margin-top:44px}
.vc-quotes figure{margin:0;padding-top:20px;border-top:1px solid var(--ink)}
.vc-quotes blockquote{font-size:clamp(19px,1.55vw,22px);line-height:1.45;letter-spacing:-.01em}
.vc-quotes figcaption{font-size:15px;color:var(--muted-2);margin-top:14px}
.vc-norev{font-size:19px;line-height:1.5;max-width:40ch}
.vc-norev a{display:inline-block;margin-top:16px;font-size:16px}
.vc-guides{list-style:none;border-top:1px solid var(--ink)}
.vc-guides a{display:flex;justify-content:space-between;gap:20px;padding:18px 0;border-bottom:1px solid var(--vc-rule);font-size:19px;letter-spacing:-.01em;transition:color .2s}
.vc-guides a i{font-style:normal;color:var(--ochre-t);transition:transform .3s var(--vc-ease)}
.vc-guides a:hover{color:var(--ochre-t)}.vc-guides a:hover i{transform:translateX(4px)}
.vc-more{padding-bottom:clamp(88px,9vw,140px)}

/* ---------- WhatsApp bubble (desktop): away while the opener or the booking card is on screen ---------- */
body.vc .fwa{transition:opacity .3s,transform .3s}

/* ---------- phone booking bar (WhatsApp merged in) ---------- */
.vc-dock{display:none}
@media (max-width:900px){
  .vc-dock{display:flex;align-items:center;gap:10px;position:fixed;left:0;right:0;bottom:0;z-index:45;background:rgba(250,248,243,.97);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-top:1px solid var(--line);padding:10px 16px calc(10px + env(safe-area-inset-bottom,0px));transition:transform .35s var(--vc-ease),visibility .35s}
  .vc-dock.vc-off{transform:translateY(110%);visibility:hidden}
  .vc-dock-p{flex:1;min-width:0;line-height:1.2;font-size:14px;color:var(--muted-2)}
  .vc-dock-p b{display:block;font-size:20px;font-weight:600;letter-spacing:-.01em;color:var(--ink);font-variant-numeric:tabular-nums}
  .vc-dock-wa{flex:0 0 46px;width:46px;height:46px;border-radius:50%;border:1px solid var(--sea);color:var(--sea);display:grid;place-items:center}
  .vc-dock .btn{flex:0 0 auto;min-height:46px;display:inline-flex;align-items:center;padding:0 18px;font-size:15px;border-radius:999px}
  body.vc{padding-bottom:calc(67px + env(safe-area-inset-bottom,0px))}
  body.vc .fwa{display:none}
}

/* ---------- dialogs: the booking sheet and all photos ---------- */
dialog.vc-sheet{border:0;padding:0;margin:auto;width:min(440px,calc(100% - 32px));max-height:calc(100% - 32px);background:var(--paper);color:var(--ink);box-shadow:0 30px 80px rgba(0,0,0,.3)}
dialog.vc-sheet::backdrop{background:rgba(20,19,17,.55)}
.vc-sheet-h{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:22px 22px 0}
.vc-sheet-h h2{font-size:22px;letter-spacing:-.02em}
.vc-sheet-h p{font-size:15px;color:var(--muted-2);margin-top:4px}
.vc-x{flex:0 0 44px;width:44px;height:44px;border:1px solid var(--line);background:#fff;border-radius:50%;font-size:22px;line-height:1;cursor:pointer;color:var(--ink)}
.vc-sheet-b{padding:4px 22px 24px}
@media (prefers-reduced-motion:no-preference){
  dialog.vc-sheet[open]{animation:vc-pop .32s var(--vc-ease)}
}
@keyframes vc-pop{from{opacity:0;transform:translateY(14px)}}
@keyframes vc-fade{from{opacity:0}}

/* ---------- tablets and phones ---------- */
@media (max-width:1100px){
  .vc-ov-g{grid-template-columns:minmax(0,1fr) 340px;gap:40px}
  .vc-bb-cols{grid-template-columns:1fr}
  .vc-bb-col+.vc-bb-col{padding:30px 0 0;border-left:0}
  .vc-bb-col{padding-right:0}
}
@media (max-width:900px){
  .vc-open{height:calc(100svh - 67px);min-height:560px;max-height:none}
  .vc-open-cta .btn,.vc-open-price,.vc-f-x{display:none}
  .vc-facts{flex-wrap:nowrap;align-items:flex-end}
  .vc-facts ul{font-size:15px}
  .vc-sub{position:static}
  .vc-sub .wrap{padding:0;height:50px}
  nav.vc-links{display:flex;padding:0 24px;gap:22px}
  .vc-sub-cta{display:none}
  .vc-ov-g{grid-template-columns:1fr;gap:0}
  .vc-ov aside{position:static;margin-top:56px}
  .vc-card{box-shadow:none;padding:24px 20px 20px}
  .vc-tour-h{grid-template-columns:1fr;gap:28px}
  .vc-idx{--cols:1!important}
  .vc-stop{grid-template-columns:1fr;gap:0;padding-bottom:48px}
  .vc-stop-txt{top:var(--hh);z-index:3;margin:0 -24px;padding:14px 24px 14px;background:rgba(21,20,18,.9);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
  .vc-seg{margin-bottom:10px}
  .vc-stop-n{display:inline;font-size:12px;margin-right:8px}
  .vc-stop h3{display:inline;font-size:22px;letter-spacing:-.015em;margin:0}
  .vc-stop-txt p{font-size:15px;margin-top:4px;max-width:none;line-height:1.45}
  .vc-stop-ph{margin:0 -24px;gap:4px}
  .vc-stop-ph figcaption{position:absolute!important;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
  .vc-am{grid-template-columns:1fr 1fr}
  .vc-quotes{grid-template-columns:1fr}
}
@media (max-width:620px){
  .vc-h1-name{font-size:clamp(56px,17vw,72px);line-height:.9}
  .vc-h1-place{font-size:12px;letter-spacing:.14em}
  .vc-tag{font-size:19px}
  .vc-facts{gap:12px}
  .vc-facts ul{font-size:14px}
  .vc-facts li+li::before{margin:0 8px}
  .vc-glass{padding:0 14px}
  .vc-glass .vc-gl-t{display:none}
  .vc-lede{font-size:21px}
  .vc-nums b{font-size:38px}
  .vc-pt td:first-child{width:auto;white-space:normal}
  .vc-pt .vc-pc{gap:10px}.vc-pt .vc-pc b{min-width:70px}
  .vc-pt tr.pk td:first-child::after{display:block;margin:2px 0 0}
}
@media (prefers-reduced-motion:reduce){
  .vc-dock,body.vc .fwa{transition:none}
}


/* ---------- site integration: lightbox buttons, rooms without photos, locator, other villas ---------- */
body.vc main>.crumbs{z-index:3}
button.vc-im{display:block;width:100%;padding:0;border:0;background:#24221f;cursor:zoom-in;overflow:hidden}
button.vc-im:focus-visible{outline:2px solid var(--ochre-lt);outline-offset:3px}
.vc-stop-ph img{display:block;width:100%}
.vc-bare{margin-top:clamp(56px,6vw,88px);padding-top:22px;border-top:1px solid var(--vc-rule-d)}
.vc-bare ul{list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:28px;margin-top:14px}
.vc-bare li{padding:12px 0;border-bottom:1px solid var(--vc-rule-d);font-size:16px;color:rgba(243,239,231,.76)}
.vc-bare li b{display:block;color:#fff;font-weight:500}
.vc-loc{display:block}
.vc-loc .vc-dist{margin-top:28px}
.vc-card .lead,.vc-card form:not(.vc-form){margin-top:16px}
.vc-more .villas{margin-top:40px}
.vc-norev{font-size:19px;line-height:1.5;max-width:40ch}
@media (max-width:900px){.vc-bare ul{grid-template-columns:1fr}.vc-more .villas{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:620px){.vc-more .villas{grid-template-columns:1fr}}

/* ================= 3D walk-through (villa with "tour3d"): poster frame cycling four views, links to /tour/… ================= */
.t3{background:var(--sea);color:var(--lime);padding:72px 0}
.vc .t3{padding:clamp(72px,8vw,112px) 0}
.t3 .wrap{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:56px;align-items:center}
.t3-frame{margin:0}
.t3-poster{position:relative;display:block;aspect-ratio:3/2;overflow:hidden;background:#173a43;color:var(--lime)}
.t3-poster>img{position:absolute;top:0;left:0;width:200%;max-width:none;height:auto}
.t3-poster.t3-one img{width:100%;height:100%;object-fit:cover}
@media (prefers-reduced-motion:no-preference){.t3-poster:not(.t3-one)>img{animation:t3cycle 14s infinite}}
@keyframes t3cycle{0%,24.99%{transform:translate(0,0)}25%,49.99%{transform:translate(-50%,0)}50%,74.99%{transform:translate(0,-50%)}75%,100%{transform:translate(-50%,-50%)}}
.t3-poster:hover>img,.t3-poster:focus-visible>img{animation-play-state:paused}
.t3-poster::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(15,35,40,.35) 0,rgba(15,35,40,0) 30%,rgba(15,35,40,0) 55%,rgba(15,35,40,.7) 100%)}
.t3-poster:focus-visible{outline:2px solid var(--ochre-l);outline-offset:3px}
.t3-cap{position:absolute;z-index:1;top:14px;left:16px;font-size:11px;letter-spacing:.12em;text-transform:uppercase;opacity:.9}
.t3-play{position:absolute;z-index:1;left:16px;bottom:16px;display:inline-flex;align-items:center;gap:10px;background:var(--lime);color:var(--ink);padding:12px 18px 12px 14px;font-size:14px;font-weight:500;letter-spacing:.02em;transition:background .25s}
.t3-poster:hover .t3-play,.t3-poster:focus-visible .t3-play{background:#fff}
.t3-strip{display:block;margin-top:10px;aspect-ratio:4/1;overflow:hidden;position:relative}
.t3-strip img{position:absolute;top:0;left:0;width:100%;max-width:none;height:auto}
.t3-frame figcaption{font-size:13px;opacity:.75;margin-top:8px}
.t3 .eyebrow{color:var(--ochre-l)}
.t3 h2{font-size:clamp(30px,3.6vw,46px);margin:0 0 18px;color:var(--lime)}
.t3 p{opacity:.88;max-width:44ch;margin:0}
.t3-facts{list-style:none;padding:0;margin:26px 0 30px;display:flex;flex-wrap:wrap;border-top:1px solid rgba(243,239,231,.22)}
.t3-facts li{padding:12px 18px 0 0;margin-right:18px;font-size:14px;font-variant-numeric:tabular-nums}
.t3-facts li+li{border-left:1px solid rgba(243,239,231,.22);padding-left:18px}
.t3-ctas{display:flex;flex-wrap:wrap;gap:12px 22px;align-items:center}
.t3-ctas .btn{background:var(--lime);color:var(--ink)}
.t3-ctas .lnk{color:var(--lime);text-decoration:underline;text-underline-offset:4px;font-size:15px}
@media (max-width:900px){.t3 .wrap{grid-template-columns:1fr;gap:32px}}
@media (max-width:560px){.t3{padding:48px 0}.t3-facts li{padding-right:12px;margin-right:12px}.t3-facts li+li{padding-left:12px}}

/* ================= editorial villa card (.v.ec): 4:5 photo with a second photo on hover, coast tag, tagline, tabular price ================= */
.villas:has(>.ec-w){gap:48px 24px}
.ec{display:block;color:inherit}
.ec .ec-ph{position:relative;aspect-ratio:4/5;overflow:hidden;background:var(--line)}
.ec-ph .pa,.ec-ph .pb,.ec-ph picture{position:absolute;inset:0}
.ec-ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.v.ec .ph .pa img{transition:transform 1.4s cubic-bezier(.2,.7,.2,1)}
.v.ec .ph .pb img{transform:none;transition:none}
.ec-ph .pb{opacity:0;transition:opacity .7s ease}
@media (hover:hover){.ec:hover .pb{opacity:1}.v.ec:hover .ph .pa img{transform:scale(1.04)}}
.ec:focus-visible{outline:2px solid var(--ochre);outline-offset:4px}
.ec:focus-visible .pb{opacity:1}
.ec .tag{z-index:2}
.ec-coast{position:absolute;z-index:1;left:10px;bottom:10px;display:inline-flex;align-items:center;gap:7px;background:rgba(250,248,243,.94);color:var(--ink);font-size:11px;letter-spacing:.08em;text-transform:uppercase;padding:6px 9px 6px 8px}
.ec[data-coast=east] .sun{color:var(--ochre)}.ec[data-coast=west] .sun{color:#b5502e}
.ec-ex{position:absolute;z-index:1;top:10px;right:10px;background:rgba(28,27,25,.72);color:var(--lime);font-size:10px;letter-spacing:.12em;text-transform:uppercase;padding:4px 7px}
.ec-top{margin-top:16px;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.v.ec .ec-name{font-size:22px;margin:6px 0}
.ec-tl{margin:0;color:var(--muted-2);font-size:15px;line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.9em}
.ec-foot{display:flex;justify-content:space-between;align-items:baseline;gap:4px 10px;flex-wrap:wrap;margin-top:14px;padding-top:12px;border-top:1px solid var(--line);font-size:14px;color:var(--muted-2)}
.ec-meta i{font-style:normal;margin:0 6px;color:var(--muted)}
.v.ec .ec-price{margin:0;font-size:14px;font-variant-numeric:tabular-nums;white-space:nowrap}
.ec-price b{font-family:var(--head);font-weight:500;font-size:17px;color:var(--ink)}
.ec-price small{font-size:13px;color:var(--muted-2)}
.v.ec .ec-price small{display:inline;margin:0}
.im-card .ec .ec-tl,.im-card .ec .ec-coast,.im-card .ec .pb{display:none}
.im-card .ec .ec-top{margin-top:12px}
.im-card .ec .ec-foot{margin-top:8px;padding-top:8px}
@media (max-width:1100px){.villas:has(>.ec-w):not(.n1):not(.n2){grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:900px){.villas:has(>.ec-w):not(.n1){grid-template-columns:repeat(2,minmax(0,1fr));gap:40px 18px}}
@media (max-width:560px){.villas:has(>.ec-w){grid-template-columns:1fr;gap:44px}}
@media (prefers-reduced-motion:reduce){.v.ec .ph .pa img,.ec-ph .pb{transition:none}.v.ec:hover .ph .pa img{transform:none}}
/* mobile check fixes: date placeholder fits one line; sheet body painted to the bottom edge */
.tc-ph{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;right:44px}
dialog.sheet .sheet-body{background:var(--paper);padding-bottom:calc(20px + env(safe-area-inset-bottom,0px))}
/* mobile check: villa card grids drop to 2 columns, then 1, whatever modifier classes the grid carries */
@media (max-width:900px){.villas:has(>.ec-w):not(.n1):not(.n2),.villas.n2:has(>.ec-w){grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.villas:has(>.ec-w):not(.n1):not(.n2),.villas.n2:has(>.ec-w),.villas.n1:has(>.ec-w){grid-template-columns:1fr}}
/* almanac: reserve room for the live verdict so nothing below jumps when the data arrives (Greek runs longer) */
.alm [data-alm="big"]{min-height:2.3em}
.alm [data-alm="why"]{min-height:6.6em}
@media (max-width:620px){.alm [data-alm="why"]{min-height:10.5em}}
/* 360px: the almanac chart must never be wider than its column */
.alm-map{overflow:hidden;max-width:100%}.alm-map svg{max-width:100%;height:auto;display:block}
.alm [data-alm="big"]{overflow-wrap:break-word;max-width:100%}
@media (max-width:420px){.alm [data-alm="big"]{font-size:clamp(40px,13vw,56px)}}
.im-sprite{position:absolute;width:0;height:0;overflow:hidden;pointer-events:none}
.im-svg,.alm-map svg,.alm svg{overflow:hidden}
@media (max-width:420px){.alm-suntimes dd{white-space:normal;overflow-wrap:anywhere;font-size:clamp(20px,6.4vw,26px)}.alm-suntimes>div{padding-right:8px}}

/* ===== UI fixes (round 2) ===== */
/* 1: booking-card links read as two clean buttons, no offset underlines */
.vc-card-links{display:grid;grid-template-columns:repeat(auto-fit,minmax(128px,1fr));gap:10px;margin-top:14px}
.vc-card-links a{display:flex;align-items:center;justify-content:center;min-height:44px;padding:0 14px;border:1px solid var(--ink);border-bottom:1px solid var(--ink);text-align:center;font-size:15px;font-weight:600;line-height:1.2;color:var(--ink);text-decoration:none}
.vc-card-links a.wa{border-color:var(--sea);color:var(--sea)}
.vc-card-links a:hover{background:var(--ink);color:var(--lime)}.vc-card-links a.wa:hover{background:var(--sea);color:var(--lime)}
/* 2: date and weeks fields fit */
.vc-fields input[type=date]{min-width:0;max-width:100%}
.vc-fields select{text-overflow:clip}
@media (max-width:480px){
  .vc-fields{grid-template-columns:minmax(0,1fr)}
  .vc-fields label+label{border-left:0;border-top:1px solid var(--line)}
  .vc-fields input,.vc-fields select{font-size:16px;min-height:32px}
}
/* 4: eyebrows over photos keep their contrast */
.tc-eb,.tc-peek small,.areahero .eyebrow{text-shadow:0 1px 2px rgba(10,10,10,.55),0 0 14px rgba(10,10,10,.45)}
.tc-eb{color:#fff}.tc-eb>span:first-child{color:#ffe7c4}
.tc-side::after{background:linear-gradient(180deg,rgba(12,14,16,.5) 0%,rgba(12,14,16,.18) 26%,rgba(12,14,16,0) 44%,rgba(12,14,16,0) 46%,rgba(12,14,16,.55) 68%,rgba(12,14,16,.8) 100%)}
.areahero::after{background:linear-gradient(180deg,rgba(20,18,15,.18) 0%,rgba(20,18,15,.1) 28%,rgba(20,18,15,.62) 66%,rgba(20,18,15,.82))}
.areahero .eyebrow{color:#ffe7c4!important}
/* 5: map credit readable on the light section */
.im-cap,.im-cap a{color:var(--ink)}
.im-cap .im-leg,.im-cap>span{color:var(--ink)}
/* 6: almanac coast labels stay inside the chart, off the coastline, on phones */
@media (max-width:620px){
  .alm-coast{white-space:normal;max-width:38%}
  .alm-coast[data-coast=west]{left:3%!important;transform:translate(0,-50%);align-items:flex-start;text-align:left}
  .alm-coast[data-coast=east]{left:auto!important;right:3%;top:37%!important;transform:translate(0,-50%);align-items:flex-end;text-align:right}
}
/* 7: one rule per step (the .n counter inside an item must not draw its own) */
.proc div.n,.steps div.n{border-top:0;padding-top:0}
.three>div,.three>div>div{border-top:0}
.formbox .formtitle{margin:0 0 20px;line-height:1.15}
/* 8: chips wrap instead of clipping */
@media (max-width:700px){.chips{flex-wrap:wrap;overflow:visible;margin-inline:0;padding:2px 0 4px}.chip{flex:0 1 auto}}
/* 10: card footer: meta on one line, price on its own line */
.ec-foot{display:grid;gap:6px;justify-content:stretch}
.v.ec .ec-price{justify-self:start}
/* 11 */
.sh a{white-space:nowrap;flex:none}.sh>div{min-width:0}
/* 12 */
@media (max-width:560px){
  .fbar label,.filters label{flex:1 1 100%}
  .fbar select,.filters select{font-size:16px;text-overflow:ellipsis}
}
/* 13 */
.gv .gv-src{grid-column:1/-1;font-size:13px;line-height:1.5;opacity:.75;border-top:1px solid rgba(243,239,231,.25);padding-top:14px}
.gv .gv-src p{margin:0}.gv .gv-src a{color:inherit;text-decoration:underline;text-underline-offset:2px}
@media (max-width:640px){
  .gv dl{grid-template-columns:minmax(0,1fr);gap:0}
  .gv dd{margin:2px 0 16px}
}
/* 15: listing facts, gallery and phone layout */
.pfacts .wide{grid-column:1/-1}
.pfacts .wide b{font-family:var(--body);font-size:16px;font-weight:400;line-height:1.45;display:block;margin-top:2px}
@media (min-width:981px){.pfacts>.ls{grid-column:span var(--sp,1)}}
@media (max-width:980px){.pfacts>.ls:nth-child(odd){grid-column:1/-1}.pcols{gap:28px;padding:24px 0 8px}}
.gallery.n1{grid-template-columns:1fr}.gallery.n1 .g1{grid-row:1/3}
.gallery.n2{grid-template-columns:3fr 2fr}.gallery.n2 .g1,.gallery.n2 .g2{grid-row:1/3}
.gallery.n3 .g1{grid-row:1/3}
.gallery.n4 .g4{grid-column:2/4}
@media (max-width:700px){
  .gallery.n1{grid-template-columns:1fr;grid-template-rows:240px}
  .gallery.n2{grid-template-columns:1fr 1fr;grid-template-rows:220px 120px}.gallery.n2 .g1{grid-row:1}.gallery.n2 .g2{grid-column:1/3;grid-row:2}
  .gallery.n3 .g1,.gallery.n4 .g1,.gallery.n5 .g1{grid-row:1}.gallery.n4 .g4{grid-column:auto}
  .gallery .all{right:8px;bottom:8px;font-size:12px;padding:6px 10px}
  .gallery .t3d{left:8px;bottom:8px;font-size:12px;padding:6px 10px}
  .ptitle{align-items:flex-start;gap:12px}.ptitle .price small{text-align:left}
}
/* 17: footer legal links */
footer .legal{align-items:center}
footer .legal .lg{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:0 4px}
footer .legal .lg a{display:inline-flex;align-items:center;min-height:32px;padding:0 8px}
footer .legal .lg-note{flex-basis:100%;opacity:.8}
@media (max-width:700px){
  footer .legal{flex-direction:column;align-items:flex-start;gap:6px;font-size:13px}
  footer .legal .lg{flex-direction:column;width:100%;gap:0}
  footer .legal .lg li{border-top:1px solid #3a3835}
  footer .legal .lg a{min-height:44px;padding:0;width:100%}
  footer .legal .lg-note{margin-top:10px}
}
/* booking page: the flow and summary are drawn by book.js; reserve their room so nothing jumps */
#flow{min-height:760px}#summary{min-height:420px}
@media (max-width:980px){#flow{min-height:900px}#summary{min-height:120px}}
/* ---------- home hero on phones: one full-screen photo, swipe (or tap the tabs) between Sunrise and Sunset ---------- */
.tc-tabs{display:none}
@media (max-width:760px){
  .tc-stage[data-m] .tc-e,.tc-stage[data-m] .tc-w{top:0;bottom:0;transition:transform .75s cubic-bezier(.65,0,.35,1)}
  .tc-stage[data-m=east] .tc-w{transform:translateX(100%)}
  .tc-stage[data-m=west] .tc-e{transform:translateX(-100%)}
  .tc-stage[data-m] .tc-div{display:none}
  .tc-stage[data-m] .tc-copy,.tc-stage[data-m] .tc-w .tc-copy{bottom:146px}
  .tc-stage[data-m] .tc-w .tc-copy{text-align:left}
  .tc-stage[data-m] .tc-w .tc-eb,.tc-stage[data-m] .tc-w .tc-go{justify-content:flex-start}
  .tc-stage[data-m]{touch-action:pan-y}
  .tc-stage[data-m] .tc-tabs{display:flex;position:absolute;z-index:6;left:16px;right:16px;bottom:86px;gap:8px}
  .tc-tabs button{flex:1;position:relative;overflow:hidden;min-height:44px;border-radius:999px;border:1px solid rgba(255,255,255,.45);background:rgba(18,17,15,.22);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:rgba(255,255,255,.85);font:600 14px/1 var(--body);letter-spacing:.02em;cursor:pointer}
  .tc-tabs button[aria-selected=true]{background:rgba(250,248,243,.94);color:var(--ink);border-color:transparent}
  .tc-tabs button i{position:absolute;left:0;bottom:0;height:2px;width:100%;transform:scaleX(0);transform-origin:left;background:var(--ochre-btn)}
  .tc-tabs button[aria-selected=true].run i{animation:tcRun var(--tc-ms,6500ms) linear forwards}
  .tc-stage[data-m] .tc-e .tc-img::after,.tc-stage[data-m] .tc-w .tc-img::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(15,14,12,.55) 0,rgba(15,14,12,0) 28%,rgba(15,14,12,0) 48%,rgba(15,14,12,.72) 100%);pointer-events:none}
  .tc-stage[data-m] .tc-img{position:absolute;inset:0}
}
@keyframes tcRun{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@media (prefers-reduced-motion:reduce){.tc-stage[data-m] .tc-e,.tc-stage[data-m] .tc-w{transition:opacity .3s}.tc-tabs button i{display:none}}
/* mobile polish (round 3) */
.im-cap a{font-size:inherit;display:inline;padding:0;min-height:0;line-height:inherit}
@media (max-width:620px){
  .im-alist{display:grid;grid-template-columns:1fr 1fr;column-gap:14px}
  .im-alist a{padding:10px 0;font-size:14px;gap:6px}
  .im-alist a span:last-child{font-size:12px;opacity:.7}
  .alm [data-alm="big"]{min-height:1.15em}
  .alm [data-alm="why"]{min-height:7.2em}
  .alm-suntimes{grid-template-columns:1fr 1fr}
  .alm-suntimes>div:nth-child(3){grid-column:1/-1;border-top:1px solid var(--a-line, rgba(0,0,0,.1));margin-top:14px;border-left:0;padding-left:0}
  .alm-suntimes dd{white-space:nowrap}
}

/* ---------- contact: "always on" dot, call buttons ---------- */
.dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#3f8f5a;margin-right:8px;vertical-align:1px;box-shadow:0 0 0 0 rgba(63,143,90,.5);animation:le-pulse 2.4s ease-out infinite}
@keyframes le-pulse{0%{box-shadow:0 0 0 0 rgba(63,143,90,.45)}70%{box-shadow:0 0 0 8px rgba(63,143,90,0)}100%{box-shadow:0 0 0 0 rgba(63,143,90,0)}}
.f-always{opacity:.85;font-size:14px}
.vc-card-links a.tel{border-color:var(--ink)}
.vc-dock-tel{border-color:var(--ink)!important;color:var(--ink)!important}

/* ---------- favourites: heart on cards, header link ---------- */
.ec-w{position:relative;min-width:0}
.fav{position:absolute;z-index:3;top:10px;right:10px;width:42px;height:42px;border-radius:50%;border:0;display:grid;place-items:center;background:rgba(250,248,243,.92);color:var(--ink);cursor:pointer;box-shadow:0 2px 10px rgba(0,0,0,.12);transition:transform .2s ease,background .2s}
.fav:hover{transform:scale(1.06)}.fav:focus-visible{outline:2px solid var(--ochre);outline-offset:2px}
.fav.on,.vc-ico.fav.on{--fav-fill:#c2412d;color:#c2412d}
.fav.pop svg{animation:le-pop .45s cubic-bezier(.3,1.6,.5,1)}
@keyframes le-pop{0%{transform:scale(.6)}60%{transform:scale(1.25)}100%{transform:scale(1)}}
.vc-ico{width:44px;padding:0;justify-content:center;cursor:pointer;font:inherit}
.vc-ico.fav{position:static;box-shadow:none;background:rgba(20,19,17,.26);color:#fff;border:1px solid rgba(255,255,255,.55);height:44px;width:44px}
.vc-ico.fav.on{background:#fff}
.hfav{position:relative;display:inline-grid;place-items:center;width:38px;height:38px;color:inherit}
.hfav[hidden]{display:none}
.hfav b{position:absolute;top:2px;right:0;min-width:17px;height:17px;padding:0 4px;border-radius:9px;background:var(--ochre);color:#fff;font-size:10.5px;font-weight:700;line-height:17px;text-align:center}
.hfav svg{--fav-fill:none}

/* ---------- toast + share menu ---------- */
.toast{position:fixed;left:50%;bottom:calc(84px + env(safe-area-inset-bottom,0px));z-index:90;transform:translate(-50%,12px);background:var(--ink);color:var(--lime);padding:11px 18px;border-radius:999px;font-size:14px;opacity:0;pointer-events:none;transition:opacity .25s,transform .25s;white-space:nowrap}
.toast.on{opacity:1;transform:translate(-50%,0)}
.share-m{position:fixed;z-index:95;right:16px;top:88px;width:260px;background:var(--paper);border:1px solid var(--line);box-shadow:0 18px 50px rgba(0,0,0,.18);padding:18px 18px 12px;display:flex;flex-direction:column}
.share-m b{font-weight:600;margin-bottom:8px}
.share-m a,.share-m .share-copy{display:block;padding:11px 0;border-top:1px solid var(--line);font:15px var(--body);color:var(--ink);text-align:left;background:none;border-left:0;border-right:0;border-bottom:0;cursor:pointer}
.share-m a:hover,.share-m .share-copy:hover{color:var(--ochre)}
.share-x{position:absolute;top:8px;right:10px;border:0;background:none;font-size:24px;line-height:1;cursor:pointer;color:var(--muted)}
@media (max-width:600px){.share-m{left:12px;right:12px;top:auto;bottom:calc(12px + env(safe-area-inset-bottom,0px));width:auto}}

/* ---------- currency ---------- */
.mx{font-size:.78em;font-weight:500;color:var(--muted);white-space:nowrap}
.cur{display:inline-flex;align-items:center;gap:8px;font-size:13px;opacity:.85}
.cur select{font:16px var(--body);background:transparent;color:inherit;border:1px solid rgba(243,239,231,.35);padding:4px 8px;border-radius:2px}
.cur select option{color:var(--ink)}

/* ---------- date picker ---------- */
.dp-native{position:absolute!important;width:1px!important;min-width:0!important;height:1px!important;opacity:0!important;pointer-events:none!important;overflow:hidden;clip:rect(0 0 0 0)}
.dp-btn{display:block;width:100%;min-width:0;text-align:left;font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dp-btn.is-empty{color:var(--muted-2)}
.field .dp-btn{border:1px solid var(--line);background:#fff;padding:12px;font:16px var(--body);color:var(--ink)}
.fbar .dp-btn{border:1px solid var(--line);background:#fff;padding:9px 12px;font:15px var(--body);color:var(--ink);min-width:170px}
.vc-fields .dp-btn{font:16px var(--body);color:var(--ink);margin-top:4px;padding:2px 0;letter-spacing:0;text-transform:none;min-height:28px}
.tc-f .dp-btn{font:500 16px/1.4 var(--body);padding:3px 0}
.dp-on .tc-ph{display:none!important}
.hero2c .tc-f .dp-btn.is-empty{color:rgba(255,255,255,.78)}
.dp-btn:focus-visible{outline:2px solid var(--ochre);outline-offset:2px}
.dp{position:absolute;z-index:80;width:min(640px,calc(100vw - 24px));background:var(--paper);color:var(--ink);border:1px solid var(--line);box-shadow:0 24px 60px rgba(28,27,25,.2);padding:14px 18px 12px;font-size:14px}
.dp-h{display:flex;gap:6px;justify-content:flex-end;margin-bottom:-30px;position:relative;z-index:1;pointer-events:none}
.dp-h button{pointer-events:auto;width:34px;height:34px;border:1px solid var(--line);background:#fff;border-radius:50%;font-size:18px;line-height:1;cursor:pointer;color:var(--ink)}
.dp-h .dp-nav[data-n="-1"]{margin-right:auto}
.dp-h button:disabled{opacity:.35;cursor:default}
.dp-x{margin-left:8px}
.dp-ms{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:26px;padding:0 0 4px}
.dp-m h3{text-align:center;font-size:15px;font-weight:600;line-height:34px;margin-bottom:8px;text-transform:capitalize}
.dp-wd,.dp-g{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}
.dp-wd span{text-align:center;font-size:11px;color:var(--muted);letter-spacing:.06em;padding:4px 0}
.dp-g button{aspect-ratio:1;border:0;background:none;border-radius:50%;font:14px var(--body);color:var(--ink);cursor:pointer;font-variant-numeric:tabular-nums}
.dp-g button:hover:not(:disabled){background:var(--lime)}
.dp-g button.cd:not(:disabled){font-weight:700;box-shadow:inset 0 0 0 1px var(--ochre)}
.dp-g button:disabled{color:#c2bbae;cursor:default;text-decoration:none}
.dp-g button.sel{background:var(--ochre)!important;color:#fff;font-weight:700}
.dp-g button:focus-visible{outline:2px solid var(--ink);outline-offset:1px}
.dp-f{display:flex;justify-content:space-between;align-items:center;gap:12px;border-top:1px solid var(--line);margin-top:10px;padding-top:10px;color:var(--muted-2);font-size:13px}
.dp-clear{border:0;background:none;font:600 13px var(--body);color:var(--ink);text-decoration:underline;cursor:pointer}
@media (max-width:719px){
  .dp{position:fixed;left:0!important;right:0;bottom:0;top:auto!important;width:auto;border-radius:16px 16px 0 0;padding:14px 16px calc(14px + env(safe-area-inset-bottom,0px));max-height:86vh;overflow:auto}
  .dp-g button{font-size:16px}
}

/* ---------- villa page: availability ---------- */
.av-key{list-style:none;display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:18px;font-size:13px;color:var(--muted-2)}
.av-key li{display:flex;align-items:center;gap:8px}
.av-key i{width:14px;height:14px;display:inline-block;border:1px solid var(--line)}
.av-key .k-free{background:#fff;border-color:#bfb6a5}.av-key .k-busy{background:repeating-linear-gradient(135deg,#ece6db 0 3px,#f6f2ea 3px 6px)}.av-key .k-sel{background:var(--ochre);border-color:var(--ochre)}
.av{min-width:0}
.av-load,.av-hint{color:var(--muted-2);font-size:15px}
.av-ms{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:22px 16px}
.av-m h3{display:flex;justify-content:space-between;align-items:baseline;font-size:13px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;border-bottom:1px solid var(--ink);padding-bottom:7px;margin-bottom:8px}
.av-m h3 small{font-size:11px;letter-spacing:0;color:#3f8f5a;font-weight:700}
.av-m ul{list-style:none;display:grid;gap:5px}
.av-full{font-size:12px;color:var(--muted);margin-bottom:6px}
.av-w{width:100%;display:flex;justify-content:space-between;align-items:baseline;gap:6px;padding:9px 10px;border:1px solid #d9d1c2;background:#fff;font:13px var(--body);color:var(--ink);cursor:pointer;text-align:left;transition:border-color .15s,background .15s;font-variant-numeric:tabular-nums}
.av-w .av-p{font-weight:600;white-space:nowrap}.av-w .av-p .mx{display:none}
.av-w.free:hover{border-color:var(--ochre)}
.av-w.busy,.av-w.closed{background:repeating-linear-gradient(135deg,#ece6db 0 3px,#f6f2ea 3px 6px);border-color:#e6dfd2;color:#9a9284;cursor:not-allowed}
.av-w.busy .av-p,.av-w.closed .av-p{font-weight:500;font-size:11px;letter-spacing:.04em;text-transform:uppercase}
.av-w.sel{background:var(--ochre);border-color:var(--ochre);color:#fff}
.av-w:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.av-sum{display:flex;flex-wrap:wrap;align-items:center;gap:14px 26px;margin-top:22px;padding:18px 20px;background:var(--lime);border-left:3px solid var(--ochre);min-height:78px}
.av-sel{display:flex;flex-direction:column;gap:2px;flex:1 1 220px}.av-sel span{color:var(--muted-2);font-size:14px}
.av-tot{display:flex;flex-direction:column}.av-tot small{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}.av-tot b{font-size:22px;font-weight:600;font-variant-numeric:tabular-nums}
.av-sum .btn{min-height:46px;display:inline-flex;align-items:center}
@media (max-width:560px){.av-ms{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 10px}.av-w{flex-direction:column;gap:2px;padding:8px 9px}.av-sum .btn{width:100%;justify-content:center}}

/* ---------- /villas/: date search + feature chips ---------- */
.fchips{border:0;display:flex;flex-wrap:wrap;gap:8px;padding:2px 0 12px}
.fchip{position:relative;cursor:pointer}
.fchip input{position:absolute;opacity:0;inset:0;cursor:pointer}
.fchip span{display:inline-block;padding:7px 14px;border:1px solid var(--line);border-radius:999px;font-size:14px;background:#fff;transition:background .15s,border-color .15s}
.fchip input:checked+span{background:var(--ink);border-color:var(--ink);color:var(--lime)}
.fchip input:focus-visible+span{outline:2px solid var(--ochre);outline-offset:2px}
.vf-avail{font-size:15px;padding:0 0 12px;color:var(--muted-2)}
.vf-avail .linkbtn{margin-left:8px}
.ec-top[data-range]:not([data-range=""])::after{content:" · " attr(data-range);color:var(--ochre)}
.fw-link{margin-top:36px;font-size:15px}

/* ---------- free weeks ---------- */
.fw-bar{display:flex;gap:16px;margin-bottom:22px}
.fw-bar label{display:flex;flex-direction:column;gap:4px}.fw-bar small{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.fw-bar select{font:15px var(--body);border:1px solid var(--line);background:#fff;padding:9px 30px 9px 12px;min-width:220px}
.fw-list{list-style:none}
.fw-mh h2{font-size:22px;margin:30px 0 10px;text-transform:capitalize}
.fw-row{display:grid;grid-template-columns:120px 1.1fr 1.4fr auto auto;gap:18px;align-items:center;padding:14px 0;border-top:1px solid var(--line)}
.fw-ph{display:block;aspect-ratio:4/3;overflow:hidden;background:var(--line)}
.fw-when b{display:block;font-size:17px;font-weight:600;font-variant-numeric:tabular-nums}.fw-when span{font-size:13px;color:var(--muted)}
.fw-when em{display:inline-block;margin-left:8px;font-style:normal;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#fff;background:#c2412d;padding:2px 7px;border-radius:2px}
.fw-v a{font-weight:600;font-size:17px;border-bottom:1px solid transparent}.fw-v a:hover{border-color:var(--ochre)}.fw-v span{display:block;font-size:14px;color:var(--muted)}
.fw-p{font-size:19px;font-weight:600;text-align:right;font-variant-numeric:tabular-nums}.fw-p small{font-size:12px;color:var(--muted);font-weight:400;margin-left:4px}
.fw-p .mx{display:block}
.fw-row .btn{white-space:nowrap}
.fw-more{margin-top:24px}
.fw-long{margin-top:64px;padding:30px;background:var(--lime);max-width:760px}.fw-long h2{font-size:24px;margin-bottom:8px}.fw-long p{margin-bottom:18px;color:var(--muted-2)}
@media (max-width:760px){.fw-row{grid-template-columns:92px 1fr auto;gap:6px 14px}.fw-ph{grid-row:span 3}.fw-when,.fw-v{grid-column:2/4}.fw-p{grid-column:2;text-align:left}.fw-row .btn{grid-column:3;padding:9px 14px}.fw-bar select{min-width:0;width:100%}.fw-bar label{flex:1}}

/* ---------- favourites + compare ---------- */
[data-favpage] .ec-w[hidden]{display:none}
.fav-empty{padding:34px;background:var(--lime);display:flex;flex-wrap:wrap;gap:16px 28px;align-items:center;justify-content:space-between;margin-bottom:24px}
.fav-empty p{max-width:56ch;color:var(--muted-2)}
.fav-tools{display:flex;gap:18px;align-items:center;margin-bottom:28px}
.cmp{margin-top:72px}.cmp-lead{color:var(--muted-2);margin:6px 0 20px}
.cmp-scroll{overflow-x:auto;border:1px solid var(--line)}
.cmp-t{border-collapse:collapse;width:100%;min-width:560px;background:#fff;font-size:15px}
.cmp-t th,.cmp-t td{padding:12px 14px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.cmp-t thead th{vertical-align:bottom}.cmp-t thead img{width:100%;height:auto;aspect-ratio:3/2;margin-bottom:8px}.cmp-t thead b{font-weight:600;font-size:16px}
.cmp-t tbody th{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-weight:600;width:150px;white-space:nowrap}
.cmp-t td{font-variant-numeric:tabular-nums}
.fw{min-height:70vh}
@media (max-width:440px){.vc-dock-tel{display:none!important}}
.vc-dock-p .mx,.vc-sub-cta .mx,.ec-price .mx{display:block;font-size:12px}.vc-dock-p .mx{display:none}
@media (max-width:900px){.vc-sec-g{grid-template-columns:minmax(0,1fr);gap:20px}.vc-side p{max-width:none}}
@media (max-width:560px){.vfilters .fbar label{flex:1 1 calc(50% - 9px);min-width:0}.vfilters .fbar label:first-child{flex-basis:100%}.fbar .dp-btn{min-width:0}.vfilters .fbar{gap:10px}}

/* ---------- real estate: buying costs, alerts, Golden Visa chip ---------- */
.costs-lead{color:var(--muted-2);margin:8px 0 18px;max-width:62ch}
.costs-in{display:flex;flex-wrap:wrap;gap:12px 18px;margin-bottom:16px}
.costs-in label{display:flex;flex-direction:column;gap:4px;flex:1 1 180px}
.costs-in small{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.costs-in input,.costs-in select{font:16px var(--body);border:1px solid var(--line);background:#fff;padding:10px 12px;color:var(--ink);border-radius:0;width:100%}
.costs-t{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
.costs-t th,.costs-t td{padding:12px 0;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.costs-t td{text-align:right;font-weight:600;white-space:nowrap;padding-left:16px}
.costs-t th{font-weight:500}.costs-t th small{display:block;font-size:13px;color:var(--muted);font-weight:400;margin-top:2px}
.costs-t tfoot th,.costs-t tfoot td{border-bottom:0;padding-top:16px;font-weight:700}
.costs-t .costs-all th,.costs-t .costs-all td{border-top:1px solid var(--ink);font-size:18px}
.costs-t .mx{display:block;font-weight:400}
.ra{background:var(--lime)}
.ra-g{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(28px,5vw,72px);align-items:start}
.ra h2{font-size:clamp(28px,3.2vw,40px);margin-bottom:14px}.ra-g>div>p{color:var(--muted-2);max-width:46ch}
.ra-gv{grid-column:1/-1}
@media (max-width:900px){.ra-g{grid-template-columns:1fr}}
.gvchip{align-self:center}
/* owners: one-minute readiness check */
.ready{background:var(--paper)}
.ready-g{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(28px,5vw,72px);align-items:start}
.ready h2{font-size:clamp(28px,3.2vw,40px);margin-bottom:14px}.ready-g>div>p{color:var(--muted-2);max-width:44ch}
.ready-f ul{list-style:none;border-top:1px solid var(--line)}
.ready-f li label{display:flex;gap:14px;align-items:flex-start;padding:13px 0;border-bottom:1px solid var(--line);cursor:pointer;font-size:16px}
.ready-f input{width:20px;height:20px;margin-top:2px;accent-color:var(--ochre);flex:0 0 auto}
.ready-f input:checked+span{color:var(--muted);text-decoration:line-through;text-decoration-color:var(--ochre)}
.ready-out{display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px;margin-top:22px}
.ready-out p{flex:1 1 240px;font-weight:600}
.ready-bar{flex:1 1 100%;height:6px;background:var(--line)}.ready-bar i{display:block;height:100%;width:calc(var(--p) * 100%);background:var(--ochre);transition:width .3s}
.ready-f.all .ready-bar i{background:#3f8f5a}
@media (max-width:900px){.ready-g{grid-template-columns:1fr}}
/* long words in the two-coasts hero (German "Sonnenuntergang") */
html[lang=de] .tc-word{font-size:clamp(40px,min(4.6vw,9vh),72px);line-height:.95;letter-spacing:-.035em}
@media (max-width:760px){html[lang=de] .tc-word{font-size:clamp(34px,10vw,44px)}}
/* German compound words ("Buchungsbedingungen", "Auftragsverarbeiter") must break on phones */
html[lang=de] h1,html[lang=de] h2,html[lang=de] h3,html[lang=de] .content,html[lang=de] .prose,html[lang=de] .faq{hyphens:auto;-webkit-hyphens:auto;overflow-wrap:break-word}
/* the brand's ochre full stop at the end of every page title (as in the logo "lefkáda.") */
.dot-o{color:var(--ochre)}
.vc-open .dot-o,.areahero .dot-o,.ohero-ph .dot-o,body.over-hero [data-hero] .dot-o{color:var(--ochre-lt)}
.fbar input[type=date]{font:15px var(--body);border:1px solid var(--line);background:#fff;color:var(--ink);padding:9px 12px;min-width:175px;height:43px;border-radius:0}.fbar .dp-btn{height:43px}

/* contact: topic picker + side card */
.cf{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:32px;align-items:start}
.cf-topics{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-bottom:8px}
.cf-t{position:relative;display:block;cursor:pointer}
.cf-t input{position:absolute;opacity:0;inset:0;cursor:pointer}
.cf-t>span{display:block;background:#fff;border:1px solid var(--line);padding:16px 18px;transition:border-color .15s,box-shadow .15s}
.cf-t b{display:block;font-weight:600;font-size:17px}.cf-t small{display:block;color:var(--muted-2);font-size:14px;margin-top:2px}
.cf-t:hover>span{border-color:var(--ochre-l)}
.cf-t input:checked+span{border-color:var(--ochre);box-shadow:inset 0 0 0 1px var(--ochre)}
.cf-t input:focus-visible+span{outline:2px solid var(--sea);outline-offset:2px}
.cf-fields{margin-top:22px}.cf-fields[hidden],.cf-g[hidden]{display:none}
.cf-side{position:sticky;top:96px;border:1px solid var(--line);padding:24px}
.cf-side h2{font-size:20px;margin:0 0 10px}
.cf-tel{display:block;font-size:24px;font-weight:600;color:var(--ink);text-decoration:none;letter-spacing:var(--track)}
.cf-side p{color:var(--muted-2);font-size:14px;margin:6px 0 16px}
.cf-acts{display:flex;gap:10px;flex-wrap:wrap}.cf-acts .btn{flex:1;text-align:center}
.cf-side .cf-mail{margin:18px 0 0;padding-top:16px;border-top:1px solid var(--line)}
@media (max-width:900px){.cf{grid-template-columns:1fr}.cf-side{position:static}}
@media (max-width:560px){.cf-topics{grid-template-columns:1fr}}

/* contact: designed pass */
.cf-form.formbox{background:#fff;border:1px solid var(--line);padding:36px;box-shadow:0 1px 0 rgba(28,27,25,.03),0 24px 48px -32px rgba(28,27,25,.18)}
.cf-t>span{display:grid;grid-template-columns:auto 1fr;column-gap:14px;align-items:center;background:var(--paper);padding:18px}
.cf-t svg{grid-row:1/3;color:var(--ochre);transition:color .15s}
.cf-t small{grid-column:2}
.cf-t input:checked+span{background:var(--sea);border-color:var(--sea);box-shadow:none;color:#fff}
.cf-t input:checked+span small{color:rgba(255,255,255,.78)}.cf-t input:checked+span svg{color:var(--ochre-l)}
.cf-form .field input,.cf-form .field select,.cf-form .field textarea{background:var(--paper)}
.cf-side{background:var(--sea);border:0;color:#fff;padding:32px}
.cf-side h2{font-size:24px;line-height:1.2;color:#fff}.cf-side p{color:rgba(255,255,255,.8)}
.cf-side .btn{display:block;text-align:center}
.cf-side .cf-mail{border-top-color:rgba(255,255,255,.2);margin-top:0;padding-top:0;border:0}
.cf-side .cf-tel{color:#fff;font-size:22px;margin-top:24px;padding-top:20px;border-top:1px solid rgba(255,255,255,.2)}
.cf-side a:not(.btn){color:#fff}.cf-side .cf-mail{margin-top:6px}
@media (max-width:560px){.cf-form.formbox{padding:20px}}

/* listing enquiry: one column in the narrow aside */
.formbox.lf-1 .grid2f{grid-template-columns:1fr}

footer .f-two{columns:2;column-gap:24px}footer .f-two li{break-inside:avoid;margin:0;padding:6px 0}footer .f-all a{font-weight:600}
@media (min-width:901px){footer .cols{grid-template-columns:1.3fr 1.7fr 1.2fr 1fr 1.1fr}}

footer .powered{flex-basis:100%;text-align:center;font-size:12px;opacity:.7;margin-top:6px}footer .powered a{text-decoration:underline;text-underline-offset:3px}


/* Owners page (lean): three promises beside the heading, then what the fee covers as a numbered grid */
.oof-g{display:grid;grid-template-columns:1fr 1.15fr;gap:72px;align-items:start}
.oof-h{position:sticky;top:110px}
.oof-h h2{font-size:clamp(30px,3.4vw,48px);line-height:1.08;margin:10px 0 20px}
.oof-h .content{color:var(--muted-2);font-size:17px;max-width:46ch}
.oof-l{list-style:none;margin:0;padding:0;border-bottom:1px solid var(--line)}
.oof-l li{display:grid;grid-template-columns:64px 1fr;gap:12px;padding:30px 0;border-top:1px solid var(--line)}
.oof-l .n{font-size:13px;letter-spacing:.16em;color:var(--ochre);padding-top:6px}
.oof-l b{display:block;font-size:clamp(20px,1.8vw,24px);font-weight:500;line-height:1.25;margin-bottom:8px}
.oof-l p{margin:0;color:var(--muted-2);max-width:52ch}
.ocv{background:var(--lime)}
.ocv h2{font-size:clamp(28px,3vw,42px);margin:0 0 30px}
.ocv-l{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);column-gap:32px;border-top:1px solid var(--line)}
.ocv-l li{display:flex;align-items:baseline;gap:14px;padding:24px 0;border-bottom:1px solid var(--line);font-size:clamp(17px,1.4vw,20px);line-height:1.3}
.ocv-l li span{flex:none;font-size:12px;letter-spacing:.14em;color:var(--ochre)}
@media (max-width:900px){.oof-g{grid-template-columns:1fr;gap:32px}.oof-h{position:static}.ocv-l{grid-template-columns:1fr 1fr;column-gap:20px}}
@media (max-width:520px){.ocv-l{column-gap:16px}.ocv-l li{flex-direction:column;gap:6px;padding:16px 0;font-size:16px}.oof-l li{grid-template-columns:44px 1fr}}
.oh-copy h1+.oh-ctas{margin-top:32px}
/* Villa booking card, tidied: two date fields that never overflow the card, a soft frame, quieter placeholders,
   a custom chevron that stays inside the box, and three equal contact buttons */
.vc-card{border-radius:16px;padding:28px 26px 22px}
.vc-fields{grid-template-columns:minmax(0,1fr) minmax(0,1fr);border-radius:12px;overflow:hidden;background:#fff;margin-top:18px}
.vc-fields label{min-width:0;padding:12px 14px 10px;font-size:11px;letter-spacing:.12em}
.vc-fields .dp-btn{display:block;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left;font-size:15px}
.vc-fields .dp-btn.is-empty{color:var(--muted)}
.vc-fields select{-webkit-appearance:none;appearance:none;padding-right:22px;font-size:16px;cursor:pointer;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5 7.5l5 5 5-5' fill='none' stroke='%231c1b19' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 0 center/14px}
.vc-form .btn.ochre{border-radius:10px;margin-top:14px}
.vc-card-links{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.vc-card-links a:first-child{grid-column:1/-1}
.vc-card-links a{border-radius:10px;min-height:42px;padding:0 8px;font-size:14px}
@media (max-width:380px){.vc-card-links{grid-template-columns:minmax(0,1fr)}}
/* Reviews carousel: one row that scrolls sideways (snap), arrows that wrap round from the last to the first */
.vc-rv-car{position:relative;margin-top:36px}
.vc-rv-nav{display:flex;justify-content:flex-end;gap:8px;margin-bottom:14px}
.vc-rv-nav button{width:44px;height:44px;border-radius:50%;border:1px solid var(--ink);background:none;display:grid;place-items:center;cursor:pointer;color:var(--ink);transition:background .2s,color .2s}
.vc-rv-nav button:hover{background:var(--ink);color:var(--lime)}
.vc-rv-nav svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.vc-rv-car .vc-quotes{display:flex;align-items:flex-start;grid-template-columns:none;gap:28px;margin-top:0;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none;overscroll-behavior-x:contain}
.vc-rv-car .vc-quotes::-webkit-scrollbar{display:none}
.vc-rv-car .vc-quotes figure{flex:0 0 calc((100% - 56px) / 3);scroll-snap-align:start}
@media (max-width:900px){.vc-rv-car .vc-quotes figure{flex-basis:calc((100% - 28px) / 2)}}
@media (max-width:620px){.vc-rv-car .vc-quotes figure{flex-basis:86%}}
/* Amenities, compact: Outside and Safety share the first column, Inside (the long list) runs in two columns beside them,
   so the section is short and nothing spills out of the page */
.vc-am{grid-template-columns:minmax(0,1fr) minmax(0,2fr);grid-template-areas:"out in" "safe in";column-gap:40px;row-gap:34px;align-items:start}
.vc-am .am-outside{grid-area:out}.vc-am .am-inside{grid-area:in}.vc-am .am-safety{grid-area:safe}
.vc-am .am-inside ul{columns:2;column-gap:32px}
.vc-am li{break-inside:avoid;padding:10px 0;font-size:15.5px}
@media (max-width:900px){.vc-am{grid-template-columns:minmax(0,1fr);grid-template-areas:"out" "in" "safe"}}
@media (max-width:520px){.vc-am .am-inside ul{columns:1}}
/* Booking page, calmer: villa + guests on one row, arrival / departure shown as two fields filled from the calendar,
   round day cells with a soft range, and a summary card with one breakdown and one total */
.bk-h{font-size:clamp(24px,2.4vw,30px);margin-bottom:18px}
.bk-top{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;margin-bottom:12px}
.bk-f{display:flex;flex-direction:column;gap:6px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px 16px}
.bk-f small,.bk-dates small,.bk-when small{font-size:11px;letter-spacing:.12em;text-transform:uppercase;font-weight:600;color:var(--muted-2)}
.bk-f select{border:0;background:none;font:16px var(--body);color:var(--ink);padding:0;-webkit-appearance:none;appearance:none;cursor:pointer}
.bk-step{display:flex;align-items:center;gap:14px}
.bk-step button{width:32px;height:32px;border-radius:50%;border:1px solid var(--line);background:#fff;font-size:17px;line-height:1;cursor:pointer;color:var(--ink)}
.bk-step button:disabled{opacity:.35;cursor:default}
.bk-step b{min-width:18px;text-align:center;font-size:16px;font-variant-numeric:tabular-nums}
.bk-dates{display:grid;grid-template-columns:1fr 1fr;background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden}
.bk-dates>*{display:flex;flex-direction:column;gap:6px;align-items:flex-start;padding:12px 16px;border:0;background:none;font:inherit;color:var(--ink);text-align:left}
.bk-dates>*+*{border-left:1px solid var(--line)}
.bk-dates button{cursor:pointer}
.bk-dates .on{box-shadow:inset 0 -2px 0 var(--ochre)}
.bk-dates b,.bk-when b{font-size:16px;font-weight:500}
.bk-hint{margin:14px 0 4px;font-size:15px;color:var(--muted-2)}
.bk-next{margin-top:26px;display:flex;gap:12px;flex-wrap:wrap}
#flow .cal-head{margin:18px 0 6px}
#flow .cal-head button{border-radius:50%}
#flow .days button,#flow .days span{border-radius:50%;margin:1px}
#flow .days .inr{background:#efe4d3;border-radius:0;margin:1px 0;box-shadow:-1px 0 0 #efe4d3,1px 0 0 #efe4d3}
#flow .days .start,#flow .days .end{background:var(--ink);color:var(--lime);border-radius:50%}
#flow .days .lv{font-weight:600;box-shadow:inset 0 0 0 1px var(--line)}
#flow .legend .lg-free{background:#fff}#flow .legend .lg-busy{background:repeating-linear-gradient(135deg,#fff 0 4px,#efe9dd 4px 6px)}#flow .legend .lg-sel{background:var(--ink)}
#flow .legend i{border-radius:50%}
.sumcard{border-radius:16px;overflow:hidden}
.bk-when{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:16px;padding-top:14px;border-top:1px solid var(--line)}
.bk-when>div{display:flex;flex-direction:column;gap:4px}
.bk-who{margin-top:12px;font-size:14px;color:var(--muted-2)}
.bk-lines{margin-top:14px}
.bk-lines>div{display:flex;justify-content:space-between;gap:12px;padding:7px 0;font-size:15px}
.bk-lines>div span:last-child{font-variant-numeric:tabular-nums;white-space:nowrap}
.bk-tot{border-top:1px solid var(--line);margin-top:6px;padding-top:12px!important;font-weight:600;font-size:18px!important}
.paybox{border-radius:14px}
.bk-now{border-top:1px dashed var(--line);margin-top:4px;padding-top:11px!important;font-weight:600}
.bk-now+div{color:var(--muted)}
.bk-method{border:0;padding:0;margin:4px 0 18px;min-width:0}.bk-method legend{font-weight:600;font-size:15px;padding:0;margin-bottom:2px}
@media (max-width:560px){.bk-top{grid-template-columns:1fr}}
/* Island charts, readable at a glance: the sea is sea-blue with lighter shallows along the coast (no more contour-like
   rings), land is warm sand with a clear coastline, and the mainland across the strait is land too (it used to be dark
   teal and read as water). The panel around the chart keeps its dark colour for the text beside it. */
.im,.alm-map{--im-water:#a9cfdc;--im-water-d:#8dbccc;--im-shallow:#d3e9ef;--im-ground:#efe8d6;--im-coast:#b3a283;--im-mainland:#ddd5c1}
.im-sea{fill:var(--im-water)}
.im-rg{stroke:var(--im-shallow);opacity:calc(.6 - var(--k) * .17)}
.im-rs{display:none}
.im-isle,.im-lef{fill:var(--im-ground)}
.im-lef,.im-isle{stroke:var(--im-coast);stroke-width:.8px;stroke-linejoin:round}
.im-main{fill:var(--im-mainland);stroke:var(--im-coast);stroke-width:.8px}
.im-lb--sea{color:rgba(18,54,64,.5);font-style:italic}
.im-inset{background:var(--im-water-d)}
.im-inset .im-isle,.im-inset .im-lef{stroke:none}
.im-ch{border-radius:6px;overflow:hidden}
/* villa page: night calendar (avail.js) — reuses .cal-head / .cal / .month / .days from the booking page */
.av .cal-head{margin-bottom:6px}.av .cal-head button{border-radius:50%}
.av-cal{grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}
.av-cal .month h3{font-size:13px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;border-bottom:1px solid var(--ink);padding-bottom:7px;margin-bottom:8px}
.av-cal .dow span{font-size:11px;color:var(--muted);padding:4px 0}
.av-cal .days button,.av-cal .days span{border-radius:50%;margin:1px}
.av-cal .days .can{font-weight:600;cursor:pointer}.av-cal .days .can:hover{background:var(--lime)}
.av-cal .days .lv{box-shadow:inset 0 0 0 1px var(--ochre)}
.av-cal .days .inr{background:#efe4d3;border-radius:0;margin:1px 0}
.av-cal .days .start,.av-cal .days .end{background:var(--ochre);color:#fff;box-shadow:none}
.av-cal .days button:focus-visible{outline:2px solid var(--ink);outline-offset:1px}
.av-cal .av-full{margin-top:6px}
.av-sum .linkbtn{font-size:14px}
.fw-p .fw-from{margin:0 2px 0 0}
/* coast hub article: on phones the "our villas on this coast" cards are one swipeable row, not four screens of cards */
@media (max-width:620px){
  .near-villas .villas{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:16px;margin:0 -24px;padding:0 24px 8px;scrollbar-width:none;overscroll-behavior-x:contain}
  .near-villas .villas::-webkit-scrollbar{display:none}
  .near-villas .villas>*{flex:0 0 80%;scroll-snap-align:start;min-width:0}
}
/* villa card: WhatsApp sits level with Call (the generic .wa rule added a top margin) */
.vc-card-links a.wa{margin-top:0}
/* reduced motion: the "we answer every day" dot stops pulsing too */
@media (prefers-reduced-motion:reduce){.dot{animation:none}}
/* lightbox: the page behind does not scroll while it is open */
html:has(.lb:not([hidden])){overflow:hidden}.lb{overscroll-behavior:contain}
/* ---------- mobile polish (audit 18/10, round 2) ---------- */
/* chart pins: a bigger tap area; prev / next look off when only one villa is left */
.im-pin::before{content:"";position:absolute;inset:-6px;border-radius:50%}
.im-nav button:disabled{opacity:.35;cursor:default}
/* phone map card (photo left, text right): the heart sits on the photo, not on the villa name */
@media (max-width:760px){.im-card .fav{left:8px;right:auto;top:8px;width:36px;height:36px}}
.ec-meta span{white-space:nowrap}
/* "no villas match" reset: a real tap target */
.js-reset{display:inline-flex;align-items:center;min-height:44px}
.vf-avail .linkbtn{display:inline-flex;align-items:center;min-height:40px}
/* mobile menu: page behind dimmed and still, the button shows × while open */
@media (max-width:900px){
  body.menu-open header{box-shadow:0 0 0 100vmax rgba(20,18,15,.35)}
  html:has(body.menu-open){overflow:hidden}
  .burger[aria-expanded="true"]{font-size:0;min-width:44px;min-height:44px}
  .burger[aria-expanded="true"]::after{content:"\00d7";font-size:30px;line-height:1;font-weight:300}
}
/* date picker on phones: a real sheet (dimmed page behind, page does not scroll), 40px month buttons, six rows always */
.dp-g i{aspect-ratio:1}
@media (max-width:719px){
  .dp{box-shadow:0 0 0 100vmax rgba(20,18,15,.38)}
  html:has(body>.dp){overflow:hidden}
  .dp-h button{width:40px;height:40px}
  .dp-h{margin-bottom:-34px}
}
.dp-f span{color:var(--muted);font-size:12px;letter-spacing:.08em;text-transform:uppercase}
/* favourites compare table on phones: the row labels stay put while the villas scroll */
@media (max-width:620px){
  .cmp-t{min-width:0;width:max-content}
  .cmp-t thead th:first-child,.cmp-t tbody th{position:sticky;left:0;z-index:1;background:#fff;width:92px;min-width:92px;max-width:92px;white-space:normal;box-shadow:1px 0 0 var(--line)}
  .cmp-t thead th:not(:first-child),.cmp-t td{width:160px;min-width:160px}
  .cmp-t tbody th{font-size:11px;letter-spacing:.06em}
}
.fav-tools{flex-wrap:wrap;row-gap:10px}.fav-tools>*{white-space:nowrap}
/* toast stays readable over the dark footer */
.toast{box-shadow:0 0 0 1px rgba(243,239,231,.28),0 8px 24px rgba(0,0,0,.35)}
/* villa page on phones: one comfortable gap between sections (was about 185px of empty paper) */
@media (max-width:620px){
  body.vc section.vc-sec{padding-top:56px;padding-bottom:0}
  .vc-tour{margin-top:56px}
  .vc-bb{margin-top:40px}
  /* hero facts as a short column instead of a broken bullet row */
  .vc-facts ul{flex-direction:column}.vc-facts li+li::before{display:none}
  /* section tabs: the last one fades out, so the row reads as scrollable */
  nav.vc-links{-webkit-mask-image:linear-gradient(90deg,#000 86%,transparent);mask-image:linear-gradient(90deg,#000 86%,transparent)}
  /* reviews: the next card's chopped letters fade out instead of a hard strip */
  .vc-rv-car .vc-quotes{-webkit-mask-image:linear-gradient(90deg,#000 84%,transparent 97%);mask-image:linear-gradient(90deg,#000 84%,transparent 97%)}
}
/* phones held sideways: the villa hero fits the screen and the room titles scroll with the photos */
@media (max-height:500px) and (min-width:600px){
  .vc-open{height:100svh;min-height:0}
  .vc-stop-txt{position:static}
}
/* booking widget: thumb-sized controls */
.bk-f select{min-height:36px}
.bk-step button{width:40px;height:40px}
#flow button.b{display:inline-flex;align-items:center;min-height:40px;padding:0 4px}
/* links inside consent boxes look like links */
.check-row a{text-decoration:underline;text-underline-offset:2px;color:var(--ochre-t,#8a5a1f)}
/* contact topics on phones: a compact 2×2 grid so the form is closer */
@media (max-width:560px){
  .cf-topics{grid-template-columns:1fr 1fr;gap:8px}
  .cf-t small{display:none}
  .cf-t b{font-size:15px;line-height:1.25}
}
/* contact form: date fields match the other fields, and the empty state reads as a placeholder */
.cf-form .field .dp-btn{background:var(--paper)}
.field .dp-btn.is-empty{color:var(--muted-2)}
@media (max-width:560px){.cf-t>span{padding:14px;column-gap:10px}}
.bk-f select{min-width:0;width:100%;max-width:100%}
/* /akinita/ filters on phones: the kinds are one swipeable row, the selects two per row, the Golden Visa toggle a chip */
@media (max-width:560px){
  .filters .kinds{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin:0 -24px;padding:0 24px 2px;width:calc(100% + 48px)}
  .filters .kinds::-webkit-scrollbar{display:none}
  .filters .kinds button{flex:none}
  .filters label{flex:1 1 calc(50% - 9px)}
  .filters .gvchip{flex:none;align-self:flex-start}
  .filters .sp{display:none}.filters label:first-of-type{flex-basis:100%}
}
.filters .gvchip:has(input:checked)::before{content:"\2713\00a0"}
/* listing page: no double rule or big empty band at the end of the columns */
.pcols .block:last-child{padding-bottom:0;margin-bottom:0;border-bottom:0}
.amen ul li:last-child{border-bottom:0}
/* property alert form: a visible card, like the other forms */
form.formbox.ra-f{background:#fff;border:1px solid var(--line)}
/* gallery, section links and small text links: thumb-sized */
.gallery .all{min-height:40px}
.sh a{display:inline-flex;align-items:center;min-height:40px;padding-bottom:0}
.gvnote a{display:inline-block;padding:8px 0}
/* section heads on phones: the link goes under the heading instead of squeezing it */
@media (max-width:560px){.sh{flex-wrap:wrap;align-items:flex-start;gap:4px 20px}.sh>div{flex:1 1 100%}}
/* guides: "stay nearby" heading off the photos, room before the next band */
.stay-near{padding-bottom:56px}.stay-near>h2{margin-bottom:22px}
/* guide hub text cards: less padding on phones */
@media (max-width:560px){.panelbox{padding:20px}}
/* FAQ rows: one padding, the + on the first line of the question */
.faq details{padding:0}
.faq summary::after{top:50%;transform:translateY(-50%)}
.faq details[open] summary::after{transform:translateY(-50%) rotate(45deg)}
/* legal pages on phones: tighter sections, balanced headings */
@media (max-width:600px){.docsec{padding:18px 0}.doc{padding-top:22px}}
.doc>h2,.page-hero h1{text-wrap:balance}
/* imprint: the whole contact card is the link; one rule under the cards */
.ccards div{position:relative}.ccards b>a::after{content:"";position:absolute;inset:0}
#business .doc::before{display:none}
/* anchors land below the sticky header everywhere */
html{scroll-padding-top:84px}
/* home: wrapped buttons under the property cards keep a gap */
.re p>a.btn{margin:0 6px 10px 0}
/* hero on phones: the sunset slide reads left to right like the sunrise one */
@media (max-width:760px){.tc-stage[data-m] .tc-w .tc-go{flex-direction:row}}
/* small labels a touch larger on phones */
@media (max-width:560px){.fbar small,.filters small,.bk-f small,.bk-dates small,.bk-when small,.pfacts small,.dow span{font-size:12px}}
/* booking on phones: the price summary follows the calendar (no jump when a date is tapped) and a bottom bar keeps
   the total next to "Continue"; the hint line keeps its height */
.bk-bar{display:none}
.bk-hint{min-height:1.5em}
@media (max-width:980px){
  .bk aside{order:1}
  .bk-bar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:40;align-items:center;justify-content:space-between;gap:12px;padding:10px 16px calc(10px + env(safe-area-inset-bottom,0px));background:var(--bg,#faf8f3);border-top:1px solid var(--line);box-shadow:0 -6px 20px rgba(28,27,25,.08)}
  .bk-bar b{display:block;font-family:var(--head);font-weight:500;font-size:21px;line-height:1.1}
  .bk-bar small{display:block;color:var(--muted-2);font-size:13px;margin-top:2px}
  .bk-bar .btn{flex:none;padding:13px 24px;font-size:15px}
  body:has(.bk-bar){padding-bottom:84px}
  body:has(.bk-bar) .fwa{display:none}
}
/* sell page: the button under the lead */
.page-cta{margin-bottom:8px}
/* back to top (long text pages): above the WhatsApp button */
.totop{position:fixed;right:12px;bottom:calc(78px + env(safe-area-inset-bottom,0px));z-index:39;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:#fff;color:var(--ink);border:1px solid var(--line);box-shadow:0 6px 18px rgba(0,0,0,.14);opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .25s,transform .25s,visibility 0s linear .25s}
.totop.on{opacity:1;visibility:visible;transform:none;transition:opacity .25s,transform .25s}
.totop svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
@media (min-width:561px){.totop{right:16px;bottom:calc(84px + env(safe-area-inset-bottom,0px))}}
@media (prefers-reduced-motion:reduce){.totop{transition:none}}
