/* Domus Aedes stays. Tokens, type and header/footer follow domus-hub/template.html */
@font-face{font-family:'Cormorant Garamond';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/cormorant-600.woff2) format('woff2')}
@font-face{font-family:'Lora';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/lora-400.woff2) format('woff2')}
@font-face{font-family:'Lora';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/lora-600.woff2) format('woff2')}
@font-face{font-family:'Lora';font-style:italic;font-weight:400;font-display:swap;src:url(fonts/lora-italic.woff2) format('woff2')}

:root{
  --navy-950:#070D16; --navy-900:#0B1522; --navy-800:#122033; --navy:#1F3044;
  --camel:#BB9B6A; --camel-300:#D2B580; --vanilla:#D8C9A6; --gold-ink:#8A6D40;
  --paper:#F1F2ED; --paper-2:#E9EAE2; --card:#FBFBF7;
  --ink:#1F3044; --ink-soft:#4A5A70;
  --cream:#EFEBE0; --cream-dim:rgba(239,235,224,.72); --cream-faint:rgba(239,235,224,.5);
  --hair-gold:rgba(187,155,106,.38); --hair-gold-strong:rgba(187,155,106,.65); --hair-ink:rgba(31,48,68,.14);
  --serif:'Cormorant Garamond',Georgia,serif; --body:'Lora',Georgia,serif;
  --gut:16px;
}
@media(min-width:720px){:root{--gut:28px}}
*{box-sizing:border-box;margin:0;padding:0}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;scrollbar-color:var(--camel) var(--paper-2)}
body{background:var(--paper);color:var(--ink);font-family:var(--body);font-size:16px;line-height:1.65;-webkit-font-smoothing:antialiased;overflow-x:hidden}
@supports(overflow:clip){body{overflow-x:clip}}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
::selection{background:var(--camel);color:var(--navy-950)}
a:focus-visible,button:focus-visible,select:focus-visible,input:focus-visible,textarea:focus-visible,summary:focus-visible{outline:2px solid var(--camel);outline-offset:3px;border-radius:2px}
.wrap{max-width:1180px;margin:0 auto;padding:0 var(--gut)}
.eyebrow{font-size:12px;font-weight:600;letter-spacing:.24em;text-transform:uppercase;color:var(--gold-ink)}
.dark .eyebrow{color:var(--camel-300)}
h1,h2,h3{font-family:var(--serif);font-weight:600;line-height:1.08;text-wrap:balance}
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- nav (as on domusaedes.com) ---------- */
.nav{position:sticky;top:0;z-index:50;background:rgba(7,13,22,.94);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--hair-gold);color:var(--cream)}
.nav-in{display:flex;align-items:center;gap:22px;height:62px}
.brand{display:flex;align-items:center;margin-right:auto;min-height:44px}
.brand img{height:22px;width:auto}
@media(min-width:420px){.brand img{height:24px}}
.nav a.item{font-size:13px;letter-spacing:.08em;color:var(--cream-dim);transition:color .25s}
.nav a.item:hover,.nav a.item[aria-current]{color:var(--camel-300)}
.nav .wa{border:1px solid var(--hair-gold-strong);border-radius:999px;padding:0 16px;min-height:38px;display:inline-flex;align-items:center;font-size:12.5px;letter-spacing:.06em;color:var(--camel-300);transition:all .25s;white-space:nowrap}
.nav .wa:hover{background:var(--camel);color:var(--navy-950)}
/* 3 Nov: the 38 px pill keeps its look; its tap area reaches 46 px (touch targets >= 44 px) */
.nav .wa{position:relative}.nav .wa::after{content:"";position:absolute;left:0;right:0;top:-4px;bottom:-4px}
.menu{position:relative}
.menu summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;margin-right:-10px;color:var(--cream)}
.menu summary::-webkit-details-marker{display:none}
.menu summary span,.menu summary span::before,.menu summary span::after{display:block;width:20px;height:1.5px;background:currentColor;position:relative;transition:transform .25s}
.menu summary span::before,.menu summary span::after{content:"";position:absolute;left:0}
.menu summary span::before{top:-6px}.menu summary span::after{top:6px}
.menu[open] summary span{background:transparent}
.menu[open] summary span::before{transform:translateY(6px) rotate(45deg)}
.menu[open] summary span::after{transform:translateY(-6px) rotate(-45deg)}
.menu-panel{position:fixed;left:0;right:0;top:62px;background:var(--navy-950);border-bottom:1px solid var(--hair-gold);padding:8px var(--gut) 22px;display:flex;flex-direction:column;box-shadow:0 30px 60px rgba(0,0,0,.45)}
.menu-panel a{font-family:var(--serif);font-size:24px;color:var(--cream);padding:10px 0;border-bottom:1px solid rgba(187,155,106,.16)}
.menu-panel a:last-child{border-bottom:0}
.menu-panel a.sub{font-family:var(--body);font-size:14px;color:var(--cream-dim);letter-spacing:.04em}
@media(max-width:899px){.nav a.item{display:none}}
@media(min-width:900px){.menu{display:none}}
@media(max-width:359px){.nav .wa{padding:0 12px}}

/* ---------- hero ---------- */
.hero{position:relative;overflow:hidden;color:var(--cream);background:var(--navy-900);min-height:min(88svh,820px);display:flex;align-items:flex-end;padding:96px 0 40px}
.hero-bg{position:absolute;inset:0;z-index:0}
.hero-bg img{width:100%;height:100%;object-fit:cover;object-position:center 55%}
.hero-bg::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(7,13,22,.6) 0%,rgba(11,21,34,.45) 38%,rgba(7,13,22,.82) 70%,rgba(7,13,22,.96) 100%)}
.hero-bg::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(7,13,22,.55) 0%,rgba(7,13,22,.25) 45%,rgba(7,13,22,0) 70%)}
.hero-in{position:relative;z-index:2;width:100%}
.hero .eyebrow{display:inline-flex;align-items:center;gap:12px;color:var(--camel-300)}
.hero .eyebrow::before{content:"";height:1px;width:34px;background:var(--hair-gold-strong)}
.hero h1{font-size:clamp(40px,9.5vw,80px);margin:16px 0 14px;max-width:13ch}
.hero h1 em{font-style:italic;color:var(--camel-300)}
.hero .sub{font-size:16px;color:var(--cream-dim);max-width:52ch;margin-bottom:26px}
@media(min-width:720px){.hero{padding:120px 0 64px}.hero .sub{font-size:17px}}

/* stationery finder card */
.finder{background:var(--paper);color:var(--ink);border-radius:8px;padding:20px 18px 18px;max-width:760px;position:relative;
  box-shadow:0 30px 80px rgba(0,0,0,.45),0 0 0 1px rgba(187,155,106,.5),inset 0 0 0 1px rgba(255,255,255,.6)}
.finder::before{content:"";position:absolute;inset:6px;border:1px solid rgba(187,155,106,.42);border-radius:5px;pointer-events:none}
.finder .seal{position:absolute;top:-22px;right:22px;width:46px;height:46px;border-radius:50%;background:var(--paper);display:flex;align-items:center;justify-content:center;
  box-shadow:0 8px 24px rgba(0,0,0,.4),0 0 0 2px var(--camel);z-index:2}
