:root{color-scheme:dark;--navy:#111F36;--green:#1B4D3E;--gold:#C9B037;--beige-gold:#D5C195;--ivory:#faf4e5}
*{box-sizing:border-box}
body{margin:0;min-height:100vh;display:flex;flex-direction:column;background:var(--navy);color:var(--ivory);font:16px/1.55 system-ui,sans-serif}
main{flex:1}a{color:var(--gold);text-underline-offset:4px}a:focus-visible{outline:2px solid var(--gold);outline-offset:4px}
.wrap{max-width:1240px;margin-inline:auto;padding-inline:clamp(20px,5vw,68px)}
.masthead{background:var(--navy);border-bottom:1px solid var(--gold)}
.header-inner{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:16px 32px;padding-block:18px}
.identity{display:flex;align-items:center;gap:15px}
.identity img{display:block;width:auto;height:clamp(112px,13vw,172px);object-fit:contain}
.name{display:block;color:var(--ivory);text-decoration:none;font:26px/1.1 Georgia,serif}
.credential{display:block;color:var(--beige-gold);font-size:12px;margin:5px 0}
.contact{display:flex;flex-wrap:wrap;gap:5px 13px;font-size:13px}
nav{display:flex;flex-wrap:wrap;gap:4px 9px}
nav a{color:var(--ivory);text-decoration:none;padding:6px 8px;border-bottom:1px solid transparent;font-size:28px}
nav a:hover,nav a[aria-current=page]{color:var(--gold);border-bottom-color:var(--gold)}
.hero{position:relative;isolation:isolate;overflow:hidden;padding-block:clamp(46px,8vw,106px);background:linear-gradient(112deg,var(--navy),var(--green) 72%);border-bottom:1px solid var(--gold)}
.hero::after{content:"";position:absolute;inset:-45% -14% -55% 62%;z-index:-1;transform:skewX(-24deg);opacity:.26;background:repeating-linear-gradient(90deg,transparent 0 27px,var(--gold) 27px 28px)}
h1,h2,h3,.rate{font-family:Georgia,serif;font-weight:400}
h1{margin:0 0 12px;font-size:clamp(43px,7vw,86px);line-height:1.02;letter-spacing:-.045em}
.hero p{margin:0;max-width:58ch}
.eyebrow,.sample{color:var(--gold);font-size:12px;letter-spacing:.09em;text-transform:uppercase}
.hero .eyebrow{display:block;margin-bottom:14px}
.section{padding-block:30px 55px}
.sample{margin:0 0 14px}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,245px),1fr));gap:16px}
.card,.empty{background:var(--green);border:1px solid var(--gold);border-top:2px solid var(--gold);padding:24px}
.card h3{font-size:25px;margin:7px 0}
.card p{margin:0 0 6px}
.rate{display:block;color:var(--gold);font-size:35px}
.about{display:grid;grid-template-columns:minmax(160px,270px) minmax(0,590px);align-items:start;gap:clamp(20px,5vw,58px)}
.about img{display:block;width:auto;max-width:100%;height:auto;max-height:500px;object-fit:contain}
.about h2{margin-top:0;font-size:32px}
.action{display:inline-block;margin-top:10px;padding:9px 15px;background:var(--gold);color:var(--navy);text-decoration:none}
footer{background:var(--navy);border-top:1px solid var(--gold);font-size:13px}
footer .wrap{display:flex;justify-content:space-between;gap:15px;padding-block:18px}
@media(max-width:600px){.header-inner{gap:12px}nav a{padding-inline:5px}.about{grid-template-columns:1fr}.about img{max-height:370px}}

.subcategories{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 20px}
.subcategories a,.subcategories button{padding:7px 13px;border:1px solid var(--gold);border-radius:2px;background:transparent;color:var(--gold);font:inherit;text-decoration:none;cursor:pointer}
.subcategories a:hover,.subcategories button:hover{border-color:var(--gold)}
.subcategories a[aria-current=page],.subcategories button[aria-pressed=true]{background:var(--gold);color:var(--navy);border-color:var(--gold)}
.subcategories button:focus-visible{outline:2px solid var(--gold);outline-offset:4px}

