/* Styles for the privacy and 404 pages (index.html carries its own copy). Built by make_site.py: do not edit by hand. */
@font-face{font-family:Figtree;font-style:normal;font-weight:400;font-display:swap;src:url(fonts/figtree-latin-400-normal.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}
@font-face{font-family:Figtree;font-style:normal;font-weight:400;font-display:swap;src:url(fonts/figtree-latin-ext-400-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:Figtree;font-style:normal;font-weight:600;font-display:swap;src:url(fonts/figtree-latin-600-normal.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}
@font-face{font-family:Figtree;font-style:normal;font-weight:600;font-display:swap;src:url(fonts/figtree-latin-ext-600-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:Figtree;font-style:normal;font-weight:700;font-display:swap;src:url(fonts/figtree-latin-700-normal.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}
@font-face{font-family:Figtree;font-style:normal;font-weight:700;font-display:swap;src:url(fonts/figtree-latin-ext-700-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:Fraunces;font-style:normal;font-weight:300;font-display:swap;src:url(fonts/fraunces-latin-300-normal.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}
@font-face{font-family:Fraunces;font-style:normal;font-weight:300;font-display:swap;src:url(fonts/fraunces-latin-ext-300-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:Fraunces;font-style:normal;font-weight:400;font-display:swap;src:url(fonts/fraunces-latin-400-normal.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}
@font-face{font-family:Fraunces;font-style:normal;font-weight:400;font-display:swap;src:url(fonts/fraunces-latin-ext-400-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
/* ===== palettes: four times of day (golden is the default) ===== */
:root{--far2:#8A6E80;--cv:#FFE6C4;--bm:#8C7282;--c1:#F8E8D2;--c2:#EFDEC7;--c3:#E6D6C0;--c4:#F3E1C8;--c5:#E0D8CD;
  --sd:rgba(92,48,56,.3);--gd:#74525A;--ax:#C4805E;--gw:#FFC27E;--s1:#6F7A5C;--s2:#8E5A46;--rl:rgba(255,222,196,.45);--sl:#FBE7D2;--so:#4B3F55;--tk:#F7E4CF;
  --a1:#B55238;--a2:#3F6B8A;--a3:#EAD5B6;--pv:#E7C6A8;--sw:#D2A98D;--sn:#EDCDAA;--sh:rgba(245,196,160,.07);
  --lm:#5B4347;--lp:#6B5055;--pl:#7A5A56;--ha:rgba(255,196,120,.9);--u0:#F7E3CD;--u1:#FBEBD8;--u2:#3F7EA6;--u3:#D9884C;--u4:#E6C58F;
  --cy:#42402F;--hs:#615539;--rd:#D8B79C;--ca:#C6A183;--cb:#96755F;--cc:#D9BC9B;--cd:#5A3F45;--fe:#F7E7D6;--fs:#3F6B8A;--lr:rgba(0,0,0,0);
  --tr:#5E4646;--fr:#3E3F36;--pp:#4A3438;
--ttree:#8C7470;--twall:#EBCFB6;--tshade:#B98E7A;--win:#7B5A58;--wref:#F2C9A0;--pine:#2B2830;--hull:#3A3036;--sail:#F6E3CE;--gull:#3A3036;
  
  --sky1:#2F4A6B;--sky2:#C98A7A;--sky3:#F2C18D;--sun:#FFE3B0;--glow:#FFB36B;--cloud:#F6B8A0;--far:#9A7F8C;
  --sea1:#C7937E;--sea2:#2E4A63;--sea3:#9C6E78;--glint:#FFE1B3;--mid:#9C8A67;--town:#F4DCC4;--roof:#C27A5A;--near:#3E3A40;--fore:#1F2328;
  --r1:#A08597;--r2:#7E6A7C;--r3:#5B4F5E;--r4:#433B46;--r4d:#2C2830;--bloom:#D2467E;--leaf:#2C3A2A;
  --hero-ink:#FFF7EE;--scrim-top:rgba(14,20,36,.42);--scrim-side:rgba(14,20,36,.6);--glass:rgba(255,255,255,.14);--glass-line:rgba(255,255,255,.4);
  --card:rgba(16,22,38,.36);--card-solid:rgba(16,22,38,.78);--card-line:rgba(255,255,255,.22);
  --paper:#F6F1EA;--paper2:#EEE6DA;--ink:#1B2528;--muted:#566164;--rule:#DCD2C4;--dark:#161C20;--dark-ink:#F3EEE6;
  --accent:#A8501B;--gut:clamp(1.25rem,5vw,4rem);
  color-scheme:light;
}
[data-light=morning]{--far2:#A5A3B8;--cv:#FFFFFF;--bm:#A9AAB8;--c1:#FBF9F5;--c2:#F1EFE9;--c3:#E8E3DB;--c4:#F5F2EA;--c5:#E2E7EB;
  --sd:rgba(70,72,105,.22);--gd:#6C7A8A;--gw:#6C7A8A;--ax:#D8AE96;--s1:#77877B;--s2:#9A6A52;--rl:rgba(180,200,220,.45);--sl:#FFFFFF;--so:#3F4B5F;--tk:#FFFFFF;
  --a1:#C3654A;--a2:#4F7FA2;--a3:#F0E4D2;--pv:#EEE5DA;--sw:#DDD1C4;--sn:#F0E6D6;--sh:rgba(150,212,216,.1);
  --lm:#4F5763;--lp:#5A6470;--pl:#8A7E74;--ha:rgba(255,220,160,0);--u0:#FFFFFF;--u1:#FFFFFF;--u2:#5A93BE;--u3:#E39A68;--u4:#E7D3A9;
  --cy:#454F3B;--hs:#6E7154;--rd:#DCD3C8;--ca:#CFC7BA;--cb:#A79D8E;--cc:#DED8CE;--cd:#6B6560;--fe:#FFFFFF;--fs:#3F6F9A;--lr:rgba(0,0,0,0);
  --tr:#6E625A;--fr:#50654B;--pp:#4A5260;
--ttree:#8C9478;--twall:#F4ECE3;--tshade:#CFC3B6;--win:#6E7C88;--wref:#FFFFFF;--pine:#3B4A3A;--hull:#3B4550;--sail:#FFFFFF;--gull:#4A5560;
  --sky1:#5E86AE;--sky2:#E3C3BC;--sky3:#F8E6D2;--sun:#FFF1D0;--glow:#FFD9A8;--cloud:#FFFFFF;--far:#B6B3C4;
  --sea1:#C9D6DD;--sea2:#4F7C99;--sea3:#8FBACB;--glint:#FFF4DE;--mid:#A39C82;--town:#FBF3EA;--roof:#CF9277;--near:#56604F;--fore:#2B3328;
  --r1:#B9B6C8;--r2:#98A0A6;--r3:#7A8A7E;--r4:#5F705F;--r4d:#3E4C3E;
  --hero-ink:#16222E;--scrim-top:rgba(255,250,244,.55);--scrim-side:rgba(255,250,244,.62);--glass:rgba(255,255,255,.5);--glass-line:rgba(22,34,46,.2);
  --card:rgba(255,250,244,.52);--card-solid:rgba(255,250,244,.9);--card-line:rgba(22,34,46,.14)}
[data-light=midday]{--far2:#8AA8B9;--cv:#FFFFFF;--bm:#8FA9A9;--c1:#FDFDFA;--c2:#F3F2ED;--c3:#EAE7DF;--c4:#F8F5ED;--c5:#E5E9EB;
  --sd:rgba(38,55,78,.28);--gd:#5F7890;--gw:#5F7890;--ax:#D0906C;--s1:#6E8474;--s2:#2F7C8C;--rl:rgba(160,205,225,.5);--sl:#FFFFFF;--so:#324560;--tk:#FFFFFF;
  --a1:#C9583A;--a2:#2D7DB0;--a3:#F2E7D4;--pv:#F0E9DD;--sw:#DAD1C1;--sn:#F2E9D7;--sh:rgba(80,222,214,.16);
  --lm:#3F4B58;--lp:#4A5866;--pl:#8C7C6A;--ha:rgba(255,220,160,0);--u0:#FFFFFF;--u1:#FFFFFF;--u2:#2E86C1;--u3:#EA8A4C;--u4:#EAD49F;
  --cy:#38472E;--hs:#5C6A3D;--rd:#E6DED1;--ca:#CBC4B4;--cb:#A39882;--cc:#DCD6CA;--cd:#5F5A52;--fe:#FFFFFF;--fs:#2F6FA6;--lr:rgba(0,0,0,0);
  --tr:#7A6A58;--fr:#4B7743;--pp:#3A4656;
--ttree:#6E7F4E;--twall:#FBFAF6;--tshade:#CFCBC2;--win:#587087;--wref:#FFFFFF;--pine:#2E4A2C;--hull:#2E3F4C;--sail:#FFFFFF;--gull:#3E5566;
  --sky1:#2F7DB5;--sky2:#8CC6E4;--sky3:#DDF0F4;--sun:#FFF6DA;--glow:#FFFFFF;--cloud:#FFFFFF;--far:#9DB8C8;
  --sea1:#5FB9C9;--sea2:#1D5F86;--sea3:#3FA8C0;--glint:#FFFFFF;--mid:#A3996E;--town:#FAFAF5;--roof:#D08A64;--near:#3F5B3A;--fore:#22331F;
  --r1:#9DB8C8;--r2:#86A796;--r3:#658A66;--r4:#4B704C;--r4d:#33502F;
  --hero-ink:#0F2233;--scrim-top:rgba(240,248,252,.6);--scrim-side:rgba(240,248,252,.66);--glass:rgba(255,255,255,.55);--glass-line:rgba(15,34,51,.2);
  --card:rgba(244,250,253,.55);--card-solid:rgba(244,250,253,.92);--card-line:rgba(15,34,51,.14)}
[data-light=dusk]{--far2:#40395A;--cv:#FFD48A;--bm:#383454;--c1:#5C5575;--c2:#575067;--c3:#60506A;--c4:#56506A;--c5:#4F5473;
  --sd:rgba(12,10,30,.34);--gd:#2D2944;--ax:#4E4260;--gw:#FFD07C;--s1:#3A3650;--s2:#3E3448;--rl:rgba(150,140,185,.22);--sl:#6F6789;--so:#24223A;--tk:#6F6789;
  --a1:#6B3F50;--a2:#35415F;--a3:#5F5772;--pv:#5A5270;--sw:#4B4562;--sn:#5F5572;--sh:rgba(0,0,0,0);
  --lm:#1E1C2E;--lp:#FFE3A6;--pl:#2A2740;--ha:rgba(255,196,110,.55);--u0:#6F6789;--u1:#6F6789;--u2:#3A4769;--u3:#6B4B5C;--u4:#645C72;
  --cy:#1F1C30;--hs:#2E2A44;--rd:#4E4866;--ca:#D8A97F;--cb:#A87C5E;--cc:#E4BE92;--cd:#4A3240;--fe:#6F6789;--fs:#2E3552;--lr:#FFD08A;
  --tr:#1C1A2C;--fr:#18182A;--pp:#15142A;
--ttree:#3E3858;--twall:#4E4764;--tshade:#3A3450;--win:#FFD27A;--wref:#FFC872;--pine:#17162A;--hull:#16162A;--sail:#CDB8C8;--gull:#0F1020;
  --sky1:#1B2340;--sky2:#5A4A78;--sky3:#E48B6A;--sun:#FFC98F;--glow:#FF8E5C;--cloud:#C77B78;--far:#4C4468;
  --sea1:#8E6A86;--sea2:#1A2440;--sea3:#4A4463;--glint:#FFC08A;--mid:#3A3550;--town:#FFD9A6;--roof:#7A5A60;--near:#2A2638;--fore:#12131C;
  --r1:#4C4468;--r2:#3D3857;--r3:#2F2B45;--r4:#242136;--r4d:#17152A;
  --hero-ink:#FFF3E6;--scrim-top:rgba(10,12,28,.42);--scrim-side:rgba(10,12,28,.5);
  --card:rgba(12,14,30,.4);--card-solid:rgba(12,14,30,.82);--card-line:rgba(255,255,255,.18)}

/* night: after sunset and before dawn in Sarandë. The dusk colours, cooled down; the moon instead of the sun. */
[data-night]{--sky1:#0D1430;--sky2:#1C2550;--sky3:#3A3F6E;--glow:#AEB9F0;--cloud:#40466F;--far:#2C3254;--far2:#262B4A;--bm:#272C4A;
  --sea1:#2E3562;--sea2:#0D142C;--sea3:#262C54;--glint:#C9D1F5;--mid:#262A44;--sun:#F1EBDD}
[data-night] .poster .glints,[data-night] .poster .gull{display:none}
[data-night] .poster .bloom{fill:#A2477A}

/* ===== the drawing ===== */
.poster{position:absolute;inset:0;width:100%;height:100%;display:block}
.poster .sun{fill:var(--sun)} .poster .cloud{fill:var(--cloud)} .poster .far{fill:var(--far)}
.poster .glints rect,.poster .spark{fill:var(--glint)} .poster .mid{fill:var(--mid)} .poster .town{fill:var(--town)}
.poster .roof{fill:var(--roof)} .poster .near{fill:var(--near)} .poster .fore{fill:var(--fore)}
.poster .r1{fill:var(--r1)} .poster .r2{fill:var(--r2)} .poster .r3{fill:var(--r3)} .poster .r4{fill:var(--r4)} .poster .r4d{fill:var(--r4d)}
.poster .bloom{fill:var(--bloom)} .poster .leaf{fill:var(--leaf)} .poster .grain{display:none}   /* no grain texture (Hysen's avoid list) */
.poster .moon{fill:#F1EBDD}
.poster .twall{fill:var(--twall)} .poster .tshade{fill:var(--tshade)} .poster .win{fill:var(--win)}
.poster .refl{opacity:.4} [data-light=dusk] .poster .refl{opacity:.8} .poster .wref{fill:var(--wref)}
.poster .pine{fill:var(--pine)} .poster .ttree{fill:var(--ttree)} .poster .hull{fill:var(--hull)} .poster .sail{fill:var(--sail)}
.poster .wake{fill:none;stroke:var(--glint);stroke-width:1.5;opacity:.6} .poster .gull{fill:none;stroke:var(--gull);stroke-width:1.6;stroke-linecap:round;opacity:.7}
.poster .far2{fill:var(--far2)} .poster .cv{fill:var(--cv)} .poster .bm{fill:var(--bm)}
.poster .c1{fill:var(--c1)} .poster .c2{fill:var(--c2)} .poster .c3{fill:var(--c3)} .poster .c4{fill:var(--c4)} .poster .c5{fill:var(--c5)} .poster .ax{fill:var(--ax)}
.poster .sd{fill:var(--sd)} .poster .gd{fill:var(--gd)} .poster .gw{fill:var(--gw)} .poster .s1{fill:var(--s1)} .poster .s2{fill:var(--s2)}
.poster .rl{fill:var(--rl)} .poster .sl{fill:var(--sl)} .poster .rf{fill:var(--roof)} .poster .so{fill:var(--so)} .poster .tk{fill:var(--tk)}
.poster .a1{fill:var(--a1)} .poster .a2{fill:var(--a2)} .poster .a3{fill:var(--a3)}
.poster .pv{fill:var(--pv)} .poster .sw{fill:var(--sw)} .poster .sn{fill:var(--sn)} .poster .sh{fill:var(--sh)}
.poster .lm{fill:var(--lm)} .poster .pp{fill:var(--pp)} .poster .lp{fill:var(--lp)} .poster .pl{fill:var(--pl)}
.poster .u0{fill:var(--u0)} .poster .u1{fill:var(--u1)} .poster .u2{fill:var(--u2)} .poster .u3{fill:var(--u3)} .poster .u4{fill:var(--u4)}
.poster .tt{fill:var(--ttree)} .poster .cy{fill:var(--cy)} .poster .hs{fill:var(--hs)}
.poster .rd{fill:none;stroke:var(--rd);stroke-width:1.3;stroke-linejoin:round;stroke-linecap:round}
.poster .ca{fill:var(--ca)} .poster .cb{fill:var(--cb)} .poster .cc{fill:var(--cc)} .poster .cd{fill:var(--cd)}
.poster .fe{fill:var(--fe)} .poster .fs{fill:var(--fs)} .poster .wr{fill:var(--wref)} .poster .lr{fill:var(--lr)}
.poster .halo{opacity:0} [data-light=dusk] .poster .halo{opacity:1}

/* ===== the page: whitewash and Ionian ink (October 2026 redesign) ===== */
:root{--paper:#F2F2EE;--paper2:#E6E8E3;--ink:#17282C;--muted:#53646A;--rule:#D2D8D4;
  --dark:#13232A;--dark-ink:#EEF1ED;--dark-muted:#A7B6B5;--night:#16172A;
  --sp:clamp(5.5rem,12vw,10rem)}

/* ===== base ===== */
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:5rem}
body{margin:0;background:var(--paper);color:var(--ink);font:400 1.0625rem/1.65 Figtree,"Segoe UI",system-ui,sans-serif;-webkit-font-smoothing:antialiased}
h1,h2,h3{font-family:Fraunces,Georgia,"Times New Roman",serif;font-weight:300;margin:0;letter-spacing:-.018em;text-wrap:balance}
h3{font-weight:400}
p{margin:0;text-wrap:pretty}
a{color:inherit}
:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
[hidden]{display:none!important}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.nw{white-space:nowrap}
.ico{width:1.2rem;height:1.2rem;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex:none}
.ico.fill{fill:currentColor;stroke:none}
.wrap{max-width:76rem;margin:0 auto;padding:0 var(--gut)}
.sample{margin:0;background:var(--dark);color:#DCE3E0;font-size:.8rem;line-height:1.4;text-align:center;padding:.5rem var(--gut)}
.warn{margin:0;background:#8A1B1B;color:#fff;font-weight:600;text-align:center;padding:.7rem var(--gut)}
/* buttons: square-cornered and flat, like the hotel sites studied on 3 Oct 2026 (Il Pellicano, Astra, Vassani) */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:3rem;padding:.8rem 1.6rem;border:0;border-radius:2px;
  background:var(--accent);color:#fff;text-decoration:none;font:600 1rem/1.1 Figtree,sans-serif;cursor:pointer}
.btn:hover{filter:brightness(.9)}
.textlink{display:inline-flex;align-items:center;min-height:2.75rem;font-weight:600;text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:1px}

/* ===== hero: phones and tablets = drawing on top, text band below ===== */
.hero{position:relative;isolation:isolate;background:var(--fore)}
.pw{position:relative;height:max(340px,62svh);overflow:hidden}
.pw::before{content:"";position:absolute;inset:0 0 auto 0;height:9rem;z-index:1;background:linear-gradient(180deg,var(--scrim-top),transparent);pointer-events:none}
.hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.nav{position:absolute;inset:0 0 auto 0;z-index:3;display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1.1rem var(--gut);color:var(--hero-ink)}
.brand{min-width:0;font-family:Fraunces,Georgia,serif;font-size:1.3rem;font-weight:400;letter-spacing:-.01em;text-decoration:none;line-height:1.15}
.glass{display:inline-flex;flex:none;align-items:center;min-height:2.75rem;padding:.6rem 1.1rem;border-radius:2px;text-decoration:none;font-weight:600;font-size:.95rem;
  border:1px solid currentColor}
.glass .s{display:none}
@media (max-width:599px){.glass .l{display:none}.glass .s{display:inline}}
@media (max-width:359px){.nav .glass{display:none}}   /* the smallest phones: no room beside the name */
.copy{position:relative;z-index:2;color:var(--dark-ink);padding:1.7rem var(--gut) 2.4rem}
.when{position:absolute;left:var(--gut);bottom:.9rem;z-index:2;margin:0;color:#F3EEE6;font-size:.84rem;font-weight:600;line-height:1.3;
  font-variant-numeric:tabular-nums;pointer-events:none}   /* a caption on the drawing, over the dark foreground in every light */
.copy h1{font-size:clamp(2.35rem,8.6vw,3.6rem);line-height:1.04;margin:0 0 1rem}
.lead{font-size:1.08rem;max-width:34rem;margin:0 0 1.6rem;opacity:.92}
.ctas{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem 1.5rem}
.strip{list-style:none;margin:1.9rem 0 0;padding:1.3rem 0 0;border-top:1px solid rgba(243,238,230,.16);display:flex;flex-wrap:wrap;gap:.6rem 1.6rem;
  color:var(--dark-ink);font-size:.93rem;font-weight:600}
.strip li{display:flex;align-items:center;gap:.5rem}

/* ===== hero: laptops = text on a frosted-glass card over the drawing ===== */
@media (min-width:1100px){
  .hero{min-height:max(640px,calc(100svh - 2.3rem),52vw);display:flex;flex-direction:column;background:none}
  .pw{position:absolute;inset:0;height:auto;z-index:-1}
  .copy{margin:auto auto auto var(--gut);width:min(38rem,42vw);padding:0;color:var(--hero-ink)}
  .pw::after{content:"";position:absolute;inset:0 auto 0 0;width:64%;z-index:1;pointer-events:none;
    background:linear-gradient(90deg,var(--scrim-side) 0%,var(--scrim-side) 45%,transparent 100%)}
  .when{bottom:1.4rem;left:auto;right:var(--gut)}   /* outside the shade, over the dark foreground */
  .copy h1{font-size:clamp(2.4rem,min(4.3vw,7.4vh),4.8rem);margin:0 0 1.1rem}
  .lead{font-size:clamp(1.05rem,1.25vw,1.18rem);opacity:1;max-width:32rem;margin-bottom:1.7rem}
  .strip{margin-top:1.8rem;padding-top:1.3rem;border-top:1px solid var(--card-line);color:var(--hero-ink)}
}
/* the one moment of motion: the light comes up on the drawing when the page opens */
@media (prefers-reduced-motion:no-preference){
  .poster{animation:lightup 1.8s cubic-bezier(.2,.65,.2,1) both}
}
@keyframes lightup{from{opacity:0;transform:scale(1.035)}to{opacity:1;transform:none}}

/* ===== slim bar on tablets and laptops, once the first screen has gone ===== */
.bar{display:none}
@media (min-width:760px){
  .bar{display:block;position:fixed;inset:0 0 auto 0;z-index:20;background:var(--paper);
    border-bottom:1px solid var(--rule);transform:translateY(-105%);transition:transform .35s ease;pointer-events:none}
  .bar.on{transform:none;pointer-events:auto}
  .bar-in{max-width:76rem;margin:0 auto;padding:.7rem var(--gut);display:flex;justify-content:space-between;align-items:center;gap:1rem}
  .bar .brand{font-size:1.25rem;color:var(--ink)}
  .bar .btn{min-height:2.6rem;padding:.6rem 1.25rem;font-size:.95rem}
}

/* ===== sections ===== */
.sec{padding-top:var(--sp)}
.sec h2{font-size:clamp(2.3rem,5.2vw,4.2rem);line-height:1.03;max-width:15ch}
.note{margin-top:1.4rem;color:var(--muted);max-width:30rem}
.note.small{font-size:.95rem;margin-top:2rem}
@media (min-width:900px){
  .split{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:2rem clamp(3rem,6vw,6rem);align-items:start}
  .split .sec-head{position:sticky;top:6.5rem}
}

/* welcome: the family, said once and large */
.welcome{padding-top:var(--sp)}
.statement{font-family:Fraunces,Georgia,serif;font-weight:300;font-size:clamp(1.75rem,3.9vw,3.15rem);line-height:1.2;letter-spacing:-.015em;max-width:29ch;text-wrap:pretty}
.welcome-more{margin-top:2rem;max-width:31rem;color:var(--muted);font-size:1.1rem;line-height:1.7}
.welcome-more p+p{margin-top:1rem}
@media (min-width:900px){.welcome .wrap{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);column-gap:clamp(3rem,6vw,6rem)}
  .statement{grid-column:1/-1}.welcome-more{grid-column:2;margin-top:3rem}}

/* rooms: a quiet list, each with its own way to ask */
.rooms{list-style:none;margin:2.6rem 0 0;padding:0}
@media (min-width:900px){.rooms{margin-top:.4rem}}
.room{padding:2rem 0 2.2rem;border-top:1px solid var(--rule)}
.room:last-child{border-bottom:1px solid var(--rule)}
.room h3{font-size:clamp(1.65rem,2.6vw,2.1rem);line-height:1.12;letter-spacing:-.015em}
.room p{margin-top:.7rem;color:var(--muted);max-width:34rem}
.room .room-facts{margin-top:.5rem;color:var(--ink);font-size:.95rem;font-weight:600}
.room .price{color:var(--ink);font-weight:700}
.ask{display:inline-flex;align-items:center;min-height:2.75rem;margin-top:.6rem;color:var(--accent);font-weight:600;text-decoration:none;
  border-bottom:1px solid currentColor;padding-bottom:1px;line-height:1.2}
.room .gallery{margin:0 0 1.4rem}
.shot{margin:0;aspect-ratio:4/3;overflow:hidden;background:var(--paper2)}
.shot img{width:100%;height:100%;object-fit:cover;display:block}
.photos{margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem}
.photos img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block;background:var(--paper2)}
.photos img:first-child{grid-column:1/-1}

/* the same view at four times of day, as prints */
.day{padding-top:var(--sp)}
.day-cap{font-size:clamp(1.55rem,2.8vw,2.3rem);line-height:1.15;max-width:22ch}
/* phones: a 2 x 2 grid, no sideways scrolling (Hysen's avoid list) */
.day-row{list-style:none;margin:1.8rem 0 0;padding:.4rem var(--gut) 1.4rem;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.4rem .9rem}
.day-row::-webkit-scrollbar{display:none}
.print{scroll-snap-align:start;margin:0}
.print img{display:block;width:100%;height:auto;aspect-ratio:4/5;background:#fff;padding:.45rem;border:1px solid rgba(23,40,44,.1)}
.print span{display:block;margin-top:.7rem;font-size:.92rem;font-weight:600;color:var(--muted)}
@media (min-width:900px){
  .day-row{grid-template-columns:repeat(4,minmax(0,1fr));max-width:76rem;margin:2.4rem auto 0;gap:clamp(1rem,2vw,1.8rem)}
  .print img{padding:.6rem}
}

/* what you get */
.facts{list-style:none;margin:2.6rem 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.1rem 1.6rem}
@media (min-width:900px){.facts{margin-top:.6rem;gap:1.3rem 2.4rem}}
.facts li{padding:.95rem 0 0;border-top:1px solid var(--rule);font-weight:600;line-height:1.35}

/* reviews: the rating is the headline, the guests' words carry it */
.reviews h2{max-width:20ch}
.quote-lead{margin:2.6rem 0 0}
.quote-lead blockquote,.quote blockquote{margin:0}
.quote-lead p{font-family:Fraunces,Georgia,serif;font-weight:300;font-size:clamp(1.6rem,3.3vw,2.7rem);line-height:1.25;letter-spacing:-.01em;max-width:30ch}
.quotes{display:grid;gap:2.2rem;margin-top:3rem}
@media (min-width:900px){
  .quote-lead{margin-left:clamp(0rem,8vw,8rem)}
  .quotes{grid-template-columns:repeat(2,minmax(0,1fr));gap:3rem;margin:4rem 0 0 clamp(0rem,8vw,8rem);max-width:56rem}
}
.quote{margin:0;padding-top:1.4rem;border-top:1px solid var(--rule)}
.quote p{font-family:Fraunces,Georgia,serif;font-weight:300;font-size:1.3rem;line-height:1.45;color:var(--ink)}
.quote-lead figcaption,.quote figcaption{margin-top:.9rem;color:var(--muted);font-size:.92rem;font-weight:600}
.more-reviews{display:inline-flex;margin-top:2.6rem}
@media (min-width:900px){.more-reviews{margin-left:clamp(0rem,8vw,8rem)}}
.ph{margin-top:2rem;border:1px solid var(--rule);padding:2rem;color:var(--muted)}

/* booking */
.book{background:var(--dark);color:var(--dark-ink);margin-top:var(--sp);padding:clamp(4.5rem,9vw,7.5rem) 0;color-scheme:dark}
.book h2{font-size:clamp(2.3rem,5.2vw,4.2rem);line-height:1.03}
.book-grid{display:grid;gap:3rem}
.book-grid>*{min-width:0}
@media (min-width:900px){.book-grid{grid-template-columns:1.1fr .9fr;align-items:start;gap:4rem}}
.book-intro{margin-top:1.1rem;color:var(--dark-muted);max-width:32rem;font-size:1.1rem}
.direct{margin-top:1.3rem;font-weight:600;color:var(--dark-ink)}
form{display:grid;gap:1.1rem;margin-top:2.2rem;max-width:34rem}
.row2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:1rem}
.row2.pick{grid-template-columns:5.5rem minmax(0,1fr)}
label{display:grid;gap:.45rem;font-weight:600;font-size:.92rem;min-width:0;color:#E2E8E5}
input,select{font:400 1rem/1.3 Figtree,sans-serif;color:var(--dark-ink);background:rgba(255,255,255,.05);border:0;border-bottom:1px solid rgba(238,241,237,.35);
  border-radius:0;padding:.75rem .8rem;width:100%;min-width:0;min-height:3.1rem;transition:border-color .2s ease,background .2s ease}
input:hover,select:hover{background:rgba(255,255,255,.08)}
input:focus,select:focus{border-bottom-color:var(--dark-ink)}
input[type=date]{-webkit-appearance:none;appearance:none}
input[type=date]::-webkit-date-and-time-value{text-align:left}
input[type=date]::-webkit-calendar-picker-indicator{filter:invert(1);opacity:.7}
select option{color:#111;background:#fff}
input:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
form .btn{justify-self:start;margin-top:.4rem}
.err{min-height:1.4em;color:#F2A27A;font-weight:600}
.reply{color:var(--dark-muted);font-size:.92rem}
.callalt{display:inline-flex;align-items:center;min-height:44px;font-weight:600}
.preview{width:100%;max-width:30rem}
.preview-head{font-weight:600;font-size:.92rem;color:#E2E8E5;margin-bottom:.6rem}
.msgbox{border:1px solid rgba(238,241,237,.28);background:rgba(255,255,255,.04);padding:1.1rem 1.25rem 1.2rem}
.bubble-text{white-space:pre-wrap;margin:0;font-size:.98rem;line-height:1.55;color:var(--dark-ink)}
.phone-cap{color:var(--dark-muted);font-size:.92rem;margin-top:.8rem;min-height:3em}
.msgbox.sent{border-color:var(--dark-ink)}

/* finding it */
.find-text{margin-top:1.3rem;color:var(--muted);max-width:30rem;font-size:1.1rem}
.dist{list-style:none;margin:2.4rem 0 0;padding:0;border-top:1px solid var(--rule)}
@media (min-width:900px){.dist{margin-top:.6rem}}
.dist li{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;padding:1.2rem 0;border-bottom:1px solid var(--rule)}
.dist b{font-family:Fraunces,Georgia,serif;font-weight:400;font-size:1.35rem;letter-spacing:-.01em}
.dist span{color:var(--muted);text-align:right}
.maps{margin-top:1.8rem;display:inline-flex;align-items:center;gap:.5rem;min-height:3rem;padding:.75rem 1.4rem;border-radius:2px;border:1px solid var(--ink);text-decoration:none;font-weight:600}
.arrival{margin-top:.8rem;color:var(--muted)}

/* footer: the town at dusk, then the facts */
.foot{background:var(--night);color:#C9CCD8;margin-top:var(--sp);font-size:.98rem}
.foot-art{display:block;width:100%;height:clamp(220px,34vw,520px);object-fit:cover;object-position:72% 50%;
  -webkit-mask-image:linear-gradient(180deg,#000 62%,transparent);mask-image:linear-gradient(180deg,#000 62%,transparent)}
.foot-in{padding-top:2.6rem;padding-bottom:3.4rem;display:grid;gap:1.4rem}
@media (min-width:900px){.foot-in{grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:2rem clamp(3rem,6vw,6rem);padding-top:3.4rem;padding-bottom:4.4rem}}
.foot .brand{color:#F1F0F5;font-size:clamp(1.8rem,3vw,2.4rem);font-weight:300;display:block}
.foot-lines p+p{margin-top:.35rem}
.foot-lines a{text-decoration:none;border-bottom:1px solid rgba(201,204,216,.4)}
#footNote{margin-top:1.2rem;color:#9A9DB0;font-size:.9rem}

.dock{position:fixed;left:0;right:0;bottom:0;z-index:10;border-radius:0;min-height:3.4rem;padding-bottom:calc(.8rem + env(safe-area-inset-bottom));
  transition:transform .25s ease,opacity .25s ease}
.dock.hide{transform:translateY(110%);opacity:0;pointer-events:none}
@media (min-width:760px){.dock{display:none}}
@media (max-width:759px){.foot-in{padding-bottom:calc(3.4rem + 5rem)}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}
noscript .ns{display:block;padding:1.5rem var(--gut);background:var(--paper2)}

/* ===== two languages (October 2026): the Shqip / English button ===== */
.nav-r{display:flex;align-items:center;gap:.2rem .55rem;flex:none}
.lang{display:inline-flex;align-items:center;min-height:2.75rem;padding:0 .3rem;font-weight:600;font-size:.95rem;text-decoration:none}
@media (max-width:599px){.nav{gap:.6rem}}
.nav .lang{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.3em}
@media (max-width:359px){.nav .lang{padding:0 .2rem}}
.foot-links{display:flex;flex-wrap:wrap;gap:.4rem 1.6rem;margin-top:.9rem!important}
.foot-links a{display:inline-flex;align-items:center;min-height:2.75rem}
.book-online{margin-top:1.8rem}
.or-ask{margin-top:1.8rem;color:var(--dark-muted);font-weight:600}
.or-ask+form{margin-top:1rem}

/* ===== the small pages: privacy and "page not found" ===== */
.legal{max-width:44rem;margin:0 auto;padding:clamp(1.6rem,5vw,3rem) var(--gut) clamp(4rem,10vw,7rem)}
.legal-top{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:clamp(3rem,9vw,5.5rem)}
.legal-top .brand{color:var(--ink)}
.legal-top a:not(.brand){display:inline-flex;align-items:center;min-height:2.75rem;font-weight:600;text-underline-offset:.3em}
.legal h1{font-size:clamp(2.4rem,7vw,3.8rem);line-height:1.04;margin-bottom:1.4rem}
.legal h2{font-size:clamp(1.5rem,3.4vw,1.9rem);line-height:1.15;margin:2.6rem 0 .8rem}
.legal p+p{margin-top:1rem}
.legal ul{margin:1rem 0 0;padding-left:1.15rem}
.legal li+li{margin-top:.7rem}
.legal .muted{color:var(--muted)}
.legal .btn{margin-top:2rem}
.legal section+section{margin-top:clamp(3.5rem,9vw,5rem);padding-top:clamp(2.5rem,6vw,3.5rem);border-top:1px solid var(--rule)}

/* keyboard users: the first Tab shows a link that jumps past the drawing to the content */
.skip{position:absolute;left:1rem;top:-5rem;z-index:50;padding:.75rem 1.1rem;background:var(--ink);color:#fff;font-weight:600;text-decoration:none}
.skip:focus{top:1rem}

:root{--paper:#E2F1EB;--paper2:#D6E9E2;--rule:#C4D4CE;--dark:#132720}   /* this client's page colours, from its accent */