.finder .seal img{width:26px;height:auto}
.finder .lbl{font-size:12px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--gold-ink);margin-bottom:12px}
.finder form{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:10px;align-items:end;position:relative}
.finder .btn{grid-column:1/-1}
@media(min-width:720px){.finder{padding:24px 24px 20px}.finder form{grid-template-columns:minmax(0,1.5fr) minmax(0,.8fr) auto}.finder .f-dest,.finder .btn{grid-column:auto}}
.f{display:flex;flex-direction:column;gap:5px;min-width:0}
.f label{font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft)}
.f select,.f input,.f textarea{font-size:16px;color:var(--ink);background:#FBFBF7;border:1px solid rgba(31,48,68,.24);border-radius:4px;padding:11px 12px;width:100%;min-width:0;min-height:46px}
.f input[type=date]{-webkit-appearance:none;appearance:none;display:block}
.f textarea{min-height:110px;resize:vertical}
.f select:focus,.f input:focus,.f textarea:focus{outline:2px solid var(--camel);outline-offset:0;border-color:var(--camel)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font-weight:600;font-size:15px;letter-spacing:.04em;background:var(--navy);color:var(--vanilla);border:1px solid var(--navy);border-radius:4px;padding:0 26px;min-height:48px;cursor:pointer;transition:all .25s;white-space:nowrap;text-align:center}
.btn:hover{background:var(--camel);border-color:var(--camel);color:var(--navy-950)}
.btn-wa{background:var(--camel);border-color:var(--camel);color:var(--navy-950)}
.btn-wa:hover{background:var(--navy);border-color:var(--navy);color:var(--vanilla)}
.btn-line{background:transparent;color:var(--navy);border-color:rgba(31,48,68,.35)}
.btn-line:hover{background:transparent;border-color:var(--camel);color:var(--gold-ink)}
.dark .btn-line{color:var(--camel-300);border-color:var(--hair-gold-strong)}
.dark .btn-line:hover{background:var(--camel);color:var(--navy-950)}
.btn svg{width:18px;height:18px;flex:none}

.dest-chips{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:22px;font-size:14px;color:var(--cream-dim)}
.dest-chips a{display:inline-flex;align-items:center;gap:9px;min-height:36px}
.dest-chips a::before{content:"";width:5px;height:5px;transform:rotate(45deg);background:var(--camel)}
.dest-chips a:hover{color:var(--camel-300)}

/* ---------- sections ---------- */
.sec{padding:64px 0}
@media(min-width:720px){.sec{padding:92px 0}}
.sec-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:10px 24px;margin-bottom:26px}
.sec-head h2{font-size:clamp(30px,6vw,44px);color:var(--navy);margin-top:8px}
.sec-head p{color:var(--ink-soft);max-width:60ch;margin-top:8px}
.more-link{font-size:14px;font-weight:600;letter-spacing:.04em;color:var(--gold-ink);display:inline-flex;align-items:center;gap:8px;min-height:44px;white-space:nowrap}
.more-link::after{content:"→";transition:transform .25s}
.more-link:hover::after{transform:translateX(4px)}
.intro{background:var(--paper)}
.intro-grid{display:grid;gap:28px}
@media(min-width:900px){.intro-grid{grid-template-columns:1.1fr 1fr;gap:70px;align-items:center}}
.intro h2{font-size:clamp(32px,6.4vw,52px);color:var(--navy);margin:10px 0 16px}
.intro p.lede{font-size:17px;color:var(--ink-soft);max-width:56ch}
.steps{list-style:none;display:grid;gap:0;border-top:1px solid rgba(187,155,106,.5)}
.steps li{display:grid;grid-template-columns:44px 1fr;gap:4px 14px;padding:18px 0;border-bottom:1px solid rgba(187,155,106,.5)}
.steps .n{font-family:var(--serif);font-style:italic;font-size:30px;line-height:1;color:var(--camel)}
.steps b{font-family:var(--serif);font-size:23px;font-weight:600;color:var(--navy);line-height:1.15;display:block}
.steps span{color:var(--ink-soft);font-size:15px}
.dest{border-top:1px solid var(--hair-ink)}
.dest:nth-of-type(even){background:var(--paper-2)}

/* ---------- cards ---------- */
.cards{display:grid;gap:18px;grid-template-columns:minmax(0,1fr)}
@media(min-width:600px){.cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:980px){.cards{grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}}
/* home rows: swipe on phones, grid on larger screens */
@media(max-width:599px){
  .cards.row{grid-auto-flow:column;grid-template-columns:none;grid-auto-columns:84%;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;
    margin:0 calc(-1 * var(--gut));padding:0 var(--gut) 6px;scroll-padding:0 var(--gut);scrollbar-width:none}
  .cards.row::-webkit-scrollbar{display:none}
  .cards.row>*{scroll-snap-align:start}
}
.pcard{display:flex;flex-direction:column;background:var(--card);border:1px solid rgba(187,155,106,.32);border-radius:6px;overflow:hidden;transition:transform .35s,border-color .35s,box-shadow .35s;min-width:0}
.pcard:hover{transform:translateY(-4px);border-color:var(--hair-gold-strong);box-shadow:0 22px 50px rgba(31,48,68,.16)}
.pcard .ph{position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--paper-2)}
.pcard .ph img{width:100%;height:100%;object-fit:cover;transition:transform .8s ease}
.pcard:hover .ph img{transform:scale(1.04)}
.badge{position:absolute;top:12px;left:12px;font-size:11px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;background:rgba(7,13,22,.74);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);color:var(--camel-300);border:1px solid var(--hair-gold);border-radius:999px;padding:5px 11px}
.pcard .meta{padding:16px 18px 18px;display:flex;flex-direction:column;gap:4px;flex:1}
.pcard h3{font-size:23px;color:var(--navy);line-height:1.12}
.pcard .place{font-size:14px;color:var(--ink-soft)}
.pcard .facts{font-size:13.5px;color:var(--ink-soft)}
.pcard .price{margin-top:auto;padding-top:10px;font-weight:600;font-size:15.5px;color:var(--navy);font-variant-numeric:tabular-nums}
.pcard .price small{font-weight:400;font-size:13.5px;color:var(--ink-soft)}
.pcard.more{align-items:center;justify-content:center;text-align:center;padding:28px;background:var(--navy);color:var(--cream);border-color:var(--navy)}
.pcard.more b{font-family:var(--serif);font-size:26px;font-weight:600;display:block;margin-bottom:6px}
.pcard.more span{color:var(--camel-300);font-size:14px;font-weight:600}
@media(min-width:600px){.pcard.more{display:none}}

/* ---------- all stays ---------- */
.page-head{background:var(--navy-900);color:var(--cream);padding:46px 0 34px;border-bottom:1px solid var(--hair-gold)}
.page-head h1{font-size:clamp(36px,7vw,60px);margin:10px 0 10px}
.page-head p{color:var(--cream-dim);max-width:60ch}
.filters{position:sticky;top:62px;z-index:20;background:rgba(241,242,237,.96);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--hair-ink);padding:12px 0}
.filters form{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:10px;align-items:end}
@media(min-width:720px){.filters form{grid-template-columns:minmax(0,280px) minmax(0,180px) auto;justify-content:start}}
.filters .f label{font-size:11px}
.filters .reset{font-size:14px;color:var(--gold-ink);text-decoration:underline;text-underline-offset:3px;min-height:46px;display:none;align-items:center;background:none;border:0;cursor:pointer;justify-self:start}
.filters .reset.on{display:inline-flex}
.grid-sec{padding:28px 0 70px}
.group-title{font-family:var(--serif);font-size:30px;color:var(--navy);margin:34px 0 14px;display:flex;align-items:baseline;gap:14px}
.group-title:first-child{margin-top:4px}
.group-title::after{content:"";flex:1;height:1px;background:rgba(187,155,106,.5)}
.empty{display:none;text-align:center;padding:48px 18px;border:1px dashed rgba(187,155,106,.6);border-radius:6px;background:var(--card)}
.empty.on{display:block}
.empty h2{font-size:30px;color:var(--navy);margin-bottom:8px}
.empty p{color:var(--ink-soft);margin-bottom:18px}

