/* ===========================================================================
   DUOTONE - eroticmassagesamsterdam.com  (The Amsterdam Calendar)
   The photograph is the whole page. One gutterless mosaic of roster frames and
   copy cells, hairline ruled, every photograph printed in the same two inks: a
   blackcurrant shadow and a shell highlight. Type is condensed, uppercase and
   small, and lives in the negative space of the sheet. Carried over from the
   owner's chosen preview in docs/theme-picker/pool/duotone/.

   Two house rules are built into this file and must stay built into it:
     1. Nothing moves. No key frame block, no timed change of any property, no
        smooth scrolling. Hover changes a colour or a rule, at once.
     2. Nothing is drawn. No scene, object, building, vehicle or figure in CSS
        or SVG. The page is photographs, flat colour and type. The only marks
        are the two messenger glyphs on the buttons and a hairline arrow, which
        are inline in the templates.
   =========================================================================== */

/* --- Self-hosted faces (latin subset). The build rewrites this run from
       sites/<id>.json theme.fonts.faces; the blocks below are the same faces,
       so the file also stands up unbuilt. ------------------------------------ */
@font-face {
  font-family: 'Barlow Condensed';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/duotone/barlow-condensed-normal-400.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: 'Barlow Condensed';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/fonts/duotone/barlow-condensed-normal-500.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: 'Barlow Condensed';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/fonts/duotone/barlow-condensed-normal-600.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: 'Barlow Condensed';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/fonts/duotone/barlow-condensed-normal-700.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: 'Barlow';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/duotone/barlow-normal-400.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: 'Barlow';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/fonts/duotone/barlow-normal-500.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: 'Barlow';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/fonts/duotone/barlow-normal-700.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;
}