.region-filters{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  grid-template-rows:repeat(3,auto);
  grid-auto-flow:column;
  width:75%;
  gap:12px;
}
.region-filters button{
  min-height:68px;
  padding:12px 8px;
  font-size:clamp(20px,3vw,32px);
}

.listing-table-scroll{overflow-x:auto;border:1px solid var(--gold)}
.listing-table-scroll:focus-visible{outline:2px solid var(--gold);outline-offset:4px}
.listing-table{width:100%;min-width:580px;border-collapse:collapse;font-size:14px}
.listing-table th,.listing-table td{padding:9px 14px;text-align:left;vertical-align:middle}
.listing-table thead th{background:var(--green);color:var(--beige-gold);border-bottom:1px solid var(--gold)}
.listing-table tbody tr:nth-child(even){background:#ffffff08}
.listing-table tbody th,.listing-table tbody td{border-bottom:1px solid #ffffff1f}
.listing-table tbody th{font-weight:600}
.listing-table .listing-size{white-space:nowrap;font-variant-numeric:tabular-nums}

.listing-shortlist{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin-bottom:12px}
.listing-shortlist[hidden]{display:none}
.listing-shortlist button,#shortlist-draft button{font:inherit;padding:6px 12px;border:1px solid var(--gold);background:transparent;color:var(--beige-gold);cursor:pointer}
#shortlist-send{background:var(--gold);color:var(--navy);font-weight:600}
.listing-shortlist button:disabled{opacity:.55;cursor:default}
.listing-select{text-align:center!important;width:1%;white-space:nowrap}
.listing-select input{width:18px;height:18px;margin:0;vertical-align:middle;accent-color:var(--gold);cursor:pointer}
#shortlist-draft{background:var(--navy);color:var(--ivory);border:1px solid var(--gold);width:min(34rem,92vw);padding:20px}
#shortlist-draft::backdrop{background:#0009}
#shortlist-draft textarea{box-sizing:border-box;width:100%;font:inherit}
.shortlist-dialog-actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px}

.listing-reference{display:block;color:var(--beige-gold);font-size:11px;font-weight:500;letter-spacing:.05em}

.listing-sort{margin-bottom:12px}
.listing-sort label{color:var(--beige-gold);font-weight:600}
.listing-sort select{font:inherit;color:var(--ivory);background:var(--navy);border:1px solid var(--gold);padding:6px 9px}
.listing-sort small{display:block;margin-top:5px}

/* Align the portrait and contact block in the shared site header. */
.responsive-profile .header-profile {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  width: 100%;
}
.responsive-profile .profile-portrait img {
  display: block;
  width: auto;
  height: clamp(108px, 33vw, 152px);
}
.responsive-profile .header-inner nav { width: 100%; }

@media (min-width: 1024px) {
  .responsive-profile {
    --header-height: 118px;
    --hero-height: 254px;
    --profile-width: clamp(350px, 37vw, 434px);
  }
  .responsive-profile .masthead { position: relative; z-index: 1; }
  .responsive-profile .header-inner {
    position: relative;
    height: var(--header-height);
    justify-content: center;
  }
  .responsive-profile .header-inner nav {
    justify-content: center;
    align-content: center;
  }
  .responsive-profile .header-inner nav a { font-size: clamp(17px, 1.65vw, 22px); }
  .responsive-profile .header-profile {
    position: absolute;
    right: clamp(20px, 5vw, 68px);
    bottom: calc(-1 * var(--hero-height));
    width: var(--profile-width);
    gap: 22px;
    pointer-events: none;
  }
  .responsive-profile .header-profile a { pointer-events: auto; }
  .responsive-profile .profile-portrait img { height: 338px; }
  .responsive-profile .profile-details { transform: translateY(53px); }
  .responsive-profile .hero {
    height: var(--hero-height);
    display: grid;
    align-items: center;
    padding-block: 24px;
  }
  .responsive-profile .hero > .wrap {
    width: min(100%, 1240px);
    padding-right: calc(var(--profile-width) + clamp(20px, 5vw, 68px) + 24px);
  }
  .responsive-profile .hero h1 { font-size: clamp(44px, 5.4vw, 76px); }
}
@media (min-width: 1024px) {
  .responsive-profile .header-inner nav { padding-right: 168px; }
}