/* ---------- property page ---------- */
.crumbs{font-size:13.5px;color:var(--ink-soft);padding:14px 0 0;display:flex;flex-wrap:wrap;gap:4px 8px}
.crumbs a{color:var(--gold-ink)}
.crumbs a:hover{text-decoration:underline}
.gallery{position:relative;margin-top:14px}
.g-swipe{display:grid;grid-auto-flow:column;grid-auto-columns:100%;overflow-x:auto;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;scrollbar-width:none;background:var(--navy-900)}
.g-swipe::-webkit-scrollbar{display:none}
.g-swipe button{scroll-snap-align:start;aspect-ratio:4/3;border:0;padding:0;background:var(--navy-800);cursor:zoom-in;display:block;width:100%}
.g-swipe img{width:100%;height:100%;object-fit:cover}
.g-count{position:absolute;right:12px;bottom:12px;font-size:12.5px;letter-spacing:.06em;background:rgba(7,13,22,.74);color:var(--cream);border-radius:999px;padding:5px 12px;pointer-events:none;font-variant-numeric:tabular-nums}
.g-mosaic{display:none}
@media(max-width:719px){.gallery{margin-left:calc(-1 * var(--gut));margin-right:calc(-1 * var(--gut))}}
@media(min-width:720px){
  .g-swipe,.g-count{display:none}
  .g-mosaic{display:grid;grid-template-columns:2fr 1fr 1fr;grid-template-rows:repeat(2,minmax(0,1fr));gap:8px;height:clamp(340px,44vw,520px);border-radius:8px;overflow:hidden}
  .g-mosaic button{border:0;padding:0;margin:0;background:var(--paper-2);cursor:zoom-in;overflow:hidden;min-height:0}
  .g-mosaic button:first-child{grid-row:1/3}
  .g-mosaic img{width:100%;height:100%;object-fit:cover;transition:transform .7s ease,filter .3s}
  .g-mosaic button:hover img{transform:scale(1.03);filter:brightness(1.04)}
  .g-mosaic.n1{grid-template-columns:1fr}
  .g-mosaic.n2,.g-mosaic.n3,.g-mosaic.n4{grid-template-columns:2fr 1fr}
}
.g-all{position:absolute;right:14px;bottom:14px;display:none;align-items:center;gap:8px;background:var(--paper);color:var(--navy);border:1px solid var(--navy);border-radius:4px;padding:0 16px;min-height:40px;font-size:14px;font-weight:600;cursor:pointer}
@media(min-width:720px){.g-all{display:inline-flex}}
.prop{display:grid;gap:26px;grid-template-columns:minmax(0,1fr);grid-template-areas:"head" "book" "main";padding:22px 0 70px}
.p-head{grid-area:head;min-width:0}.book{grid-area:book;min-width:0}.p-main{grid-area:main;min-width:0}
@media(min-width:960px){.prop{grid-template-columns:minmax(0,1fr) 360px;grid-template-areas:"head book" "main book";grid-template-rows:auto 1fr;column-gap:56px;row-gap:0;padding-top:34px}}
.prop h1{font-size:clamp(32px,6.6vw,50px);color:var(--navy);line-height:1.06}
.prop .place{margin-top:8px;color:var(--ink-soft);font-size:15px;display:flex;align-items:center;gap:8px}
.prop .place::before{content:"";width:6px;height:6px;transform:rotate(45deg);background:var(--camel);flex:none}
.keyfacts{display:grid;grid-template-columns:repeat(auto-fit,minmax(74px,1fr));gap:0 10px;margin:22px 0 4px;border-top:1px solid rgba(187,155,106,.5);border-bottom:1px solid rgba(187,155,106,.5)}
.keyfacts div{padding:14px 0 12px;min-width:0}
.keyfacts b{display:block;font-family:var(--serif);font-size:30px;line-height:1;color:var(--navy)}
.keyfacts span{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);white-space:nowrap}
@media(min-width:720px){.keyfacts span{font-size:12px;letter-spacing:.14em}}
.prose{margin-top:26px;color:var(--ink);font-size:16.5px}
.prose p{margin:0 0 14px;max-width:68ch}
.prose.clamped{max-height:300px;overflow:hidden;position:relative}
.prose.clamped::after{content:"";position:absolute;left:0;right:0;bottom:0;height:90px;background:linear-gradient(rgba(241,242,237,0),var(--paper))}
.readmore{background:none;border:0;color:var(--gold-ink);font-weight:600;font-size:15px;text-decoration:underline;text-underline-offset:3px;cursor:pointer;min-height:44px;padding:0}
.h-sec{font-size:32px;color:var(--navy);margin:44px 0 16px}
.amen{columns:2;column-gap:26px}
.amen>div{break-inside:avoid;margin-bottom:22px}
.amen h3{font-family:var(--body);font-size:12px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-ink);margin-bottom:8px}
.amen ul{list-style:none;display:grid;gap:6px}
.amen li{display:flex;gap:10px;align-items:baseline;font-size:15px;color:var(--ink)}
.amen li::before{content:"";width:5px;height:5px;transform:rotate(45deg) translateY(-2px);background:var(--camel);flex:none}
.photos{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
@media(min-width:900px){.photos{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}}
.photos figure{margin:0;min-width:0}
.photos button{display:block;width:100%;aspect-ratio:4/3;border:0;padding:0;background:var(--paper-2);cursor:zoom-in;overflow:hidden;border-radius:4px}
.photos img{width:100%;height:100%;object-fit:cover}
.photos figcaption{font-size:12.5px;color:var(--ink-soft);margin-top:5px;line-height:1.35}

/* booking card */
.book{align-self:start}
@media(min-width:960px){.book{position:sticky;top:86px}}
.book-card{background:var(--card);border:1px solid rgba(187,155,106,.55);border-radius:8px;padding:22px 20px 20px;position:relative;box-shadow:0 18px 50px rgba(31,48,68,.10)}
.book-card::before{content:"";position:absolute;inset:6px;border:1px solid rgba(187,155,106,.3);border-radius:5px;pointer-events:none}
.book-card>*{position:relative}
.book-card .from{font-size:14px;color:var(--ink-soft)}
.book-card .amt{font-family:var(--serif);font-size:44px;line-height:1;color:var(--navy);font-variant-numeric:lining-nums}
.book-card .amt small{font-family:var(--body);font-size:15px;color:var(--ink-soft);font-weight:400;white-space:nowrap}
.book-card .minstay{margin:8px 0 16px;font-size:14.5px;color:var(--ink)}
.book-card form{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px}
.book-card .f-g{grid-column:1/-1}
.book-card .btn{grid-column:1/-1;width:100%;margin-top:4px}
.book-card .soon{grid-column:1/-1;font-size:13.5px;color:var(--ink-soft);text-align:center;border:1px dashed rgba(31,48,68,.25);border-radius:4px;padding:10px;margin-top:2px}
.book-card .note{font-size:12.5px;color:var(--ink-soft);margin-top:12px;line-height:1.5}
.related{background:var(--paper-2);border-top:1px solid var(--hair-ink)}

/* sticky bottom bar on phones */
.mbar{display:none}
@media(max-width:959px){
  .mbar{display:flex;align-items:center;gap:12px;position:fixed;left:0;right:0;bottom:0;z-index:55;background:rgba(7,13,22,.95);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-top:1px solid var(--hair-gold);
    padding:10px var(--gut) calc(10px + env(safe-area-inset-bottom));color:var(--cream)}
  .mbar .p{flex:1;min-width:0;font-size:13px;color:var(--cream-dim);line-height:1.3}
  .mbar .p b{display:block;font-family:var(--serif);font-size:22px;color:var(--cream);font-weight:600}
  .mbar .btn{min-height:46px;padding:0 18px;font-size:14px}
  .mbar.site a{flex:1}
  body.has-mbar{padding-bottom:76px}
}
body.da-cc-open .mbar{display:none!important}

/* lightbox */
.lb{position:fixed;inset:0;z-index:100;background:var(--navy-950);display:none;align-items:center;justify-content:center;color:var(--cream)}
.lb.on{display:flex}
.lb img{max-width:100vw;max-height:calc(100svh - 120px);object-fit:contain}
.lb figure{margin:0;display:flex;flex-direction:column;align-items:center;gap:10px;padding:0 0 10px}
.lb figcaption{font-size:14px;color:var(--cream-dim);text-align:center;padding:0 16px;min-height:20px}
.lb button{position:absolute;background:rgba(7,13,22,.6);border:1px solid var(--hair-gold);color:var(--cream);width:48px;height:48px;border-radius:50%;cursor:pointer;font-size:22px;line-height:1;display:flex;align-items:center;justify-content:center}
.lb .x{top:14px;right:14px}
.lb .pv{left:12px;top:50%;transform:translateY(-50%)}
.lb .nx{right:12px;top:50%;transform:translateY(-50%)}
.lb .ct{position:absolute;top:24px;left:20px;font-size:13px;letter-spacing:.08em;color:var(--cream-dim)}
body.lb-open{overflow:hidden}
body.lb-open .mbar{display:none}

/* ---------- text pages ---------- */
.doc{padding:40px 0 80px}
.doc-in{max-width:820px;margin:0 auto}
.legal{font-size:15.5px;line-height:1.7;color:var(--ink);overflow-wrap:anywhere}
.legal h1{font-size:clamp(32px,6vw,46px);color:var(--navy);margin-bottom:10px;text-align:center}
.legal h2{font-size:clamp(26px,4.6vw,32px);color:var(--navy);margin:38px 0 12px;padding-top:12px;border-top:1px solid rgba(187,155,106,.45)}
.legal h3{font-family:var(--body);font-size:16.5px;font-weight:600;color:var(--navy);margin:24px 0 8px}
.legal p,.legal ul,.legal ol{margin:0 0 14px}
.legal ul,.legal ol{padding-left:22px}
.legal li{margin-bottom:8px}
.legal a{color:var(--gold-ink);text-decoration:underline;text-underline-offset:2px}
.legal .note{background:var(--card);border-left:3px solid var(--camel);padding:14px 18px;margin:20px 0;border-radius:0 4px 4px 0}
.legal .tbl{overflow-x:auto;margin:0 0 16px;-webkit-overflow-scrolling:touch}
.legal table{border-collapse:collapse;width:100%;min-width:520px;font-size:14px}
.legal th,.legal td{border:1px solid rgba(31,48,68,.2);padding:8px 10px;text-align:left;vertical-align:top}
.legal th{background:var(--paper-2)}
.legal small{color:var(--ink-soft)}
.faq h2{font-size:clamp(28px,5vw,36px);color:var(--navy);margin:34px 0 8px}
.faq details{border-bottom:1px solid rgba(187,155,106,.5)}
.faq details:first-of-type{border-top:1px solid rgba(187,155,106,.5)}
.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:16px;align-items:center;padding:18px 0;font-family:var(--serif);font-size:23px;font-weight:600;color:var(--navy);line-height:1.2}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:var(--body);font-size:24px;color:var(--camel);flex:none;transition:transform .25s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{padding:0 0 20px;color:var(--ink-soft);max-width:70ch}
.faq details p a{color:var(--gold-ink);font-weight:600}
.contact-grid{display:grid;gap:30px}
@media(min-width:900px){.contact-grid{grid-template-columns:1.2fr 1fr;gap:50px}}
.cform{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px;background:var(--card);border:1px solid rgba(187,155,106,.5);border-radius:8px;padding:22px 18px}
.cform .full{grid-column:1/-1}
.cform h2{grid-column:1/-1;font-size:30px;color:var(--navy)}
.cform .small{grid-column:1/-1;font-size:13px;color:var(--ink-soft)}
.cform .small a{color:var(--gold-ink);text-decoration:underline}
.cdetails{list-style:none;display:grid;gap:4px}
.cdetails li{padding:12px 0;border-bottom:1px solid rgba(187,155,106,.4)}
.cdetails b{display:block;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-ink);font-weight:600}
.cdetails a{color:var(--navy);font-size:17px}
.cdetails a:hover{color:var(--gold-ink)}