:root{
  /* the two inks ---------------------------------------------------------- */
  --sh:        #2A1548;
  --sh-2:      #361B5C;
  --sh-3:      #1E0F35;
  --hi:        #FFC7A2;
  --hi-deep:   #F0A97C;
  --hi-ink:    #3A2118;
  --hi-ink-2:  #6B3A1C;
  --soft:      #E4D8EC;
  --line:      rgba(255,199,162,0.28);
  --line-faint:rgba(255,199,162,0.16);

  /* aliases: the shared templates this theme inherits carry inline styles
     naming these tokens, so they have to resolve inside this palette instead
     of dropping out to black on black */
  --bg:        #2A1548;
  --bg-2:      #361B5C;
  --bg-3:      #1E0F35;
  --line-2:    rgba(255,199,162,0.46);
  --text:      #E4D8EC;
  --muted:     #E4D8EC;
  --dim:       rgba(228,216,236,0.82);
  --ink:       #FFFFFF;
  --faint:     #FFC7A2;
  --rule:      rgba(255,199,162,0.28);
  --hair:      rgba(255,199,162,0.16);
  --cloud:     #2A1548;
  --sky-1:     #2A1548;
  --sky-2:     #361B5C;
  --sky-3:     #1E0F35;
  --gold:      #FFC7A2;
  --white:     #FFFFFF;
  --white-rgb: 255,255,255;
  --header-bg: #1E0F35;
  --wa:        #25D366;
  --wa-dark:   #1ea857;

  /* type ------------------------------------------------------------------ */
  --disp:    'Barlow Condensed', 'Arial Narrow', Arial, sans-serif;
  --sans:    'Barlow', Helvetica, Arial, sans-serif;
  --serif:   'Barlow', Helvetica, Arial, sans-serif;
  --display: 'Barlow Condensed', 'Arial Narrow', Arial, sans-serif;
  --mono:    ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace;

  /* measure --------------------------------------------------------------- */
  --max:     1720px;
  --wide:    1720px;
  --reading: 72ch;
  --pad:     clamp(16px,2.2vw,30px);
  --cellpad: clamp(22px,2.6vw,36px);
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;background-color:#2A1548;background-color:var(--sh)}
html,body{overflow-x:hidden;max-width:100%}
@supports (overflow:clip){html,body{overflow-x:clip}}
body{
  background-color:#2A1548;
  background-color:var(--sh);
  color:var(--soft);
  font-family:var(--sans);
  font-size:17px;
  line-height:1.62;
  -webkit-font-smoothing:antialiased;
}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
li{list-style:none}
table{border-collapse:collapse;width:100%}
:focus-visible{outline:2px solid var(--hi);outline-offset:2px}
.no-save img{user-select:none;-webkit-user-drag:none}
.wrap-any{overflow-wrap:anywhere}

/* ------------------------------------------------------------------ type --- */
h1,h2,h3,h4,h5{font-family:var(--disp);font-weight:700;text-transform:uppercase;line-height:1.02;letter-spacing:.02em;color:var(--white)}
h1{font-size:clamp(1.9rem,4.4vw,3.6rem);line-height:.98}
h2{font-size:clamp(1.35rem,2.1vw,1.95rem)}
h3{font-size:clamp(1.1rem,1.5vw,1.4rem)}
h4{font-size:clamp(1rem,1.2vw,1.18rem)}
h5{font-size:.78rem;letter-spacing:.2em}
p{margin:0}
p + p{margin-top:13px}
strong,b{font-weight:700}
em{font-style:italic}
sup{font-size:.7em}

.eyebrow,.kicker,.label,.label-top,.lbl,.rates-card__title,.site-footer__h{
  font-family:var(--disp);font-weight:600;
  font-size:.75rem;letter-spacing:.24em;text-transform:uppercase;
  color:var(--hi);margin-bottom:14px;
}
.lede{font-size:clamp(1.02rem,1.3vw,1.2rem);line-height:1.5;color:var(--white);max-width:52ch}
.intro-line,.sub{max-width:58ch}
.legal,.date,.meta{font-size:.8rem;color:var(--soft)}

/* ---------------------------------------------------------- the two plates --- */
/* The photograph is reduced to one ink and laid over the ground, which supplies
   the other. Nothing here is drawn: it is a filter, a blend and a flat field. */
.ph{position:relative;isolation:isolate;background:var(--hi);overflow:hidden;display:block}
.ph img{
  position:relative;z-index:0;
  width:100%;height:100%;object-fit:cover;object-position:50% 22%;
  filter:grayscale(1) contrast(1.26) brightness(1.02);
  mix-blend-mode:multiply;
}
.ph::after{content:"";position:absolute;z-index:1;inset:0;background:var(--sh);mix-blend-mode:lighten;pointer-events:none}
a.ph:hover::after{background:var(--sh-2)}

.phtag{
  position:absolute;z-index:2;top:0;left:0;max-width:100%;
  padding:9px 12px 10px;
  background:rgba(30,15,53,.86);
  font-family:var(--disp);font-weight:600;font-size:.8125rem;line-height:1.25;
  letter-spacing:.11em;text-transform:uppercase;color:var(--white);
}
.phtag b{font-weight:700}
.phtag span{display:block;color:var(--hi);letter-spacing:.14em;font-weight:500}
a.ph:hover .phtag{color:var(--hi)}

/* --------------------------------------------------------- the opening sheet --- */
.sheet{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  grid-template-rows:1fr;
  height:clamp(560px,calc(100svh - 150px),880px);
}
.sheet .ph{grid-row:1}
.sheet .ph:nth-of-type(1){grid-column:1}
.sheet .ph:nth-of-type(2){grid-column:2}
.sheet .ph:nth-of-type(3){grid-column:3}
.sheet .ph:nth-of-type(4){grid-column:4}
.sheet .ph:nth-of-type(n+5){display:none}

.set{
  position:relative;z-index:3;grid-row:1;align-self:end;
  padding:76px var(--pad) var(--pad);
  background:linear-gradient(to top,var(--sh) 0,var(--sh) calc(100% - 76px),rgba(42,21,72,.55) calc(100% - 26px),rgba(42,21,72,0) 100%);
}
.set p{font-size:.9375rem;line-height:1.5;color:var(--white)}
.set-1{grid-column:1;display:flex;flex-direction:column;align-items:flex-start;gap:16px}
.set-2{grid-column:2 / span 2}
.set-2 .lede{max-width:64ch}
.set-4{grid-column:4}

.mark{order:2}
.mark h1{
  font-size:clamp(1.6rem,2.3vw,2.3rem);line-height:.96;letter-spacing:.005em;
}
.mark h1 em{display:block;font-style:normal;color:var(--hi)}
.mark .kicker{margin:8px 0 0;font-size:.78rem;letter-spacing:.2em;color:var(--hi)}
.bar{
  order:1;padding:7px 11px;border:1px solid var(--line);
  font-family:var(--disp);font-weight:600;font-size:.75rem;letter-spacing:.2em;
  text-transform:uppercase;color:var(--white);
}
.fig{
  font-family:var(--disp);font-weight:700;font-size:clamp(1.4rem,1.9vw,1.9rem);
  line-height:1;letter-spacing:.01em;color:var(--hi);text-transform:uppercase;margin-bottom:10px;
}
.set .btns{margin-top:14px}

/* --------------------------------------------------------------- the mosaic --- */
.grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  grid-auto-rows:minmax(0,auto);
  border-top:1px solid var(--line-faint);
}
.grid .ph{aspect-ratio:4/5}
.cell{
  padding:var(--cellpad);
  display:flex;flex-direction:column;justify-content:center;
  border-top:1px solid var(--line-faint);border-left:1px solid var(--line-faint);
  min-width:0;
}
.grid > .cell:first-child{border-top:0}
.cell.w2{grid-column:span 2}
.cell.w3{grid-column:span 3}
.cell.w4{grid-column:span 4}
.cell.h2{grid-row:span 2}
.cell.h2 h2{font-size:clamp(1.55rem,2.9vw,2.5rem);margin-bottom:18px}
.cell.plate{background:var(--hi);color:var(--hi-ink);border-color:rgba(42,21,72,.22)}
.cell.step{background:var(--sh-2)}
.cell h2{margin-bottom:12px}
.cell.plate h2{color:var(--hi-ink)}
.cell.plate .eyebrow,.cell.plate .kicker{color:var(--hi-ink-2)}
.cell p{font-size:.9375rem;line-height:1.6;max-width:48ch}
.cell p + p{margin-top:12px}
.cell.plate p{color:var(--hi-ink)}
.cell.w4 p{max-width:76ch}
.cell.open{justify-content:flex-end;padding-top:clamp(30px,3.8vw,58px);padding-bottom:clamp(26px,3.2vw,50px)}
.cell.open h1{margin-bottom:14px}
.cell.open .lede{max-width:62ch}
.cell.w4.open .lede{max-width:72ch}
.ph.w2{grid-column:span 2}

/* the shell plate flips every ink in the cell it holds */
.cell.plate h2,.cell.plate h3,.cell.plate .lede,.cell.plate .prose{color:var(--hi-ink)}
.cell.plate .techs li,.cell.plate .linklist a,.cell.plate .index__t,.cell.plate .spec dd,.cell.plate .faq summary{color:var(--hi-ink)}
.cell.plate .techs li,.cell.plate .linklist li,.cell.plate .index li,.cell.plate .spec > div,.cell.plate .faq details{border-bottom-color:rgba(42,21,72,.26)}
.cell.plate .spec dt,.cell.plate .index__m,.cell.plate .journal-item .date{color:var(--hi-ink-2)}
.cell.plate .index__d,.cell.plate .independence,.cell.plate small{color:var(--hi-ink)}
.cell.plate .areas li,.cell.plate .places li,.cell.plate .tags .tag,.cell.plate .linklist--inline li{color:var(--hi-ink);border-color:rgba(42,21,72,.4)}
.cell.plate .techs li:hover,.cell.plate .linklist a:hover,.cell.plate .faq summary:hover{color:var(--sh)}
.cell.plate .prose a:not(.btn),.cell.plate p a:not(.btn){color:var(--sh);border-bottom-color:rgba(42,21,72,.4)}
.cell.plate .prose a:not(.btn):hover,.cell.plate p a:not(.btn):hover{color:var(--hi-ink);border-bottom-color:var(--hi-ink)}
.cell.plate .ladder th,.cell.plate .rates-card__table caption{color:var(--hi-ink-2)}
.cell.plate .ladder td,.cell.plate .rates-card__table td{color:var(--hi-ink)}
.cell.plate .ladder th,.cell.plate .ladder td,.cell.plate .rates-card__table th,.cell.plate .rates-card__table td{border-bottom-color:rgba(42,21,72,.26)}

.cell a.ulink,.more a{
  font-family:var(--disp);font-weight:600;font-size:.8125rem;letter-spacing:.18em;
  text-transform:uppercase;color:var(--hi);border-bottom:1px solid var(--line);
  padding-bottom:3px;
}
.cell a.ulink:hover,.more a:hover{color:var(--white);border-bottom-color:var(--white)}
.more{margin-top:18px}
.cell.plate a.ulink,.cell.plate .more a{color:var(--hi-ink);border-bottom-color:rgba(42,21,72,.4)}
.cell.plate a.ulink:hover,.cell.plate .more a:hover{color:var(--sh);border-bottom-color:var(--sh)}

/* the lists the mosaic carries -------------------------------------------- */
.techs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px 18px;margin-top:4px}
.cell.w4 .techs{grid-template-columns:repeat(3,minmax(0,1fr))}
.techs li{
  font-family:var(--disp);font-weight:500;font-size:1.0625rem;letter-spacing:.05em;
  text-transform:uppercase;color:var(--white);padding:5px 0;border-bottom:1px solid var(--line-faint);
}
.techs a{display:block}
.techs li:hover{color:var(--hi)}

.rates{margin:2px 0 14px}
.rates li{
  display:flex;justify-content:space-between;align-items:baseline;gap:14px;
  padding:9px 0;border-bottom:1px solid var(--line-faint);
  font-family:var(--disp);font-weight:600;font-size:1.0625rem;letter-spacing:.09em;
  text-transform:uppercase;color:var(--white);
}
.rates b{font-weight:700;font-size:1.3rem;letter-spacing:.02em;color:var(--hi)}
.cell.plate .rates li{color:var(--hi-ink);border-bottom-color:rgba(42,21,72,.26)}
.cell.plate .rates b{color:var(--hi-ink)}