/* owners */
.o-hero{position:relative;color:var(--cream);background:var(--navy-900);padding:70px 0 60px;overflow:hidden;text-align:center}
.o-hero .bg{position:absolute;inset:0}
.o-hero .bg img{width:100%;height:100%;object-fit:cover;opacity:.32}
.o-hero .wrap{position:relative}
.o-hero h1{font-size:clamp(38px,8vw,72px);max-width:16ch;margin:12px auto 16px}
.o-hero p{max-width:52ch;margin:0 auto 26px;color:var(--cream-dim);font-size:17px}
.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.stat{background:var(--card);border:1px solid rgba(187,155,106,.45);border-radius:6px;padding:18px 8px;text-align:center}
@media(min-width:720px){.stats{gap:14px}.stat{padding:24px 16px}}
.stat b{display:block;font-family:var(--serif);font-size:46px;line-height:1;color:var(--gold-ink)}
.stat span{font-size:14px;color:var(--ink-soft)}
.svc{display:grid;gap:14px;grid-template-columns:minmax(0,1fr)}
@media(min-width:600px){.svc{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:980px){.svc{grid-template-columns:repeat(3,minmax(0,1fr))}}
.svc div{background:var(--card);border:1px solid rgba(187,155,106,.35);border-radius:6px;padding:22px 20px}
.svc h3{font-size:24px;color:var(--navy);margin-bottom:6px}
.svc p{font-size:15px;color:var(--ink-soft)}
.center{text-align:center}
.center .sec-head{justify-content:center;text-align:center}

/* ---------- door CTA + footer ---------- */
.door{background:var(--navy-900);color:var(--cream);text-align:center;padding:72px 0;border-top:1px solid var(--hair-gold);position:relative;overflow:hidden}
.door .line{font-family:var(--serif);font-size:clamp(32px,6vw,48px);font-weight:600;margin:10px 0 10px}
.door .sub{color:var(--cream-dim);max-width:52ch;margin:0 auto 26px}
.door .btns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
footer{background:var(--navy-950);border-top:1px solid var(--hair-gold);padding:58px 0 34px;color:var(--cream-faint)}
.foot-grid{display:grid;gap:34px;grid-template-columns:minmax(0,1fr) minmax(0,1fr);margin-bottom:40px}
.foot-brand{grid-column:1/-1}
.foot-brand img{height:34px;width:auto;margin-bottom:14px}
.foot-brand p{font-size:14px;max-width:38ch;color:var(--cream-dim)}
.foot-contact{grid-column:1/-1}
@media(min-width:900px){.foot-grid{grid-template-columns:1.4fr 1fr 1fr 1.1fr}.foot-brand,.foot-contact{grid-column:auto}}
footer h4{font-size:12px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--camel-300);margin-bottom:12px;font-family:var(--body)}
footer ul{list-style:none;display:flex;flex-direction:column}
footer ul a,footer ul span{font-size:14px;color:var(--cream-dim);transition:color .25s;display:inline-flex;align-items:center;min-height:36px;overflow-wrap:anywhere}
footer ul a:hover{color:var(--camel-300)}
.foot-base{border-top:1px solid rgba(187,155,106,.18);padding-top:20px;display:flex;flex-wrap:wrap;gap:6px 22px;font-size:12.5px;align-items:center}
.foot-base a{min-height:36px;display:inline-flex;align-items:center}
.foot-base a:hover{color:var(--camel-300)}
.foot-base .socials{display:flex;flex-wrap:wrap;gap:4px 16px}
@media(min-width:900px){.foot-base .socials{margin-left:auto}}

/* cookie consent (same as domusaedes.com) */
#da-cc[hidden]{display:none!important}
#da-cc{position:fixed;left:0;right:0;bottom:0;z-index:9999;background:var(--paper);color:var(--ink);border-top:2px solid var(--camel);
  padding:16px var(--gut) calc(16px + env(safe-area-inset-bottom));box-shadow:0 -8px 30px rgba(31,48,68,.12);font-size:15px;line-height:1.5}
#da-cc p{margin:0 0 12px;max-width:720px}
#da-cc a{color:var(--gold-ink);text-decoration:underline;text-underline-offset:2px}
.da-cc-btns{display:flex;gap:10px;flex-wrap:wrap}
.da-cc-btns button{flex:1 1 140px;min-height:48px;padding:12px 18px;font-size:15px;border-radius:4px;cursor:pointer}
#da-cc-yes{background:var(--navy);color:var(--paper);border:1px solid var(--navy)}
#da-cc-no{background:transparent;color:var(--ink);border:1px solid var(--ink-soft)}
@media(min-width:720px){#da-cc{display:flex;align-items:center;gap:24px}#da-cc p{margin:0;flex:1}.da-cc-btns{flex:0 0 auto}.da-cc-btns button{flex:0 0 auto}}

@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;scroll-behavior:auto!important}}

/* figures: Cormorant's old-style numerals read badly at display size, so numbers use Lora */
.keyfacts b,.book-card .amt,.mbar .p b,.stat b{font-family:var(--body);font-weight:600;font-variant-numeric:lining-nums tabular-nums;letter-spacing:-.01em}
.keyfacts b{font-size:26px}
.book-card .amt{font-size:38px}
.mbar .p b{font-size:19px}
.stat b{font-size:40px}

.book-card .amt.long{font-size:28px}
.mbar .p b.long{font-size:16px}
@media(max-width:719px){.stat b{font-size:30px}.stat span{font-size:13px;display:block;line-height:1.35;margin-top:6px}}
.door .btns .btn,.o-hero .btn{min-width:230px}
@media(max-width:480px){.door .btns{flex-direction:column;align-items:stretch;max-width:320px;margin:0 auto}.o-hero .btn{white-space:normal;padding:12px 20px}}

/* ---------- round 2: destinations first ---------- */
.dests{background:var(--paper)}
.dgrid{display:grid;gap:14px;grid-template-columns:minmax(0,1fr)}
@media(min-width:720px){.dgrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}}
.dcard{position:relative;display:block;overflow:hidden;border-radius:8px;aspect-ratio:4/3;background:var(--navy-800);color:var(--cream);isolation:isolate;
  box-shadow:0 0 0 1px rgba(187,155,106,.35)}