.areas,.places,.tags,.service-tags,.linklist--inline{display:flex;flex-wrap:wrap;gap:6px;margin-top:14px}
.areas li,.places li,.tag,.tags a,.service-tags span,.linklist--inline li{
  font-family:var(--disp);font-weight:500;font-size:.8125rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--white);border:1px solid var(--line);padding:5px 9px;
}
.linklist--inline a{display:block}
.areas li:hover,.places li:hover,.tag:hover,.linklist--inline li:hover{border-color:var(--hi);color:var(--hi)}
.cell.plate .tag{color:var(--hi-ink);border-color:rgba(42,21,72,.4)}

.linklist{display:grid;gap:0;margin-top:6px}
.linklist li{border-bottom:1px solid var(--line-faint)}
.linklist a{
  display:block;padding:10px 0;
  font-family:var(--disp);font-weight:500;font-size:1.0625rem;letter-spacing:.04em;
  text-transform:uppercase;color:var(--white);line-height:1.2;
}
.linklist a:hover{color:var(--hi)}
.linklist--inline{display:flex;margin-top:14px}
.linklist--inline li{border-bottom:1px solid var(--line)}

.index{display:grid;gap:0;margin-top:4px}
.index li{border-bottom:1px solid var(--line-faint)}
.index a{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1.2fr) auto;gap:6px 26px;align-items:baseline;padding:16px 0}
.index__t{font-family:var(--disp);font-weight:600;font-size:1.125rem;letter-spacing:.04em;text-transform:uppercase;color:var(--white);line-height:1.16}
.index__d{font-size:.9rem;color:var(--soft)}
.index__m{font-family:var(--disp);font-weight:500;font-size:.75rem;letter-spacing:.18em;text-transform:uppercase;color:var(--hi)}
.index a:hover .index__t{color:var(--hi)}
.journal-list{display:grid;gap:0;margin-top:4px}
.journal-item{border-bottom:1px solid var(--line-faint);padding:16px 0}
.journal-item .date{font-family:var(--disp);font-weight:500;font-size:.75rem;letter-spacing:.18em;text-transform:uppercase;color:var(--hi)}

/* ----------------------------------------------------------------- buttons --- */
.btns,.acts{display:flex;flex-wrap:wrap;gap:10px}
.acts{margin-top:20px}
.btn,.cta,.btn-primary,.btn-ghost,.btn--wa{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  padding:11px 16px;border:1px solid var(--hi);background:transparent;color:var(--hi);
  font-family:var(--disp);font-weight:700;font-size:.875rem;letter-spacing:.14em;
  text-transform:uppercase;line-height:1.2;cursor:pointer;
}
.btn svg,.cta svg{width:17px;height:17px;flex:none;fill:currentColor}
.btn-a,.btn--wa,.btn-primary,.cta{background:var(--hi);color:var(--sh);border-color:var(--hi)}
.btn-a:hover,.btn--wa:hover,.btn-primary:hover,.cta:hover{background:var(--hi-deep);border-color:var(--hi-deep);color:var(--sh)}
.btn-b,.btn-ghost{background:transparent;color:var(--hi);border-color:var(--hi)}
.btn-b:hover,.btn-ghost:hover,.btn:hover{background:var(--hi);color:var(--sh)}
.cell.plate .btn-a{background:var(--sh);color:var(--hi);border-color:var(--sh)}
.cell.plate .btn-a:hover{background:var(--sh-2);border-color:var(--sh-2)}
.cell.plate .btn-b{color:var(--hi-ink);border-color:var(--hi-ink)}
.cell.plate .btn-b:hover{background:var(--sh);color:var(--hi);border-color:var(--sh)}
.arr{font-family:var(--sans);font-weight:400;font-size:1em}

/* ------------------------------------------------------------- the 21+ bar --- */
.age-bar{
  display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center;justify-content:center;
  background:var(--sh-3);border-bottom:1px solid var(--line);
  padding:9px var(--pad);font-size:.85rem;color:var(--soft);
}
.age-bar__txt b{
  display:inline-block;font-family:var(--disp);font-weight:700;letter-spacing:.1em;
  color:var(--hi);margin-right:8px;
}
.age-bar__ok{
  background:transparent;border:1px solid var(--hi);color:var(--hi);
  font-family:var(--disp);font-weight:600;font-size:.78rem;letter-spacing:.14em;
  text-transform:uppercase;padding:6px 13px;cursor:pointer;
}
.age-bar__ok:hover{background:var(--hi);color:var(--sh)}
body.age-confirmed .age-bar{display:none}

/* ------------------------------------------------------------- the header --- */
.site-header{
  background:var(--sh-3);
  border-bottom:1px solid var(--line);
  padding:10px var(--pad);
  position:relative;z-index:40;
}
.site-header__in{
  max-width:var(--max);margin:0 auto;
  display:flex;flex-wrap:wrap;align-items:center;gap:8px 20px;
}
.logo{
  font-family:var(--disp);font-weight:700;text-transform:uppercase;
  font-size:clamp(.95rem,1.4vw,1.2rem);letter-spacing:.08em;line-height:1;
  color:var(--white);margin-right:auto;
}
.logo:hover{color:var(--hi)}
.site-header nav{display:flex;flex-wrap:wrap;gap:2px 16px;align-items:center}
.site-header nav a{
  font-family:var(--disp);font-weight:600;font-size:.78rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--soft);padding:4px 0;border-bottom:1px solid transparent;
}
.site-header nav a:hover{color:var(--hi);border-bottom-color:var(--hi)}
.site-header__cta{display:flex;gap:8px;align-items:center}
.site-header__cta .btn{padding:8px 13px;font-size:.78rem;letter-spacing:.12em}
.nav-toggle{
  display:none;background:transparent;border:1px solid var(--hi);color:var(--hi);
  font-family:var(--disp);font-weight:600;font-size:.78rem;letter-spacing:.16em;
  text-transform:uppercase;padding:7px 13px;cursor:pointer;
}
.nav-toggle:hover{background:var(--hi);color:var(--sh)}
.tagrail{
  max-width:var(--max);margin:0 auto;padding-top:6px;
  display:flex;flex-wrap:wrap;gap:2px 22px;
}
.tagrail span{font-family:var(--disp);font-weight:500;font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--hi)}

/* ------------------------------------- the shared templates, inside the sheet --- */
/* about, faq, contact, booking, terms, privacy, dmca, the age statement, the
   glossary, the booking terms and 404 all render the shared markup: a run of
   <section> wrappers holding .wrap / .container / .reading. They are dressed as
   full-width cells of the same mosaic. */
main > section:not(.grid):not(.sheet){
  width:100%;
  padding:clamp(34px,4.4vw,72px) var(--pad);
  border-top:1px solid var(--line-faint);
}
main > section:not(.grid):not(.sheet):nth-of-type(even){background:var(--sh-2)}
.container,.wrap,.inner{max-width:var(--max);margin:0 auto;width:100%}
.reading{max-width:var(--reading);margin:0;width:100%}
.reading h2,.reading h3,.prose h2,.prose h3{margin-top:34px;margin-bottom:10px}
.reading p,.prose p{margin-top:13px}
.reading ul,.reading ol,.prose ul,.prose ol{margin:13px 0 0 20px}
.reading li,.prose li{list-style:disc;margin-top:7px}
.reading ol li,.prose ol li{list-style:decimal}
/* :not(.btn) so a call to action sitting inside prose keeps its own ink: a
   shared template drops .btn-primary straight into .reading, and a bare
   ".reading a" colour rule would paint it shell on shell. */
.reading a:not(.btn):not(.cta),.prose a:not(.btn):not(.cta),.cell p a:not(.btn):not(.cta){color:var(--hi);border-bottom:1px solid var(--line)}
.reading a:not(.btn):not(.cta):hover,.prose a:not(.btn):not(.cta):hover,.cell p a:not(.btn):not(.cta):hover{color:var(--white);border-bottom-color:var(--white)}
/* and on the shell plate the same links flip back to the shadow ink. Declared
   after the run above because the two selectors weigh the same. */
.cell.plate p a:not(.btn):not(.cta),.cell.plate .prose a:not(.btn):not(.cta),
.cell.plate li a:not(.btn):not(.cta),.cell.plate a.ulink,.cell.plate .more a{
  color:var(--sh);border-bottom:1px solid rgba(42,21,72,.45);
}
.cell.plate p a:not(.btn):not(.cta):hover,.cell.plate .prose a:not(.btn):not(.cta):hover,
.cell.plate li a:not(.btn):not(.cta):hover,.cell.plate a.ulink:hover,.cell.plate .more a:hover{
  color:var(--hi-ink);border-bottom-color:var(--hi-ink);
}
.reading table,.prose table{margin-top:18px}
.hero,.hero-small,.intro{padding-top:clamp(28px,3.4vw,52px)}
.hero h1,.hero-small h1,.intro h1{max-width:26ch}
.hero .lede,.hero-small .lede,.intro .lede{margin-top:16px}

/* ------------------------------------------------------- two-column bodies --- */
.cols{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(0,1fr);gap:clamp(20px,3vw,52px);align-items:start}
.prose{max-width:72ch;font-size:1rem}
.facts{border-top:1px solid var(--line);padding-top:16px}
.spec{display:grid;gap:0}
.spec > div{display:flex;justify-content:space-between;gap:16px;padding:9px 0;border-bottom:1px solid var(--line-faint)}
.spec dt{font-family:var(--disp);font-weight:600;font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;color:var(--hi)}
.spec dd{font-weight:500;text-align:right;color:var(--white)}
.spec dd .tag{margin:2px 0 2px 5px;padding:4px 8px;font-size:.7rem;letter-spacing:.1em}
.independence{margin-top:20px;border-top:1px solid var(--line-faint);padding-top:14px;font-size:.9rem;color:var(--soft)}