.dcard img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform .9s ease}
.dcard::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(7,13,22,.05) 25%,rgba(7,13,22,.55) 58%,rgba(7,13,22,.92) 100%)}
.dcard:hover img{transform:scale(1.04)}
.dc-in{position:absolute;left:0;right:0;bottom:0;padding:20px 20px 18px}
.dcard .eyebrow{color:var(--camel-300)}
.dcard h3{font-size:clamp(32px,7vw,44px);margin:6px 0 6px;color:var(--cream)}
.dcard p{font-size:14.5px;line-height:1.5;color:var(--cream-dim);max-width:46ch}
.dcard .go{display:inline-flex;align-items:center;gap:8px;margin-top:12px;font-size:14px;font-weight:600;letter-spacing:.04em;color:var(--camel-300)}
.dcard .go::after{content:"→";transition:transform .25s}
.dcard:hover .go::after{transform:translateX(4px)}
@media(min-width:720px){.dcard.wide{grid-column:1/-1;aspect-ratio:21/8}.dc-in{padding:26px 28px 24px}}
.dark-crumbs{padding:0 0 4px;color:var(--cream-dim)}
.dark-crumbs a{color:var(--camel-300)}

/* concierge */
.cc-band{background:var(--paper-2);border-top:1px solid rgba(187,155,106,.45);border-bottom:1px solid rgba(187,155,106,.45);text-align:center;padding:52px 0}
.cc-band .line{font-family:var(--serif);font-size:clamp(30px,6vw,42px);font-weight:600;color:var(--navy);line-height:1.1}
.cc-band .sub{color:var(--ink-soft);margin:8px auto 22px;max-width:52ch;font-size:16.5px}
.foot-cc{margin-top:14px;font-size:14px;color:var(--cream-dim)}
.foot-cc a{color:var(--camel-300);text-decoration:underline;text-underline-offset:3px}
.empty .btn{margin-top:4px}

/* trust badges (the published images, never redrawn) */
.badges{display:flex;align-items:center;gap:16px;background:#fff;border:1px solid rgba(187,155,106,.38);border-radius:6px;padding:8px 18px;width:fit-content;max-width:100%;margin-top:24px}
.badges .b-sh{width:112px;height:70px;object-fit:cover;flex:none}
.badges .b-bk{height:38px;width:auto;max-width:170px;flex:none}
.badges.in-aside{margin:14px auto 0;justify-content:center}
@media(min-width:960px){.badges.in-aside{width:100%}}
.host{margin-top:14px;padding:14px 16px;border:1px solid rgba(187,155,106,.38);border-radius:6px;background:var(--card)}
.host .h-name{font-family:var(--serif);font-size:22px;font-weight:600;color:var(--navy);line-height:1.15;margin-top:4px}
.host .h-legal{font-size:13px;line-height:1.5;color:var(--ink-soft);margin-top:4px;overflow-wrap:anywhere}

/* rental agreement */
.agree{margin-top:40px;border-top:1px solid rgba(187,155,106,.5);border-bottom:1px solid rgba(187,155,106,.5)}
.agree summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:14px;padding:18px 0;font-family:var(--serif);font-size:28px;font-weight:600;color:var(--navy)}
.agree summary::-webkit-details-marker{display:none}
.agree summary::after{content:"+";font-family:var(--body);font-size:26px;color:var(--camel);transition:transform .25s}
.agree[open] summary::after{transform:rotate(45deg)}
.agree .agree-text{padding:0 0 18px;max-height:none}
.agree .agree-link{padding:0 0 18px}
.agree .agree-link a{color:var(--gold-ink);font-weight:600;text-decoration:underline}

/* legal pages */
.operator{background:var(--card);border:1px solid rgba(187,155,106,.5);border-left:3px solid var(--camel);border-radius:0 6px 6px 0;padding:16px 18px;margin:0 0 30px}
.operator p{margin:8px 0 0}
.legal .legal-h1.left{text-align:left}
.legal .rule{width:48px;height:1px;background:var(--camel);margin:14px 0 18px}
.legal .upd{font-size:13px;color:var(--ink-soft);font-style:italic;margin-bottom:6px}
.legal code{font-size:.92em;background:var(--paper-2);padding:1px 4px;border-radius:3px}
.src-note{margin-top:26px}
.foot-legal{border-top:1px solid rgba(187,155,106,.18);padding:22px 0 18px;font-size:12.5px;line-height:1.55;color:var(--cream-faint)}
.foot-legal h4{margin-bottom:8px}
.foot-legal p{margin:0 0 6px;max-width:100ch;overflow-wrap:anywhere}
.foot-legal-links{display:flex;flex-wrap:wrap;gap:0 20px;margin-top:6px}
.foot-legal-links a{color:var(--cream-dim);min-height:36px;display:inline-flex;align-items:center}
.foot-legal-links a:hover{color:var(--camel-300)}

/* round 2 fixes after the renders */
@media(max-width:719px){
  .finder form{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .finder .f-dest{grid-column:1/-1}
  .finder .btn{grid-column:auto;align-self:end}
  .dcard{aspect-ratio:1/1}
  .keyfacts b{font-size:22px}
}
.keyfacts b{white-space:nowrap}
.dcard::after{background:linear-gradient(180deg,rgba(7,13,22,0) 18%,rgba(7,13,22,.62) 50%,rgba(7,13,22,.94) 100%)}
.dcard .eyebrow,.dcard h3,.dcard p{text-shadow:0 1px 14px rgba(7,13,22,.55)}
.intro+.dests{padding-top:0}
.foot-legal-links .cc-open{background:none;border:0;padding:0;font:inherit;color:var(--cream-dim);cursor:pointer;min-height:36px}
.foot-legal-links .cc-open:hover{color:var(--camel-300)}

/* ---------- round 4: dates first ---------- */
.finder{max-width:960px}
.finder form.dates-form{grid-template-columns:repeat(2,minmax(0,1fr))}
.finder form.dates-form .f-dest,.finder form.dates-form .btn{grid-column:1/-1}
@media(min-width:720px){.finder form.dates-form{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr) minmax(0,1fr) minmax(0,.7fr) auto}
  .finder form.dates-form .f-dest,.finder form.dates-form .btn{grid-column:auto}}
@media(max-width:719px){.finder form.dates-form .f-g{grid-column:1/-1}}
.filters form.dates-form{grid-template-columns:repeat(2,minmax(0,1fr))}
.filters form.dates-form .f-sw,.filters form.dates-form .btn,.filters form.dates-form .f-g{grid-column:1/-1}
@media(min-width:720px){.filters form.dates-form{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) minmax(0,1fr) minmax(0,.7fr) auto;justify-content:stretch}
  .filters form.dates-form .f-sw,.filters form.dates-form .btn,.filters form.dates-form .f-g{grid-column:auto}}