/* ------------------------------------------------------------- photographs --- */
.gallery-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0}
.gallery-grid .ph{aspect-ratio:4/5}
.grid--people,.t-grid,.like-grid,.strip,.row8{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;
}
.person,.t-card,.like-card,.who{display:block;position:relative;min-width:0}
.person__img,.like-photo{display:block}
.person__img img,.t-card img,.like-photo img,.who img{
  width:100%;aspect-ratio:4/5;object-fit:cover;object-position:50% 22%;background:var(--hi);
  filter:grayscale(1) contrast(1.26) brightness(1.02);
}
.person__name,.t-card .nm,.like-name,.who b{
  display:block;font-family:var(--disp);font-weight:700;text-transform:uppercase;
  letter-spacing:.09em;font-size:.9375rem;line-height:1.2;color:var(--white);
  padding:9px 12px 0;
}
.person__meta,.t-card .meta,.like-meta,.who span{
  display:block;font-family:var(--disp);font-weight:500;font-size:.8125rem;
  letter-spacing:.14em;text-transform:uppercase;color:var(--hi);padding:0 12px 12px;
}
.person:hover .person__name,.t-card:hover .nm,.who:hover b{color:var(--hi)}

/* --------------------------------------------------------- technique cards --- */
.s-grid,.grid--cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0}
.card,.s-card{
  display:block;padding:var(--cellpad);
  border-top:1px solid var(--line-faint);border-left:1px solid var(--line-faint);
}
.card:hover,.s-card:hover{background:var(--sh-2)}
.card__num,.s-card .num{
  display:block;font-family:var(--disp);font-weight:600;font-size:.72rem;
  letter-spacing:.22em;text-transform:uppercase;color:var(--hi);
}
.card__name,.s-card .nm{
  display:block;font-family:var(--disp);font-weight:700;text-transform:uppercase;
  font-size:1.125rem;letter-spacing:.04em;line-height:1.1;margin-top:10px;color:var(--white);
}
.card__meta,.s-card .ds{display:block;margin-top:8px;font-size:.9rem;color:var(--soft)}

/* ----------------------------------------------------------------- ladders --- */
.ladder,.price-table,.stats-table,.rates-card__table{width:100%;margin-top:16px}
.ladder th,.ladder td,
.price-table td,.price-table th,
.stats-table td,.stats-table th,
.rates-card__table th,.rates-card__table td{
  text-align:left;padding:10px 12px 10px 0;
  border-bottom:1px solid var(--line-faint);font-size:1rem;
}
.ladder th,.price-table th,.stats-table th,.rates-card__table thead th{
  font-family:var(--disp);font-weight:600;font-size:.78rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--hi);
}
.ladder td,.price-table td:last-child,.rates-card__table td{
  font-family:var(--disp);font-weight:700;color:var(--white);letter-spacing:.04em;text-align:right;
}
.rates-card{margin-top:16px}
.rates-card__table caption{
  text-align:left;font-family:var(--disp);font-weight:600;font-size:.78rem;
  letter-spacing:.16em;text-transform:uppercase;padding:16px 0 4px;color:var(--hi);
}
.rates-card__cur{font-family:var(--sans);font-size:.72em;font-weight:500;margin-right:4px;color:var(--soft)}
.rates-card__sr{position:absolute;left:-9999px}
.rates-card__terms{margin-top:14px;font-size:.9rem}
.tariff-note{display:grid;gap:6px;margin-top:16px;font-size:.92rem;color:var(--soft)}

/* --------------------------------------------------------------- questions --- */
.faq{margin-top:4px;max-width:80ch}
.faq details{border-bottom:1px solid var(--line-faint)}
.faq summary{
  cursor:pointer;list-style:none;padding:15px 0;
  font-family:var(--disp);font-weight:600;font-size:1.0625rem;letter-spacing:.04em;
  text-transform:uppercase;line-height:1.2;color:var(--white);
}
.faq summary::-webkit-details-marker{display:none}
.faq summary:hover{color:var(--hi)}
.faq .a{padding:0 0 16px;max-width:66ch}
.faq .a p + p{margin-top:12px}

/* --------------------------------------------------- forms on /booking/ ----- */
.form-row{display:grid;gap:8px;margin-top:16px;max-width:var(--reading)}
.form-row label{font-family:var(--disp);font-weight:600;font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;color:var(--hi)}
.form-row select,.form-row input,.form-row textarea{
  width:100%;background:var(--sh-3);border:1px solid var(--line);
  color:var(--white);font-family:var(--sans);font-size:1rem;padding:11px 13px;
}
.form-row select:focus,.form-row input:focus,.form-row textarea:focus{border-color:var(--hi);outline:none}
.book-banner{border:1px solid var(--hi);padding:18px 20px;margin-top:20px}