.filters{position:static}
@media(min-width:720px){.filters{position:sticky}}
.filters .btn{min-height:46px}
.js [data-results]:not(.ready){display:none}
.ask-dates{display:none;text-align:center;padding:34px 18px;border:1px dashed rgba(187,155,106,.6);border-radius:6px;background:var(--card);margin-bottom:8px}
.js .ask-dates:not([hidden]){display:block}
.ask-dates h2{font-size:32px;color:var(--navy);margin-bottom:6px}
.ask-dates p{color:var(--ink-soft);max-width:56ch;margin:0 auto}
.res-sum{font-size:15px;color:var(--ink);margin:0 0 16px;padding:10px 14px;background:var(--card);border-left:3px solid var(--camel);border-radius:0 4px 4px 0}
/* direct stays on a destination page: on request, after the date results (site.js shows them with the results) */
.js [data-ondemand]:not(.ready){display:none}
.od{margin-top:30px}
/* a direct stay's card: no minimum-stay line under the price, so the price keeps the same air before the dates */
.book-card[data-od] .amt{margin-bottom:16px}
.empty{border-style:solid;border-color:var(--camel);background:var(--paper-2)}
.empty h2{font-size:clamp(28px,5vw,36px)}
.empty .btn{white-space:normal;line-height:1.3;padding:12px 22px}
.avail-note{grid-column:1/-1;font-size:14px;line-height:1.45;padding:10px 12px;border-radius:4px;background:var(--paper-2);color:var(--ink)}
.avail-note.ok{background:#E7EFE6;color:#24452B}
.avail-note.no{background:#F6E9E3;color:#6B2E1F}
.avail-note a{color:inherit;font-weight:600;text-decoration:underline;text-underline-offset:2px}
.finder .f select,.finder .f input,.filters .f select,.filters .f input{height:46px}

/* ---------- online booking: stay card steps, guest details, bank transfer, booking pages ---------- */
.bk form>:not(.f){grid-column:1/-1}
.bk form>.f.full{grid-column:1/-1}
.bk .bk-head .minstay{margin-bottom:14px}
.bk.is-live .bk-dates>.btn-wa,.bk.is-live .bk-dates>.note{display:none}
.bk:not(.is-live) .bk-dates>.bk-ask,.bk.is-live .bk-hint{display:none}
.bk-hint{font-size:13.5px;line-height:1.45;color:var(--ink-soft);text-align:center;margin:2px 0}
.bk-ask{font-size:14px;color:var(--ink-soft);text-align:center;margin-top:2px}
.bk-ask a{color:var(--gold-ink);font-weight:600;text-decoration:underline;text-underline-offset:3px}
.avail-note.wait{background:transparent;color:var(--ink-soft);padding-left:0}
.avail-note.wait::before{content:"";display:inline-block;width:12px;height:12px;margin-right:9px;vertical-align:-1px;border:2px solid var(--camel);border-right-color:transparent;border-radius:50%;animation:bkspin .8s linear infinite}
@keyframes bkspin{to{transform:rotate(360deg)}}
.bk-quote{border-top:1px solid var(--hair-gold);padding-top:12px;margin-top:2px}
.bk-qh{display:flex;justify-content:space-between;gap:10px;font-size:11.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:4px}
.bk-qh span:last-child{letter-spacing:.06em;text-transform:none;font-weight:400;font-size:13px}
.bk-lines>div{display:flex;justify-content:space-between;align-items:baseline;gap:14px;padding:5px 0;font-size:15px;line-height:1.4}
.bk-lines dt{color:var(--ink-soft);min-width:0}
.bk-lines dd{color:var(--ink);white-space:nowrap;font-variant-numeric:lining-nums tabular-nums}
.bk-lines .tot{border-top:1px solid var(--hair-ink);margin-top:6px;padding-top:10px}
.bk-lines .tot dt{color:var(--navy);font-weight:600}
.bk-lines .tot dd{font-size:24px;font-weight:600;color:var(--navy);letter-spacing:-.01em}
.bk-sum{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;padding-bottom:4px}
.bk-sum p{min-width:0}
.bk-sum b{display:block;font-size:17px;font-weight:600;color:var(--navy);line-height:1.35;font-variant-numeric:lining-nums}
.bk-sum span{display:block;font-size:14px;color:var(--ink-soft);line-height:1.4;margin-top:2px}
.bk-change,.bk-code-link,.bk-code-rm{background:none;border:0;padding:0 2px;min-height:44px;color:var(--gold-ink);font-size:14px;font-weight:600;text-decoration:underline;text-underline-offset:3px;cursor:pointer;white-space:nowrap}
/* a review code (2026-11-03): "Have a code?" under the live price opens one field with Apply; applied, one line with
   Remove; refused, the reason in the card's own note colours. Every control is 44 px or more */
.bk-code{display:grid;gap:4px;margin-top:-4px}
.bk-code-link{justify-self:start}
.bk-code-f{display:grid;gap:6px}
.bk-code-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px}
.bk-code-row input{text-transform:uppercase;letter-spacing:.06em;font-variant-numeric:lining-nums}
.bk-code-row input::placeholder{text-transform:none;letter-spacing:0}
.book-card .bk-code-go{grid-column:auto;width:auto;margin-top:0;min-height:46px;padding:0 18px}   /* beside the field, not the card's full-width button */
.bk-code-go[disabled]{opacity:.55;cursor:progress}
.bk-code-msg{display:flex;flex-wrap:wrap;align-items:center;column-gap:12px;font-size:14px;line-height:1.45;color:var(--ink)}
.bk-code-msg>span{padding:4px 0;min-width:0}
.bk-code-msg.ok{color:#24452B}
.bk-code-msg.ok>span{font-weight:600}
.bk-code-msg.no{padding:10px 12px;border-radius:4px;background:#F6E9E3;color:#6B2E1F}
.bk-code-msg.wait{color:var(--ink-soft)}
.bk-code-msg.wait>span::before{content:"";display:inline-block;width:12px;height:12px;margin-right:9px;vertical-align:-1px;border:2px solid var(--camel);border-right-color:transparent;border-radius:50%;animation:bkspin .8s linear infinite}
.bk-h{font-size:25px;color:var(--navy);margin-top:10px;outline:none}
.bk-tel{display:grid;grid-template-columns:minmax(0,7.4em) minmax(0,1fr);gap:8px}
.bk-consent{display:flex;gap:11px;align-items:flex-start;font-size:14px;line-height:1.5;color:var(--ink);cursor:pointer;margin:2px 0}
.bk-consent input{flex:none;width:20px;height:20px;margin-top:1px;accent-color:var(--navy);cursor:pointer}
.bk-consent a{color:var(--gold-ink);text-decoration:underline;text-underline-offset:2px}
.bk-consent input[aria-invalid="true"]{outline:2px solid #B4533A;outline-offset:2px}
.bk [aria-invalid="true"]{border-color:#B4533A}
.bk-err{font-size:14px;line-height:1.45;padding:10px 12px;border-radius:4px;background:#F6E9E3;color:#6B2E1F}
.bk-err a{color:inherit;font-weight:600;text-decoration:underline;text-underline-offset:2px}
.book-card .bk-pay{margin-top:0}
.book-card .bk-pay[disabled]{opacity:.55;cursor:default}
.book-card .bk-pay[aria-busy="true"]{opacity:1;cursor:progress}
.bk-fine{font-size:12.5px;line-height:1.5;color:var(--ink-soft)}
.bk-fine b{color:var(--ink);font-weight:600}
/* the payment step (2026-11-03): the methods as equal cards in one radio group, the chosen one in the accent (camel
   frame, warm fill, gold dot and icon), the others neutral; stacked on phones and in the 360 px desktop card, side by
   side only on the full-width card (600-959 px: the Duo opened, tablets). The radio fills its card, unseen: a tap
   anywhere chooses, arrow keys move. */
.bk-pmw{border-top:1px solid var(--hair-ink);padding-top:14px;margin-top:4px}
.bk-pm-l{font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:7px}
.bk-pm{display:grid;grid-template-columns:minmax(0,1fr);gap:8px}
.bk-m{position:relative;display:flex;min-width:0}
.bk-m-r{position:absolute;inset:0;z-index:1;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.bk-m-b{flex:1;min-width:0;display:grid;grid-template-columns:auto minmax(0,1fr) auto;grid-template-rows:auto auto;column-gap:12px;
  align-items:center;min-height:62px;padding:10px 14px;background:#FBFBF7;border:1px solid rgba(31,48,68,.24);border-radius:6px;
  transition:border-color .2s,background-color .2s,box-shadow .2s}
.bk-m-ic{grid-column:1;grid-row:1/3;display:flex;color:var(--ink-soft)}
.bk-m-ic svg{width:24px;height:24px}
.bk-m-n{grid-column:2;grid-row:1;align-self:end;font-size:15.5px;font-weight:600;line-height:1.3;color:var(--navy)}
.bk-m-d{grid-column:2;grid-row:2;align-self:start;font-size:13px;line-height:1.4;color:var(--ink-soft);margin-top:1px}
.bk-m-n,.bk-m-d{min-width:0;overflow-wrap:anywhere}
.bk-m-dot{grid-column:3;grid-row:1/3;position:relative;width:20px;height:20px;border:1.5px solid rgba(31,48,68,.38);border-radius:50%;background:#fff}
.bk-m-r:checked+.bk-m-b{background:#FAF0DE;border-color:var(--camel);box-shadow:inset 0 0 0 1px var(--camel)}
.bk-m-r:checked+.bk-m-b .bk-m-ic{color:var(--gold-ink)}
.bk-m-r:checked+.bk-m-b .bk-m-dot{border:2px solid var(--gold-ink)}
.bk-m-r:checked+.bk-m-b .bk-m-dot::after{content:"";position:absolute;inset:3px;border-radius:50%;background:var(--gold-ink)}
.bk-m-r:focus-visible+.bk-m-b,.bk-pm.kb .bk-m-r:focus+.bk-m-b{outline:2px solid var(--navy);outline-offset:2px}
@media(hover:hover){.bk-m:hover .bk-m-r:not(:checked):not(:disabled)+.bk-m-b{border-color:var(--camel)}}
.bk-m-r:disabled{cursor:default}
.bk-m-r:disabled:not(:checked)+.bk-m-b{opacity:.55}
.bk-x{display:grid;gap:8px}
.book-card .bk-pay{white-space:normal;line-height:1.3;padding:10px 18px;min-height:52px}
@media(min-width:600px) and (max-width:959.98px){
  .bk-pm{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr)}
  .bk-m-b{grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto auto 1fr;align-items:start;column-gap:8px;padding:12px 12px 14px}
  .bk-m-ic{grid-row:1}
  .bk-m-dot{grid-column:2;grid-row:1}
  .bk-m-n{grid-column:1/-1;grid-row:2;align-self:start;margin-top:8px}
  .bk-m-d{grid-column:1/-1;grid-row:3;margin-top:2px}
}
/* dates taken here (2026-11-03): our other stays of the destination free on them, priced by the live quote, then the
   concierge line. Rows with a photo on phones and in the desktop card; three across on the full-width card */
.bk-alts{display:grid;gap:8px}
.bk-alts-h{font-size:15px;font-weight:600;line-height:1.35;color:var(--navy);margin-top:2px}
.bk-alt{display:grid;grid-template-columns:88px minmax(0,1fr) auto;align-items:center;column-gap:12px;min-height:74px;
  padding:7px 12px 7px 7px;background:#FBFBF7;border:1px solid rgba(31,48,68,.2);border-radius:6px;transition:border-color .2s}
.bk-alt::after{content:"›";font-size:24px;line-height:1;color:var(--gold-ink)}
@media(hover:hover){.bk-alt:hover{border-color:var(--camel)}}
.bk-alt-ph{display:block;width:88px;aspect-ratio:4/3;border-radius:4px;overflow:hidden;background:var(--paper-2)}
.bk-alt-ph img{width:100%;height:100%;object-fit:cover}
.bk-alt-t{min-width:0;display:flex;flex-direction:column;gap:3px}
.bk-alt-t b{font-size:14.5px;font-weight:600;line-height:1.3;color:var(--navy);overflow-wrap:anywhere}
.bk-alt-t span{font-size:13.5px;line-height:1.35;color:var(--ink);font-variant-numeric:lining-nums tabular-nums}
.bk-alts-cc{font-size:14px;line-height:1.45;margin-top:2px}
.bk-alts-cc a{color:var(--gold-ink);font-weight:600;text-decoration:underline;text-underline-offset:3px}
@media(min-width:600px) and (max-width:959.98px){
  .bk-alts{grid-template-columns:repeat(3,minmax(0,1fr));column-gap:10px}
  .bk-alts-h,.bk-alts-cc{grid-column:1/-1}
  .bk-alt{grid-template-columns:minmax(0,1fr);grid-template-rows:auto 1fr;align-items:start;row-gap:8px;padding:0 0 10px;overflow:hidden}
  .bk-alt::after{display:none}
  .bk-alt-ph{width:100%;aspect-ratio:16/9;border-radius:0}
  .bk-alt-t{padding:0 10px}
}
@media(min-width:960px){   /* the desktop card is 360 px wide: three cards of about 100 px */
  .bk-m-b{padding:10px 9px 12px}
  .bk-m-ic svg{width:22px;height:22px}
  .bk-m-dot{width:18px;height:18px}
  .bk-m-n{font-size:14px;margin-top:6px}
  .bk-m-d{font-size:12px;line-height:1.38}
}
.bk-done{outline:none}
.bk-done .eyebrow{display:block}
.bk-dh{font-size:30px;color:var(--navy);margin:6px 0 6px}
.bk-what{font-size:14px;color:var(--ink-soft);margin:0 0 14px}
.bk-bank{background:#fff;border:1px solid var(--hair-gold);border-radius:6px;padding:2px 14px;margin:0 0 14px}
.bk-bank>div{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:2px 10px;padding:10px 0;border-bottom:1px solid var(--hair-ink)}
.bk-bank>div:last-child{border-bottom:0}
.bk-bank dt{grid-column:1/-1;font-size:11.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft)}
.bk-bank dd{font-size:16px;color:var(--ink);overflow-wrap:anywhere;font-variant-numeric:lining-nums tabular-nums}
.bk-bank dd.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:15px;letter-spacing:.02em}
.bk-copy{background:none;border:1px solid var(--hair-gold-strong);border-radius:999px;color:var(--gold-ink);font-size:12.5px;font-weight:600;padding:0 13px;min-height:34px;cursor:pointer}
.bk-copy:hover{background:var(--camel);border-color:var(--camel);color:var(--navy-950)}
.bk-ins{font-size:14.5px;line-height:1.55;color:var(--ink);margin:0 0 12px}
.bk-hold{font-size:14.5px;line-height:1.55;background:#FBF3E4;border-left:3px solid var(--camel);border-radius:0 4px 4px 0;padding:12px 14px;margin:0 0 14px;color:var(--ink)}
.bk-hold b{color:var(--navy)}
.book-card .bk-again{margin:0 0 12px}
@media(min-width:960px){.book.bk-tall{position:static}}
body.bk-form .mbar{display:none!important}
@media(max-width:959px){body.bk-form.has-mbar{padding-bottom:0}}
.mbar .mb-q span{display:block}
.mbar .mb-book{background:var(--camel);border-color:var(--camel);color:var(--navy-950)}
.mbar .mb-book:hover{background:var(--camel-300);border-color:var(--camel-300)}
.bk-page h2{font-size:clamp(28px,5vw,36px);color:var(--navy);margin:0 0 14px}
.bk-page .steps{margin:0 0 30px}
.bk-page .bk-lede{color:var(--ink-soft);font-size:16.5px;margin:0 0 24px;max-width:60ch}
.bk-page .btns{display:flex;flex-wrap:wrap;gap:12px}
@media(max-width:480px){.bk-page .btns{flex-direction:column;align-items:stretch}}
.bk-hp{position:absolute!important;left:-10000px;top:0;width:1px;height:1px;overflow:hidden}
.bk-status{margin:0 0 34px}
.bk-status .bk-hold{font-size:16px;line-height:1.55;margin:0 0 16px}
.bk-status .avail-note{font-size:16px;margin:0 0 16px}
.bk-hold.ok{background:#E7EFE6;border-left-color:#5F8B66;color:#24452B}
.bk-hold.ok b{color:#24452B}
.bk-status .bk-bank{margin:0 0 16px}
@media(max-width:480px){.bk-status .btn{display:flex;width:100%}}

/* ---------- round 5 (2026-11-02): phones, the iPhone Duo and short screens. Desktop (1024 px and wider) is unchanged:
   the rules below are for narrower or shorter screens, or draw the same pixels on desktop (checked in Chromium and WebKit) ---------- */
/* M1: WebKit (Safari, every iPhone) cut the text of a 46px select: 11px padding left 22px for a 26px line. Without the
   vertical padding WebKit centres it; Chromium centred it already and draws the same pixels. */
.finder .f select,.filters .f select{padding-top:0;padding-bottom:0}
@media(max-width:1023.98px){.f select{height:46px;padding-top:0;padding-bottom:0}}   /* WebKit made the others 54px */

/* iPhone safe areas: viewport-fit=cover lets the page run under the notch in landscape, so text and bars keep clear of it
   (env() is 0 on other screens, so nothing moves there) */
.wrap,.menu-panel,#da-cc{padding-left:max(var(--gut),env(safe-area-inset-left));padding-right:max(var(--gut),env(safe-area-inset-right))}
@media(max-width:959px){.mbar{padding-left:max(var(--gut),env(safe-area-inset-left));padding-right:max(var(--gut),env(safe-area-inset-right))}}
@media(max-width:719px){.gallery{margin-left:calc(-1 * max(var(--gut),env(safe-area-inset-left)));margin-right:calc(-1 * max(var(--gut),env(safe-area-inset-right)))}}
.lb .x{top:calc(14px + env(safe-area-inset-top));right:calc(14px + env(safe-area-inset-right))}
.lb .pv{left:calc(12px + env(safe-area-inset-left))}
.lb .nx{right:calc(12px + env(safe-area-inset-right))}
.lb .ct{top:calc(24px + env(safe-area-inset-top));left:calc(20px + env(safe-area-inset-left))}

/* the header wordmark on phones and tablets: 26px, as on domusaedes.com (22px read small at 402 px) */
@media(max-width:1023.98px){.brand img{height:26px}}
@media(max-width:359.98px){.brand img{height:24px}}

/* M3: the cookie bar, compact on phones and on short screens (it took a third of the folded Duo) */
@media(max-width:719.98px){
  #da-cc{padding-top:10px;padding-bottom:calc(10px + env(safe-area-inset-bottom));font-size:13px;line-height:1.4}
  #da-cc p{margin-bottom:8px}
  .da-cc-btns{gap:8px;flex-wrap:nowrap}
  .da-cc-btns button{flex:1 1 0;min-width:0;min-height:44px;padding:8px 10px;font-size:14.5px}
}
@media(min-width:720px) and (max-width:1023.98px) and (max-height:700px){
  #da-cc{padding-top:10px;padding-bottom:calc(10px + env(safe-area-inset-bottom));font-size:14px}
  .da-cc-btns button{min-height:44px;padding:8px 16px}
}

/* the search forms on phones and the Duo: destination; check-in and check-out; guests beside the button (one row less) */
@media(max-width:719.98px){
  .finder form.dates-form .f-g,.finder form.dates-form .btn,.filters form.dates-form .f-g,.filters form.dates-form .btn{grid-column:auto}
  .finder form.dates-form .btn,.filters form.dates-form .btn{align-self:end;min-width:0;padding:0 12px}
}

/* tablets and the Duo opened sideways (720 to 1023 px): the one-row search cut "Choose a destination" and "Guests";
   the button takes a second row */
@media(min-width:720px) and (max-width:1023.98px){
  .finder form.dates-form{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr) minmax(0,1fr) minmax(0,.8fr)}
  .finder form.dates-form .btn{grid-column:1/-1}
  /* the destination page's date filter too: in one row it cut "Huéspedes", "Voyageurs" and "Añadir fecha" */
  .filters form.dates-form{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) minmax(0,1fr) minmax(0,.8fr)}
  .filters form.dates-form .btn{grid-column:1/-1}
}

/* M4: short screens (the folded Duo, the iPhone SE, landscape) keep the home search above the fold */
@media(max-width:1023.98px) and (max-height:740px){
  .hero{padding-top:26px;padding-bottom:22px}
  .hero h1{font-size:clamp(34px,8.6vw,52px);margin:8px 0;max-width:16ch}
  .hero .sub{font-size:14.5px;line-height:1.5;margin-bottom:26px}   /* room for the finder's seal */
  .finder{padding-top:14px;padding-bottom:12px}
  .finder .lbl{margin-bottom:8px}
  .finder form{gap:8px}
  .dest-chips{margin-top:12px}
}
@media(max-width:1023.98px) and (max-height:500px){.hero h1{font-size:34px}.hero .sub{display:none}}   /* landscape phones */

/* M5: the iPhone Duo opened (600 to 719 px) gets two columns instead of a stretched phone column */
@media(min-width:600px) and (max-width:719.98px){
  .dgrid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .dcard.wide{grid-column:1/-1;aspect-ratio:2/1}
  .dcard h3{font-size:30px}
  .dc-in{padding:16px 16px 14px}
}

/* ---------- lane E: languages and the guides (articles, the lease page) ---------- */
/* the language switcher: desktop nav (EN ES FR), the phone menu and the footer (full names) */
.nav .langs{display:flex;align-items:center;gap:2px;margin-left:-6px}
.nav .langs a{font-size:12px;letter-spacing:.1em;color:var(--cream-dim);min-height:38px;padding:0 6px;display:inline-flex;align-items:center;transition:color .25s}
.nav .langs a:hover,.nav .langs a[aria-current]{color:var(--camel-300)}
.nav .langs a[aria-current]{text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px}
@media(max-width:899px){.nav .langs{display:none}}
.menu-panel .menu-langs{display:flex;flex-wrap:wrap;gap:4px 20px;padding-top:12px}
.menu-panel .menu-langs a{font-family:var(--body);font-size:14px;letter-spacing:.04em;color:var(--cream-dim);padding:8px 0;border-bottom:0}
.menu-panel .menu-langs a[aria-current]{color:var(--camel-300)}
.foot-base .foot-langs{display:flex;flex-wrap:wrap;gap:0 14px}
.foot-base .foot-langs a[aria-current]{color:var(--camel-300)}

/* articles and the lease page: the owners hero with one of our photos, then the text */
.art-hero{text-align:left;padding:46px 0 40px}
.art-hero .bg img{opacity:.38}
.art-hero h1{font-size:clamp(32px,6vw,52px);max-width:24ch;margin:12px 0 10px}
.art-hero .art-upd{margin:0;font-size:13.5px;color:var(--cream-dim);font-style:italic}
.art{font-size:16.5px;line-height:1.7;color:var(--ink);overflow-wrap:anywhere}
.art h2{font-size:clamp(26px,4.6vw,34px);color:var(--navy);margin:36px 0 12px;line-height:1.15}
.art h3{font-family:var(--body);font-size:17px;font-weight:600;color:var(--navy);margin:24px 0 8px}
.art p,.art ul,.art ol{margin:0 0 14px;max-width:70ch}
.art ul,.art ol{padding-left:22px}
.art li{margin-bottom:6px}
.art a{color:var(--gold-ink);text-decoration:underline;text-underline-offset:2px}
.art .tbl{overflow-x:auto;margin:0 0 18px;-webkit-overflow-scrolling:touch}
.art table{border-collapse:collapse;width:100%;min-width:480px;font-size:14.5px}
.art th,.art td{border:1px solid rgba(31,48,68,.2);padding:8px 10px;text-align:left;vertical-align:top}
.art th{background:var(--paper-2)}
.art .art-note{background:var(--card);border-left:3px solid var(--camel);padding:12px 16px;border-radius:0 4px 4px 0;font-size:14.5px;color:var(--ink-soft)}
.art .art-faq{margin:6px 0 20px}
.art .art-faq summary{font-size:21px}
.art .art-cards{margin:8px 0 24px}
.art .finder{margin:10px 0 26px;color:var(--ink)}
.art-read{max-width:820px;margin:34px auto 0;padding-top:18px;border-top:1px solid rgba(187,155,106,.5)}
.art-read h2{font-size:24px;color:var(--navy);margin-bottom:8px}
.art-read ul{list-style:none;display:grid;gap:4px}
.art-read a{color:var(--gold-ink);font-weight:600;text-decoration:underline;text-underline-offset:3px}

/* ---------- review round 3 (2026-11-03): phones and short screens; desktop (1024 px and wider) keeps its pixels ---------- */
/* the phone menu scrolls on short screens (sideways phones, the iPhone SE), and while it is open the stay page's bottom
   bar and the cookie bar step aside: they sat on its last links (site.js sets body.menu-open; :has() without script) */
.menu-panel{max-height:calc(100vh - 62px);max-height:calc(100dvh - 62px);overflow-y:auto;overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;padding-bottom:calc(22px + env(safe-area-inset-bottom))}
body.menu-open .mbar,body.menu-open #da-cc{display:none!important}
body:has(.menu[open]) .mbar{display:none!important}
/* sideways phones (390-440 px tall): the destination page's date filter scrolls away with the page instead of keeping
   a third of the screen under the nav */
@media(max-width:1023.98px) and (max-height:540px){.filters{position:static}}
/* one column (under 960 px): the stay card sits above the description but follows it in the page, so when the live
   price makes the card taller the browser's scroll anchoring kept the description still and moved the page (the date
   fields slid under the nav). The card's growth now pushes the description down instead. */
@media(max-width:959.98px){.p-main{overflow-anchor:none}}
/* desktop: the calendar's date boxes on the contact form and the stay card keep the height of the date inputs they
   replace (52.39 px in WebKit and Chromium), so nothing below them moves */
@media(min-width:1024px){.cform .dcal-field,.book-card .dcal-field{min-height:52.39px}}
/* a Spanish stay's tourism registration number, under the key facts (content/registrations.json) */
.prop .reg{margin:12px 0 0;font-size:13.5px;line-height:1.45;color:var(--ink-soft);overflow-wrap:anywhere}
.prop .reg b{font-weight:600;color:var(--ink);font-variant-numeric:lining-nums}

/* ---------- leftovers (2026-11-03): phones and tablets; desktop (1024 px and wider) keeps its pixels ---------- */
/* a stay's key facts on phones: four columns of 75-95 px cut their labels ("Salles de bain" ran into "Surface" at
   402 px, "Dormitorios" and "Bathrooms" left their columns at 360-414 px). A label now wraps at its spaces, with a
   little less tracking, and under 400 px it is a touch smaller; a one-line label sits where it sat (same block height) */
@media(max-width:719.98px){
  .keyfacts{column-gap:8px}
  .keyfacts span{display:block;white-space:normal;font-size:clamp(10px,2.75vw,11px);letter-spacing:.05em;line-height:1.3;padding:8px 0 4px}
}
/* the header is solid under 1024 px (it was 94 % opaque): the destination page's date filter and the cards scrolling
   under it showed through its lower half, sharp wherever the browser draws no blur, and read as overlapping it */
@media(max-width:1023.98px){.nav{background:var(--navy-950)}}