/* ------------------------------------------- tabs (shared templates) -------- */
.tab-nav{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.tab-btn{
  background:transparent;border:1px solid var(--line);color:var(--white);
  font-family:var(--disp);font-weight:600;font-size:.8rem;letter-spacing:.14em;
  text-transform:uppercase;padding:8px 14px;cursor:pointer;
}
.tab-btn.active{background:var(--hi);border-color:var(--hi);color:var(--sh)}
.tab-panel{display:none;margin-top:16px}
.tab-panel.active{display:block}

/* ------------------------------------ breadcrumbs and the related block ----- */
main > .crumbs{
  max-width:var(--max);margin:0 auto;padding:14px var(--pad) 0;
  font-family:var(--disp);font-weight:500;font-size:.78rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--hi);
}
main > .crumbs ol{opacity:1;gap:4px 10px}
main > .crumbs li{gap:10px}
main > .crumbs li + li::before{content:"";width:12px;height:1px;background:var(--hi);opacity:.7;flex:0 0 auto}
main > .crumbs a{color:var(--soft)}
main > .crumbs a:hover{color:var(--hi);border-bottom-color:var(--hi)}
main > .crumbs [aria-current]{opacity:1;color:var(--white)}
main > .seo-related{
  max-width:none;margin:0;width:100%;
  padding:clamp(30px,3.8vw,56px) var(--pad);
  background:var(--sh-3);border-top:1px solid var(--line-faint);
}
main > .seo-related .seo-related__in{max-width:var(--max);margin:0 auto;border-top:0;padding-top:0}
main > .seo-related .seo-related__h{
  font-family:var(--disp);font-weight:600;font-size:.75rem;letter-spacing:.24em;
  text-transform:uppercase;color:var(--hi);opacity:1;margin-bottom:14px;
}
main > .seo-related ul{grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:0 28px}
main > .seo-related a{
  border-bottom:1px solid var(--line-faint);padding:10px 0;font-size:.95rem;color:var(--white);
}
main > .seo-related a:hover{color:var(--hi);opacity:1}

/* ------------------------------------------------------------------ foot ---- */
.foot{gap:16px}
.foot .row{display:flex;flex-wrap:wrap;gap:8px 32px;align-items:baseline}
.foot .lbl{margin-bottom:0}
.foot a.mail{color:var(--white);border-bottom:1px solid var(--line)}
.foot a.mail:hover{color:var(--hi);border-color:var(--hi)}
.foot small{font-size:.85rem;color:var(--soft);line-height:1.55;display:block;max-width:82ch}

.site-footer{
  background:var(--sh-3);border-top:1px solid var(--line);
  padding:clamp(28px,3.4vw,50px) var(--pad) clamp(24px,2.8vw,36px);
  color:var(--soft);font-size:.92rem;
}
.site-footer__in{
  max-width:var(--max);margin:0 auto;
  display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
  gap:clamp(20px,2.6vw,42px);
}
.site-footer__h{border-bottom:1px solid var(--line);padding-bottom:9px;margin-bottom:12px;color:var(--hi)}
.site-footer__col li{margin-top:7px}
.site-footer__col a{border-bottom:1px solid var(--line-faint)}
.site-footer__col a:hover{color:var(--hi);border-bottom-color:var(--hi)}
.site-footer__legal{
  max-width:var(--max);margin:clamp(20px,2.4vw,34px) auto 0;
  border-top:1px solid var(--line-faint);padding-top:15px;
  display:flex;flex-wrap:wrap;gap:8px 24px;align-items:center;
  font-family:var(--disp);font-weight:500;font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;
}
.age21{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:32px;padding:3px 8px;background:var(--hi);color:var(--sh);
  font-family:var(--disp);font-weight:700;font-size:.78rem;letter-spacing:.06em;
}

/* --------------------------------------------------------- the mobile dock --- */
.m-dock,.dock{display:none}
.m-dock svg{flex:none}

/* -------------------------------------------------------------- measures ----- */
@media (max-width:1180px){
  .set p{font-size:.9rem}
  .cols{grid-template-columns:1fr;gap:28px}
  .index a{grid-template-columns:minmax(0,1fr) auto;gap:5px 20px}
  .index__d{grid-column:1 / -1}
  .cell.w4 .techs{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:980px){
  .site-header__in{gap:8px 14px}
  .nav-toggle{display:inline-block;order:3}
  .site-header nav{display:none;width:100%;order:4;flex-direction:column;align-items:flex-start;gap:0;padding-top:6px}
  .site-header nav.open{display:flex}
  .site-header nav a{width:100%;padding:10px 0;border-bottom:1px solid var(--line-faint)}
  .site-header__cta{order:2}
}
@media (max-width:860px){
  .grid{grid-template-columns:repeat(2,1fr)}
  .cell.w2,.cell.w3,.cell.w4{grid-column:span 2}
  .cell.h2{grid-row:span 1}
  .gallery-grid,.grid--people,.t-grid,.like-grid,.strip,.row8,.s-grid,.grid--cards{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:760px){
  body{font-size:16px;padding-bottom:92px}
  /* the sheet becomes the mosaic itself: two frames, a copy cell, two frames,
     a copy cell, two frames, a copy cell. Nothing is hidden behind anything. */
  .sheet{
    grid-template-columns:repeat(2,1fr);
    grid-template-rows:auto auto auto auto auto auto;
    height:auto;min-height:0;max-height:none;
  }
  .sheet .ph{aspect-ratio:1/1}
  .sheet .ph:nth-of-type(n+5){display:block}
  .sheet .ph:nth-of-type(1){grid-area:1/1}
  .sheet .ph:nth-of-type(2){grid-area:1/2}
  .sheet .ph:nth-of-type(3){grid-area:3/1}
  .sheet .ph:nth-of-type(4){grid-area:3/2}
  .sheet .ph:nth-of-type(5){grid-area:5/1}
  .sheet .ph:nth-of-type(6){grid-area:5/2}
  .sheet .ph:nth-of-type(n+7){display:none}
  .set{background:var(--sh);padding:var(--cellpad);align-self:auto}
  .set-1{grid-area:2/1/auto/span 2}
  .set-2{grid-area:4/1/auto/span 2;background:var(--sh-2);border-top:1px solid var(--line-faint)}
  .set-4{grid-area:6/1/auto/span 2;border-top:1px solid var(--line-faint)}
  .set-2 .lede{max-width:none}
  .mark h1{font-size:1.85rem}
  .techs,.cell.w4 .techs{grid-template-columns:1fr}
  .index a{grid-template-columns:1fr;gap:4px;padding:14px 0}
  .cell p{max-width:none}
  .m-dock{
    display:grid;grid-template-columns:repeat(2,1fr);gap:10px;
    position:fixed;left:0;right:0;bottom:0;z-index:60;
    background:var(--sh-3);border-top:1px solid var(--line);
    padding:11px var(--pad) calc(11px + env(safe-area-inset-bottom));
  }
  .m-dock a{
    display:inline-flex;align-items:center;justify-content:center;gap:8px;
    padding:13px 8px;border:1px solid var(--hi);
    font-family:var(--disp);font-weight:700;font-size:.875rem;letter-spacing:.12em;text-transform:uppercase;
  }
  .m-dock__wa{background:var(--hi);color:var(--sh)}
  .m-dock__tg,.m-dock__alt{background:transparent;color:var(--hi)}
  .m-dock--one{grid-template-columns:1fr}
}
@media (max-width:480px){
  .gallery-grid,.grid--people,.t-grid,.like-grid,.strip,.row8{grid-template-columns:repeat(2,minmax(0,1fr))}
  .s-grid,.grid--cards{grid-template-columns:1fr}
}
@media (max-width:400px){
  .tag{font-size:.75rem;padding:7px 9px 8px}
  .btn,.cta,.btn-primary,.btn-ghost,.btn--wa{font-size:.8125rem;letter-spacing:.1em}
  .rates li{font-size:.9375rem}
  .rates b{font-size:1.2rem}
  .areas li,.places li,.tag,.linklist--inline li{padding:4px 8px;font-size:.75rem;letter-spacing:.1em}
}
@media print{
  .site-header,.m-dock,.age-bar,main > .seo-related{display:none}
  body{background:#fff;color:#111}
}

/* ---- injected by build: breadcrumbs + related pages ---- */
.crumbs{position:relative;z-index:3;max-width:var(--max,1200px);margin:0 auto;padding:14px clamp(18px,4vw,40px) 0;font-size:12.5px;line-height:1.5;letter-spacing:.02em}
.crumbs ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:4px 8px;opacity:.72}
.crumbs li{display:inline-flex;align-items:center;gap:8px;min-width:0}
.crumbs li+li::before{content:"/";opacity:.5}
.crumbs a{color:inherit;text-decoration:none;border-bottom:1px solid transparent}
.crumbs a:hover{border-bottom-color:currentColor}
.crumbs [aria-current]{opacity:.85;overflow-wrap:anywhere}
.seo-related{position:relative;z-index:3;max-width:var(--max,1200px);margin:0 auto;padding:clamp(28px,4vw,48px) clamp(18px,4vw,40px)}
.seo-related__in{border-top:1px solid rgba(128,128,128,.28);padding-top:22px}
.seo-related__h{margin:0 0 14px;font-size:12px;letter-spacing:.16em;text-transform:uppercase;opacity:.7}
.seo-related ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:10px 28px}
.seo-related a{color:inherit;text-decoration:none;display:block;padding:6px 0;border-bottom:1px solid rgba(128,128,128,.16);font-size:15px;line-height:1.4}
.seo-related a:hover{opacity:.75}
