/* ============ Staylax — design system ============
   White page, one accent, one typeface, generous space.
   Class names are unchanged from the previous system so every
   page inherits this without markup edits.
   ================================================== */
:root,[data-theme="light"]{
  /* Type scale — deliberately tighter than before. The old scale
     topped out at 7rem, which is what made pages feel shouty. */
  --text-xs:clamp(.75rem,.72rem + .12vw,.8125rem);
  --text-sm:clamp(.875rem,.85rem + .12vw,.9375rem);
  --text-base:clamp(1rem,.97rem + .15vw,1.0625rem);
  --text-lg:clamp(1.0625rem,1rem + .35vw,1.25rem);
  --text-xl:clamp(1.375rem,1.2rem + .8vw,1.75rem);
  --text-2xl:clamp(1.75rem,1.4rem + 1.6vw,2.5rem);
  --text-3xl:clamp(2.125rem,1.6rem + 2.2vw,3rem);
  --text-hero:clamp(2.125rem,1.6rem + 2.1vw,2.875rem);

  --space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-5:1.25rem;
  --space-6:1.5rem;--space-8:2rem;--space-10:2.5rem;--space-12:3rem;--space-16:4rem;
  --space-20:5rem;--space-24:6rem;--space-32:8rem;

  /* Surfaces — white page, near-white panels */
  --color-bg:#ffffff;
  --color-surface:#f8f7f4;
  --color-surface-2:#ffffff;
  --color-surface-offset:#f1efea;
  --color-divider:#e7e5df;
  --color-border:#d6d3cb;

  /* Text */
  --color-text:#1a1917;
  --color-text-muted:#6e6c66;
  --color-text-faint:#a3a09a;
  --color-text-inverse:#ffffff;

  /* Accent — the single colour. Lifted from the pool in the Staylax mark. */
  --color-primary:#12667a;
  --color-primary-hover:#0d4f60;
  --color-primary-active:#0a3d4a;
  --color-primary-soft:#e8f1f4;

  /* Legacy "gold" tokens are retargeted to pale accent tints.
     They survive only as *background* fills in a few inline styles;
     every text-colour use of them is overridden below. */
  --color-gold:#e4eef1;
  --color-gold-hover:#0d4f60;
  --color-gold-soft:#f2f7f9;
  --color-warning:#964219;

  --radius-sm:.25rem;--radius-md:.5rem;--radius-lg:.75rem;--radius-xl:1rem;--radius-full:9999px;
  --transition:180ms cubic-bezier(.2,.8,.3,1);
  /* Hairline borders do the work shadows used to. */
  --shadow-sm:none;
  --shadow-md:none;
  --shadow-lg:0 12px 32px -12px rgba(26,25,23,.14);
  --content-wide:1200px;--content-default:960px;--content-narrow:660px;

  --font-display:"General Sans","Helvetica Neue",Arial,sans-serif;
  --font-body:"General Sans","Helvetica Neue",Arial,sans-serif;
}
[data-theme="dark"]{
  --color-bg:#141413;
  --color-surface:#1c1b19;
  --color-surface-2:#201f1d;
  --color-surface-offset:#232220;
  --color-divider:#302f2c;
  --color-border:#3d3c39;
  --color-text:#eceae6;
  --color-text-muted:#9b9992;
  --color-text-faint:#6a6863;
  --color-text-inverse:#141413;
  --color-primary:#5aa3b5;
  --color-primary-hover:#7cbccb;
  --color-primary-active:#95cdd9;
  --color-primary-soft:#1b2c31;
  --color-gold:#1b2c31;
  --color-gold-hover:#7cbccb;
  --color-gold-soft:#16242a;
  --color-warning:#bb653b;
  --shadow-lg:0 12px 32px -12px rgba(0,0,0,.5);
}
@media (prefers-color-scheme:dark){:root:not([data-theme]){
  --color-bg:#141413;--color-surface:#1c1b19;--color-surface-2:#201f1d;--color-surface-offset:#232220;
  --color-divider:#302f2c;--color-border:#3d3c39;--color-text:#eceae6;--color-text-muted:#9b9992;
  --color-text-faint:#6a6863;--color-text-inverse:#141413;--color-primary:#5aa3b5;--color-primary-hover:#7cbccb;
  --color-primary-active:#95cdd9;--color-primary-soft:#1b2c31;
  --color-gold:#1b2c31;--color-gold-hover:#7cbccb;--color-gold-soft:#16242a;--color-warning:#bb653b;
  --shadow-lg:0 12px 32px -12px rgba(0,0,0,.5);
}}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;scroll-behavior:smooth;scroll-padding-top:6rem}
body{min-height:100dvh;line-height:1.62;font-family:var(--font-body,sans-serif);font-size:var(--text-base);color:var(--color-text);background:var(--color-bg)}
img,picture,video,svg{display:block;max-width:100%;height:auto}
ul[role=list]{list-style:none}
input,button,textarea,select{font:inherit;color:inherit}
h1,h2,h3,h4{text-wrap:balance;line-height:1.14;font-family:var(--font-display);font-weight:600;letter-spacing:-.022em}
p{text-wrap:pretty}
a{color:inherit;text-decoration:none}
button{cursor:pointer;background:none;border:none}
::selection{background:var(--color-primary-soft)}
:focus-visible{outline:2px solid var(--color-primary);outline-offset:3px;border-radius:var(--radius-sm)}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}
a,button,input,textarea,select,.card{transition:color var(--transition),background var(--transition),border-color var(--transition),box-shadow var(--transition)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* layout */
.wrap{max-width:var(--content-wide);margin-inline:auto;padding-inline:clamp(1.25rem,4vw,2.5rem)}
.section{padding-block:clamp(3.5rem,7.5vw,6.5rem)}
/* Eyebrows are labels, not decoration — muted grey, never accent. */
.eyebrow{display:block;font-family:var(--font-body);font-size:var(--text-xs);font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--color-text-muted)}

/* header */
.site-header{position:sticky;top:0;z-index:50;background:color-mix(in oklab,var(--color-bg) 92%,transparent);backdrop-filter:blur(10px);border-bottom:1px solid var(--color-divider)}
.nav{display:flex;align-items:center;justify-content:space-between;gap:var(--space-6);height:4.5rem}
/* Small logo, top left. Mark + lowercase wordmark (Option A). */
.brand{display:inline-flex;align-items:center;gap:.5rem;font-family:var(--font-display);font-weight:600;font-size:1.125rem;letter-spacing:-.025em;color:var(--color-text)}
.brand svg{flex:none;width:1.375rem;height:1.375rem}
.nav-links{display:flex;align-items:center;gap:var(--space-6)}
.nav-links a{font-size:var(--text-sm);font-weight:500;color:var(--color-text-muted)}
.nav-links a:hover{color:var(--color-text)}
.nav-actions{display:flex;align-items:center;gap:var(--space-3)}
.icon-btn{width:2.25rem;height:2.25rem;display:grid;place-items:center;border-radius:var(--radius-full);color:var(--color-text-muted);border:1px solid var(--color-divider)}
.icon-btn:hover{color:var(--color-text);border-color:var(--color-border)}
.btn{display:inline-flex;align-items:center;gap:.45rem;font-family:var(--font-body);font-size:var(--text-sm);font-weight:600;padding:.7rem 1.3rem;border-radius:var(--radius-full);border:1px solid transparent;letter-spacing:-.005em}
.btn-primary{background:var(--color-primary);color:#fff}
.btn-primary:hover{background:var(--color-primary-hover)}
.btn-ghost{border-color:var(--color-border);color:var(--color-text)}
.btn-ghost:hover{border-color:var(--color-text);background:var(--color-surface)}
/* Gold buttons are gone; this now reads as a quiet secondary. */
/* Ink button. In dark mode `--color-text` is light, so the label has to
   flip to the page colour or it disappears into the fill. */
.btn-gold{background:var(--color-text);color:var(--color-bg)}
.btn-gold:hover{background:#000;color:#fff}
[data-theme="dark"] .btn-gold:hover{background:#fff;color:var(--color-bg)}
.menu-toggle{display:none}

/* hero — white, photo-led, no tinted panel */
.hero{position:relative;background:var(--color-bg);overflow:hidden}
.hero .wrap{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(2rem,4.5vw,3.5rem);align-items:center;padding-top:clamp(2.5rem,5vw,4rem);padding-bottom:clamp(2rem,3.5vw,3rem)}
.hero-inner{position:relative;z-index:2;width:100%;color:var(--color-text);max-width:620px}
.hero h1{color:var(--color-text);font-size:var(--text-hero);line-height:1.1;letter-spacing:-.03em;max-width:26ch}
.hero .eyebrow{margin-bottom:var(--space-4)}
.hero .lede{margin-top:var(--space-5);max-width:50ch;font-size:var(--text-lg);color:var(--color-text-muted);line-height:1.55}
.hero-cta{margin-top:var(--space-8);display:flex;gap:var(--space-3);flex-wrap:wrap}
.hero-cta .btn-ghost{border-color:var(--color-border);color:var(--color-text)}
.hero-stats{display:grid;grid-template-columns:repeat(4,auto);gap:var(--space-6) var(--space-8);margin-top:var(--space-10);padding-top:var(--space-6);border-top:1px solid var(--color-divider);justify-content:start}
.hero-stat .n{font-family:var(--font-display);font-size:1.5rem;font-weight:600;color:var(--color-text);line-height:1;letter-spacing:-.02em}
.hero-stat .l{margin-top:.35rem;font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.08em;color:var(--color-text-muted)}
.hero-bg{position:relative;width:100%;aspect-ratio:4/3.2;border-radius:var(--radius-lg);overflow:hidden;background:var(--color-surface-offset)}
.hero-bg img{width:100%;height:100%;object-fit:cover;display:block}
.hero-bg::after,.hero-bg::before{display:none}
.hero-bg .photo-credit{position:absolute;left:.875rem;bottom:.875rem;background:rgba(20,19,18,.62);backdrop-filter:blur(8px);color:#fff;font-size:.6875rem;letter-spacing:.02em;padding:.35rem .7rem;border-radius:var(--radius-full);font-weight:500}
@media (max-width:860px){
  .hero .wrap{grid-template-columns:1fr;gap:2rem}
  .hero-bg{aspect-ratio:5/4;order:-1}
  .hero-stats{grid-template-columns:repeat(2,1fr);justify-content:stretch}
}

/* featured spotlight */
.featured-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-4)}
.feat{position:relative;border-radius:var(--radius-lg);overflow:hidden;display:flex;align-items:flex-end;color:#fff;aspect-ratio:5/4;background:var(--color-surface-offset)}
.feat img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.2,.8,.3,1)}
.feat::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(15,14,13,0) 38%,rgba(15,14,13,.5) 72%,rgba(15,14,13,.82) 100%)}
.feat:hover img{transform:scale(1.03)}
.feat .feat-in{position:relative;z-index:1;padding:var(--space-6);width:100%}
/* Was a gold pill; now a quiet glass chip. */
.feat-tag{display:inline-block;font-size:var(--text-xs);font-weight:600;letter-spacing:.01em;color:#fff;background:rgba(255,255,255,.16);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.22);padding:.3rem .7rem;border-radius:var(--radius-full);margin-bottom:var(--space-3)}
.feat h3{color:#fff;font-size:1.375rem;line-height:1.16;font-weight:600;letter-spacing:-.022em}
.feat-meta{display:flex;gap:.5rem;margin-top:var(--space-2);font-size:var(--text-sm);color:rgba(255,255,255,.82);flex-wrap:wrap}
.feat-loc{font-size:var(--text-xs);letter-spacing:.09em;text-transform:uppercase;color:rgba(255,255,255,.72);font-weight:600;margin-bottom:.4rem}
@media (max-width:900px){.featured-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.featured-grid{grid-template-columns:1fr}.feat{aspect-ratio:4/3}}

/* filter bar */
.filterbar{display:flex;flex-wrap:wrap;gap:var(--space-3);align-items:center;justify-content:space-between;margin-bottom:var(--space-8)}
.chips{display:flex;flex-wrap:wrap;gap:var(--space-2)}
.chip{font-size:var(--text-sm);font-weight:500;padding:.5rem 1rem;border-radius:var(--radius-full);border:1px solid var(--color-divider);color:var(--color-text-muted);background:var(--color-bg)}
.chip:hover{border-color:var(--color-text);color:var(--color-text)}
.chip[aria-pressed=true]{background:var(--color-text);color:#fff;border-color:var(--color-text)}
.count{font-size:var(--text-sm);color:var(--color-text-muted)}

/* property grid */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:var(--space-6)}
.card{display:flex;flex-direction:column;background:var(--color-bg);border:1px solid var(--color-divider);border-radius:var(--radius-lg);overflow:hidden}
.card:hover{border-color:var(--color-border)}
.card-media{position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--color-surface-offset)}
.card-media img{width:100%;height:100%;object-fit:cover;transition:transform 600ms cubic-bezier(.2,.8,.3,1)}
.card:hover .card-media img{transform:scale(1.03)}
.card-badge{position:absolute;top:var(--space-3);left:var(--space-3);background:rgba(255,255,255,.94);backdrop-filter:blur(6px);color:var(--color-text);font-size:var(--text-xs);font-weight:600;letter-spacing:.01em;padding:.3rem .65rem;border-radius:var(--radius-full)}
.card-body{padding:var(--space-5);display:flex;flex-direction:column;gap:var(--space-2);flex:1}
/* Was gold; locations are secondary information. */
.card-loc{font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.09em;color:var(--color-text-muted);font-weight:600}
.card-title{font-size:var(--text-lg);font-weight:600;letter-spacing:-.022em}
.card-specs{display:flex;flex-wrap:wrap;gap:var(--space-3);font-size:var(--text-sm);color:var(--color-text-muted);margin-top:auto;padding-top:var(--space-3)}
.card-specs span{display:inline-flex;align-items:center;gap:.35rem}
.card-foot{display:flex;align-items:center;justify-content:space-between;padding-top:var(--space-4);margin-top:var(--space-1);border-top:1px solid var(--color-divider)}
.card-price{font-family:var(--font-display);font-weight:600;letter-spacing:-.02em}
.card-price b{font-size:var(--text-lg)}
.card-price small{font-size:var(--text-xs);color:var(--color-text-muted);font-family:var(--font-body);font-weight:500}
.card-link{font-size:var(--text-sm);font-weight:600;color:var(--color-primary);display:inline-flex;align-items:center;gap:.3rem}
.card:hover .card-link{gap:.5rem}

/* map */
.map-wrap{position:relative;border-radius:var(--radius-lg);overflow:hidden;border:1px solid var(--color-divider)}
#map{height:clamp(360px,50vw,520px);width:100%;background:var(--color-surface-offset);z-index:0}
.leaflet-popup-content-wrapper{border-radius:var(--radius-md)!important;box-shadow:var(--shadow-lg)!important}
.map-pop{width:200px}
.map-pop img{width:100%;height:110px;object-fit:cover;border-radius:var(--radius-sm);margin-bottom:.5rem}
.map-pop .mp-loc{font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.08em;color:var(--color-text-muted);font-weight:600}
.map-pop h4{font-family:var(--font-display);font-size:.9375rem;margin:.15rem 0 .35rem;color:var(--color-text)}
.map-pop .mp-meta{font-size:.8125rem;color:var(--color-text-muted);margin-bottom:.5rem}
.map-pop a{display:inline-flex;align-items:center;gap:.3rem;font-size:.8125rem;font-weight:600;color:var(--color-primary)}
.leaflet-container{font-family:var(--font-body)!important}
.map-pin{background:var(--color-text);width:1.4rem;height:1.4rem;border-radius:50% 50% 50% 0;transform:rotate(-45deg);border:2px solid #fff;box-shadow:0 1px 4px rgba(0,0,0,.3);display:grid;place-items:center}
.map-pin.lt{background:#6e6c66}
/* Live homes are the accent; everything else is neutral. */
.map-pin.feat{background:var(--color-primary)}
.map-pin span{transform:rotate(45deg);color:#fff;font-size:.625rem;font-weight:700}

/* value props */
.values{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:var(--space-5)}
.value{padding:var(--space-6);background:var(--color-bg);border:1px solid var(--color-divider);border-radius:var(--radius-lg)}
.value:hover{border-color:var(--color-border)}
.value .ico{width:2.25rem;height:2.25rem;display:grid;place-items:center;border-radius:var(--radius-md);background:var(--color-primary-soft);color:var(--color-primary);margin-bottom:var(--space-4)}
.value h3{font-size:1.0625rem;font-weight:600}
.value p{margin-top:var(--space-2);font-size:.9375rem;color:var(--color-text-muted);line-height:1.58}

/* section heads */
.sec-head{max-width:var(--content-narrow);margin-bottom:var(--space-10)}
.sec-head .eyebrow{margin-bottom:var(--space-3)}
.sec-head h2{font-size:var(--text-2xl);line-height:1.14;letter-spacing:-.028em}
.sec-head p{margin-top:var(--space-4);color:var(--color-text-muted);font-size:var(--text-base);line-height:1.6;max-width:58ch}
.center{text-align:center;margin-inline:auto}

/* band — one dark block per page, ink not green */
.band{background:var(--color-text);color:#fff}
[data-theme="dark"] .band{background:var(--color-surface)}
.band .sec-head h2{color:#fff}
.band .eyebrow{color:rgba(255,255,255,.6)}
.band .value{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.13)}
.band .value p{color:rgba(255,255,255,.75)}
.band .value h3{color:#fff}
.band .value .ico{background:rgba(255,255,255,.11);color:#fff}

/* CTA — flat accent, no gradient */
.cta{position:relative;overflow:hidden;border-radius:var(--radius-xl);background:var(--color-primary);color:#fff;padding:clamp(2.5rem,6vw,4.5rem);text-align:center}
.cta h2{color:#fff;font-size:var(--text-2xl);max-width:24ch;margin-inline:auto}
.cta .eyebrow{color:rgba(255,255,255,.72);margin-bottom:var(--space-3)}
.cta p{margin-top:var(--space-4);color:rgba(255,255,255,.86);max-width:52ch;margin-inline:auto}
.cta .hero-cta{justify-content:center;margin-top:var(--space-8)}
.cta .btn-primary{background:#fff;color:var(--color-primary)}
.cta .btn-primary:hover{background:rgba(255,255,255,.9)}
.cta .btn-ghost{border-color:rgba(255,255,255,.45);color:#fff}
.cta .btn-ghost:hover{background:rgba(255,255,255,.12);border-color:#fff}

/* footer */
.site-footer{background:var(--color-bg);border-top:1px solid var(--color-divider);padding-block:var(--space-16) var(--space-8)}
.foot-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:var(--space-10)}
.foot-grid p{font-size:var(--text-sm);color:var(--color-text-muted);margin-top:var(--space-4);max-width:36ch;line-height:1.58}
.foot-col h4{font-family:var(--font-body);font-size:var(--text-xs);font-weight:600;text-transform:uppercase;letter-spacing:.1em;color:var(--color-text-faint);margin-bottom:var(--space-4)}
.foot-col a{display:block;font-size:var(--text-sm);color:var(--color-text-muted);padding-block:.3rem}
.foot-col a:hover{color:var(--color-text)}
/* `.foot-col a{display:block}` would otherwise stack the mark above the wordmark. */
.foot-col a.brand{display:inline-flex;font-size:1.125rem;color:var(--color-text);padding-block:0}
.foot-bottom{margin-top:var(--space-12);padding-top:var(--space-6);border-top:1px solid var(--color-divider);display:flex;justify-content:space-between;flex-wrap:wrap;gap:var(--space-3);font-size:var(--text-xs);color:var(--color-text-faint)}
/* Preview strip — was a dashed gold alert; now a quiet note. */
.preview-note{background:var(--color-surface);color:var(--color-text-muted);border-bottom:1px solid var(--color-divider);font-size:var(--text-xs);text-align:center;padding:.5rem 1rem;font-weight:500;letter-spacing:.01em}

/* ===== property detail ===== */
.pd-gallery{display:grid;grid-template-columns:2fr 1fr 1fr;grid-template-rows:1fr 1fr;gap:var(--space-2);height:clamp(320px,48vw,520px);border-radius:var(--radius-lg);overflow:hidden}
.pd-gallery button{padding:0;overflow:hidden;background:var(--color-surface-offset)}
.pd-gallery img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.pd-gallery button:hover img{transform:scale(1.03)}
.pd-gallery .g0{grid-row:1/3}
.pd-gallery .more{position:relative}
.pd-gallery .more::after{content:attr(data-more);position:absolute;inset:0;display:grid;place-items:center;background:rgba(15,14,13,.5);color:#fff;font-weight:600;font-size:var(--text-sm)}
.pd-head{display:flex;justify-content:space-between;gap:var(--space-8);flex-wrap:wrap;align-items:flex-start;margin-block:var(--space-8) var(--space-6)}
.pd-head h1{font-size:var(--text-2xl)}
/* Was gold. */
.pd-loc{color:var(--color-text-muted);font-weight:600;text-transform:uppercase;letter-spacing:.09em;font-size:var(--text-xs);margin-bottom:.4rem}
.pd-specs{display:flex;flex-wrap:wrap;gap:var(--space-5);padding-block:var(--space-5);border-block:1px solid var(--color-divider);margin-bottom:var(--space-8)}
.pd-spec{display:flex;align-items:center;gap:.5rem;font-size:var(--text-sm)}
.pd-spec svg{color:var(--color-text-muted)}
.pd-spec b{font-weight:600}
.pd-layout{display:grid;grid-template-columns:1fr 350px;gap:clamp(2.5rem,5vw,4rem);align-items:start}
.pd-body h2{font-size:var(--text-xl);margin-block:var(--space-8) var(--space-4)}
.pd-body h2:first-child{margin-top:0}
.pd-body p{color:var(--color-text-muted);white-space:pre-line;margin-bottom:var(--space-4);line-height:1.65}
.amen-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:var(--space-3)}
.amen{display:flex;align-items:center;gap:.6rem;font-size:var(--text-sm);color:var(--color-text)}
.amen svg{color:var(--color-text-faint);flex:none}
.amen-more{margin-top:var(--space-5)}
.pd-lede{color:var(--color-text)!important;font-size:1.05rem;line-height:1.6}
.pd-rooms{display:grid;grid-template-columns:repeat(auto-fill,minmax(215px,1fr));gap:var(--space-3);margin-bottom:var(--space-5)}
.pd-room{padding:var(--space-4);border:1px solid var(--color-divider);border-radius:var(--radius-md);background:var(--color-surface)}
.pd-room h4{font-size:var(--text-sm);margin-bottom:.3rem;line-height:1.3}
.pd-room span{display:block;font-size:var(--text-sm);color:var(--color-text-muted);line-height:1.55}
.pd-room em{display:block;font-style:normal;font-size:var(--text-xs);color:var(--color-text-faint);margin-top:.35rem}
.pd-list{list-style:none;display:grid;gap:.65rem;margin-bottom:var(--space-5)}
.pd-list li{position:relative;padding-left:1.1rem;color:var(--color-text-muted);font-size:var(--text-sm);line-height:1.6}
.pd-list li::before{content:"";position:absolute;left:0;top:.58rem;width:5px;height:5px;border-radius:var(--radius-full);background:var(--color-text-faint)}
.pd-list li b{color:var(--color-text);font-weight:600}
.pd-notes{padding:var(--space-5);border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface-offset)}
.pd-notes .pd-list{margin-bottom:0}
.amen-group{margin-bottom:var(--space-6)}
.amen-group:last-of-type{margin-bottom:0}
.amen-group h4{font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.09em;color:var(--color-text-muted);margin-bottom:var(--space-3);font-weight:600}
.book-card{position:sticky;top:5.75rem;background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-6)}
.book-price{font-family:var(--font-display);font-size:var(--text-xl);font-weight:600;letter-spacing:-.025em}
.book-price small{font-size:var(--text-sm);color:var(--color-text-muted);font-family:var(--font-body);font-weight:500;letter-spacing:0}
.book-card form{display:flex;flex-direction:column;gap:var(--space-3);margin-top:var(--space-5)}
.field{display:flex;flex-direction:column;gap:.35rem}
.field label{font-size:var(--text-xs);font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--color-text-muted)}
.field input,.field textarea,.field select{padding:.7rem .85rem;border-radius:var(--radius-md);border:1px solid var(--color-border);background:var(--color-bg)}
.field input:focus,.field textarea:focus,.field select:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-soft)}
.two{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-3)}
.book-note{font-size:var(--text-xs);color:var(--color-text-faint);text-align:center;margin-top:var(--space-3);line-height:1.5}
.back-link{display:inline-flex;align-items:center;gap:.4rem;font-size:var(--text-sm);font-weight:600;color:var(--color-text-muted);margin-top:var(--space-6)}
.back-link:hover{color:var(--color-text)}

/* lightbox */
.lb{position:fixed;inset:0;z-index:100;background:rgba(12,11,10,.95);display:none;place-items:center}
.lb.open{display:grid}
.lb img{max-width:92vw;max-height:84vh;object-fit:contain;border-radius:var(--radius-md)}
.lb-close,.lb-prev,.lb-next{position:absolute;color:#fff;width:2.75rem;height:2.75rem;display:grid;place-items:center;border-radius:var(--radius-full);background:rgba(255,255,255,.12)}
.lb-close:hover,.lb-prev:hover,.lb-next:hover{background:rgba(255,255,255,.24)}
.lb-close{top:1.25rem;right:1.25rem}
.lb-prev{left:1.25rem;top:50%;transform:translateY(-50%)}
.lb-next{right:1.25rem;top:50%;transform:translateY(-50%)}
.lb-count{position:absolute;bottom:1.5rem;left:50%;transform:translateX(-50%);color:#fff;font-size:var(--text-sm);background:rgba(255,255,255,.12);padding:.4rem 1rem;border-radius:var(--radius-full)}
.lb-cap{position:absolute;bottom:4.4rem;left:50%;transform:translateX(-50%);color:rgba(255,255,255,.82);font-size:var(--text-sm);line-height:1.5;text-align:center;max-width:min(58ch,84vw);text-wrap:balance;pointer-events:none;background:rgba(0,0,0,.5);padding:.45rem 1rem;border-radius:var(--radius-md);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.lb-cap:empty{display:none}

/* Reveal: always visible. Animation removed entirely — too fragile across pages. */
.reveal{opacity:1;transform:none}

@media (max-width:1040px){
  .foot-grid{grid-template-columns:1.4fr 1fr 1fr}
}
@media (max-width:900px){
  .pd-layout{grid-template-columns:1fr}
  .book-card{position:static}
  .foot-grid{grid-template-columns:1fr 1fr}
  .pd-gallery{grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr}
  .pd-gallery .g0{grid-row:auto;grid-column:1/3}
  .pd-gallery .hide-sm{display:none}
}
@media (max-width:680px){
  .nav-links{display:none}
  .menu-toggle{display:grid}
  .foot-grid{grid-template-columns:1fr;gap:var(--space-8)}
  .pd-gallery{height:auto;grid-template-columns:1fr;grid-template-rows:none}
  .pd-gallery .g0{grid-column:auto;aspect-ratio:4/3}
  .pd-gallery .hide-sm{display:none}
  .pd-gallery button:not(.g0):not(.show-sm){display:none}
  .values{grid-template-columns:1fr}
}

.map-pin.soon{opacity:.4;filter:grayscale(1)}

/* "Booking opens soon" strip on unreleased property pages */
.soon-banner{background:var(--color-primary-soft);color:var(--color-primary-hover);text-align:center;padding:.75rem 1.25rem;font-size:.9375rem;font-weight:500;line-height:1.5;border-bottom:1px solid var(--color-divider)}
.soon-banner a{color:var(--color-primary-hover);text-decoration:underline}
[data-theme="dark"] .soon-banner{color:var(--color-primary)}
/* Homepage owner CTA panel — collapses to one column on small screens. */
.owner-cta{display:grid;grid-template-columns:1fr auto;gap:var(--space-8);align-items:center;padding:clamp(1.75rem,4vw,2.5rem);border:1px solid var(--color-divider);border-radius:var(--radius-lg);background:var(--color-surface)}
.owner-cta h2{font-size:1.5rem;margin:.6rem 0 .5rem}
.owner-cta p{color:var(--color-text-muted);margin:0}
@media(max-width:720px){.owner-cta{grid-template-columns:1fr;gap:var(--space-6)}.owner-cta .btn{justify-self:start}}

/* ── Date-range picker ────────────────────────────────────────────────
   One field, one calendar. First click = check-in, second = check-out. */
.daterange{position:relative;display:flex;flex-direction:column;gap:.35rem}
.daterange>label{font-size:var(--text-xs);font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--color-text-muted)}
.dr-trigger{display:flex;align-items:center;gap:.6rem;width:100%;text-align:left;padding:.65rem .85rem;border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-bg);color:var(--color-text);font:inherit;cursor:pointer;transition:border-color .15s,box-shadow .15s}
.dr-trigger:hover{border-color:var(--color-text-faint)}
.dr-trigger:focus-visible,.daterange .dr-trigger[aria-expanded="true"]{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-soft)}
.dr-trigger svg{width:1.125rem;height:1.125rem;flex-shrink:0;color:var(--color-text-muted)}
.dr-text{display:flex;flex-direction:column;gap:.05rem;min-width:0}
.dr-range{font-size:var(--text-sm);font-weight:600;letter-spacing:-.005em}
.dr-nights,.dr-placeholder{font-size:var(--text-xs);color:var(--color-text-muted)}
.dr-placeholder{font-size:var(--text-sm);font-weight:500}
.daterange.has-error .dr-trigger{border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-soft)}

.dr-pop{position:absolute;z-index:60;top:calc(100% + .5rem);left:0;min-width:min(37rem,88vw);padding:1rem 1.1rem 0;background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:0 1px 2px rgba(20,20,19,.05),0 12px 32px -8px rgba(20,20,19,.18);opacity:0;transform:translateY(-4px);transition:opacity .14s ease,transform .14s ease}
.dr-pop.is-in{opacity:1;transform:none}
.dr-head{display:flex;align-items:center;justify-content:space-between;gap:.75rem;margin-bottom:.9rem}
.dr-hint{margin:0;font-size:var(--text-xs);font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--color-text-muted);text-align:center;flex:1}
.dr-nav{display:grid;place-items:center;width:2rem;height:2rem;border:1px solid var(--color-border);border-radius:var(--radius-full);background:var(--color-bg);color:var(--color-text);cursor:pointer;flex-shrink:0}
.dr-nav svg{width:1rem;height:1rem}
.dr-nav:hover:not(:disabled){border-color:var(--color-text)}
.dr-nav:disabled{opacity:.3;cursor:default}
.dr-months{display:grid;grid-template-columns:1fr;gap:1.75rem}
@media(min-width:700px){.dr-months{grid-template-columns:1fr 1fr}}
.dr-month-name{font-size:var(--text-sm);font-weight:600;text-align:center;margin-bottom:.65rem}
.dr-dow,.dr-grid{display:grid;grid-template-columns:repeat(7,1fr)}
.dr-dow span{font-size:.6875rem;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--color-text-faint);text-align:center;padding-bottom:.4rem}
.dr-grid{row-gap:2px}
.dr-day{position:relative;aspect-ratio:1;display:grid;place-items:center;border:0;background:none;font:inherit;font-size:var(--text-sm);font-variant-numeric:tabular-nums;color:var(--color-text);cursor:pointer;border-radius:var(--radius-full)}
.dr-day>span{position:relative;z-index:1}
.dr-day:hover:not(:disabled):not(.is-start):not(.is-end){background:var(--color-surface-offset)}
.dr-day:focus-visible{outline:2px solid var(--color-primary);outline-offset:-2px}
.dr-day.is-past{color:var(--color-text-faint);cursor:default;text-decoration:line-through;text-decoration-thickness:1px}
.dr-day.is-today:not(.is-start):not(.is-end){font-weight:700}
.dr-day.is-between{background:var(--color-primary-soft);border-radius:0}
.dr-day.is-start,.dr-day.is-end{color:#fff;font-weight:600}
.dr-day.is-start::before,.dr-day.is-end::before{content:"";position:absolute;inset:0;background:var(--color-primary);border-radius:var(--radius-full)}
/* Square off the inner edge so a selected range reads as one continuous bar. */
.dr-day.is-start:not(.is-end){background:linear-gradient(to right,transparent 50%,var(--color-primary-soft) 50%)}
.dr-day.is-end:not(.is-start){background:linear-gradient(to right,var(--color-primary-soft) 50%,transparent 50%)}
.dr-day.is-preview::before{opacity:.55}
.dr-pad{aspect-ratio:1}
.dr-foot{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-top:.5rem;padding:.75rem 0;border-top:1px solid var(--color-divider)}
.dr-clear{border:0;background:none;font:inherit;font-size:var(--text-sm);font-weight:500;color:var(--color-text-muted);text-decoration:underline;text-underline-offset:2px;cursor:pointer;padding:.3rem 0}
.dr-clear:hover{color:var(--color-text)}
.dr-done{border:0;background:var(--color-text);color:var(--color-bg);font:inherit;font-size:var(--text-sm);font-weight:600;padding:.5rem 1.1rem;border-radius:var(--radius-full);cursor:pointer}
.dr-done:hover{background:#000;color:#fff}
[data-theme="dark"] .dr-done:hover{background:#fff;color:var(--color-bg)}
/* On narrow screens the popover would overflow the card, so anchor it to
   the viewport and let it fill the width instead. */
@media(max-width:699px){
  .dr-pop{position:fixed;top:auto;bottom:0;left:0;right:0;min-width:0;width:100%;max-height:88vh;overflow-y:auto;border-radius:var(--radius-lg) var(--radius-lg) 0 0;border-bottom:0;padding:1rem 1.1rem 0;transform:translateY(12px)}
  .dr-pop.is-in{transform:none}
  .dr-foot{position:sticky;bottom:0;background:var(--color-bg);padding-bottom:1rem}
}
@media(prefers-reduced-motion:reduce){.dr-pop{transition:none}}

/* ── Multi-select checkbox grid (experience & amenity pickers) ── */
.checks{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:.5rem;margin-top:.15rem}
/* `.field label` is an uppercase caption style — reset it for these rows. */
.checks .check,.check{display:flex;align-items:center;gap:.6rem;margin:0;padding:.6rem .75rem;border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface-2);cursor:pointer;font-size:.9375rem;font-weight:450;line-height:1.35;letter-spacing:0;text-transform:none;color:var(--color-text);transition:border-color .15s,background .15s}
.checks .check:hover{border-color:var(--color-primary)}
.checks .check input{width:1rem;height:1rem;flex:none;margin:0;accent-color:var(--color-primary)}
.checks .check:has(input:checked){border-color:var(--color-primary);background:var(--color-primary-soft)}
.checks .check:focus-within{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-soft)}
.field-note{font-size:.85rem;color:var(--color-text-muted);margin:.55rem 0 0;line-height:1.5}
.fee-note{margin:.25rem 0 0;padding:.85rem 1rem;border-radius:var(--radius-md);background:var(--color-primary-soft);color:var(--color-primary-hover);font-size:.9rem;line-height:1.5}
[data-theme="dark"] .fee-note{color:var(--color-primary)}
.exp-group{margin-top:var(--space-8)}
.exp-group:first-of-type{margin-top:var(--space-6)}
.exp-group > h3{font-size:.8125rem;letter-spacing:.08em;text-transform:uppercase;color:var(--color-text-muted);font-weight:600;margin:0 0 var(--space-4);padding-bottom:.6rem;border-bottom:1px solid var(--color-divider)}
/* These forms carry .book-card themselves, so the inner-form rule misses them. */
form.book-card > .btn{width:100%;justify-content:center;margin-top:.35rem}
/* Grid items default to min-width:auto, so inputs with a wide intrinsic
   min-content size (type="time", type="number") blow past narrow screens. */
.two > *{min-width:0}
.field input,.field select,.field textarea{max-width:100%}
@media(max-width:560px){.two{grid-template-columns:1fr}}

/* Six numbered steps read as a clean 3x2 instead of a ragged 4+2. */
@media(min-width:900px){.values-3{grid-template-columns:repeat(3,1fr)}}

/* Cards rest as a scannable list of headlines and open the detail on hover or
   keyboard focus. Touch devices have no hover, so they stay open there. */
@media (min-width:700px){
  .can-hover .hoverdeck{align-items:start}
  .can-hover .hoverdeck .value{position:relative;transition:border-color .28s ease,box-shadow .28s ease}
  .can-hover .hoverdeck .value > p{
    max-height:0;opacity:0;margin-top:0;overflow:hidden;
    transition:max-height .42s cubic-bezier(.4,0,.2,1),opacity .26s ease,margin-top .42s cubic-bezier(.4,0,.2,1);
  }
  .can-hover .hoverdeck .value::after{
    content:"";position:absolute;top:1.6rem;right:1.5rem;width:8px;height:8px;
    border-right:1.5px solid var(--color-text-faint);border-bottom:1.5px solid var(--color-text-faint);
    transform:rotate(45deg);transition:transform .35s cubic-bezier(.4,0,.2,1),border-color .28s ease;
  }
  .can-hover .hoverdeck .value:hover,.can-hover .hoverdeck .value:focus-within{
    border-color:var(--color-primary);box-shadow:var(--shadow-lg);
  }
  .can-hover .hoverdeck .value:hover > p,.can-hover .hoverdeck .value:focus-within > p{
    max-height:26rem;opacity:1;margin-top:var(--space-2);
  }
  .can-hover .hoverdeck .value:hover::after,.can-hover .hoverdeck .value:focus-within::after{
    transform:rotate(225deg);border-color:var(--color-primary);
  }
  .can-hover .band .hoverdeck .value::after{border-color:rgba(255,255,255,.4)}
  .can-hover .hoverdeck .value h3{padding-right:1.75rem}
}
@media (prefers-reduced-motion:reduce){
  .hoverdeck .value > p,.hoverdeck .value::after{transition:none}
}

/* ── Experiences page top: photo band + category marks ─────────────────────
   A distinct top-of-page treatment. Not the shared .hero — this page leads
   with what is actually on offer instead of one property photo. */
.exp-top{position:relative;background:var(--color-bg);overflow:hidden;border-bottom:1px solid var(--color-divider);padding-bottom:clamp(2rem,4vw,3rem)}
.exp-top .wrap{padding-top:0;padding-bottom:0}
.exp-head{max-width:44rem;margin:0 auto;text-align:center}
.exp-head .eyebrow{display:block;margin-bottom:var(--space-3)}
.exp-head h1{font-size:var(--text-hero);line-height:1.08;letter-spacing:-.03em;color:var(--color-text)}
.exp-head .lede{margin:var(--space-5) auto 0;max-width:52ch;font-size:var(--text-lg);color:var(--color-text-muted);line-height:1.55}
.exp-top > .wrap:first-child{padding-top:clamp(2.5rem,5vw,4rem)}

.exp-band{position:relative;width:100vw;margin-left:calc(50% - 50vw);overflow:hidden;
  margin-top:clamp(1.75rem,3.5vw,2.75rem);
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 7%,#000 93%,transparent 100%);
          mask-image:linear-gradient(90deg,transparent 0,#000 7%,#000 93%,transparent 100%)}
.exp-track{display:flex;gap:.75rem;width:max-content;will-change:transform;animation:exp-marquee 78s linear infinite}
.exp-band:hover .exp-track,.exp-band:focus-within .exp-track{animation-play-state:paused}
@keyframes exp-marquee{from{transform:translate3d(0,0,0)}to{transform:translate3d(calc(-50% - .375rem),0,0)}}

.exp-shot{position:relative;flex:0 0 auto;margin:0;width:clamp(200px,21vw,308px);aspect-ratio:3/2;
  border-radius:var(--radius-md);overflow:hidden;background:var(--color-surface-offset)}
.exp-shot img{width:100%;height:100%;object-fit:cover;display:block}
.exp-shot figcaption{position:absolute;left:.625rem;bottom:.625rem;background:rgba(20,19,18,.62);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#fff;font-size:.6875rem;
  letter-spacing:.02em;padding:.3rem .625rem;border-radius:var(--radius-full);font-weight:500}

.exp-cats{display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem;margin-top:clamp(1.5rem,3vw,2.25rem)}
.exp-cat{display:inline-flex;align-items:center;gap:.5rem;padding:.5rem .9rem .5rem .7rem;
  border:1px solid var(--color-divider);border-radius:var(--radius-full);background:var(--color-bg);
  font-size:.8125rem;font-weight:500;color:var(--color-text);white-space:nowrap;
  transition:border-color .22s ease,background-color .22s ease}
.exp-cat svg{width:18px;height:18px;flex:0 0 auto;color:var(--color-primary)}
.exp-cat:hover,.exp-cat:focus-visible{border-color:var(--color-primary);background:var(--color-primary-soft)}
.exp-head-cta{margin-top:clamp(1.75rem,3.5vw,2.5rem)}
.exp-head-cta .hero-cta{justify-content:center;margin-top:0}

@media (max-width:760px){
  .exp-shot{width:clamp(168px,52vw,220px)}
  .exp-cat{font-size:.75rem;padding:.44rem .75rem .44rem .6rem}
  .exp-cat svg{width:16px;height:16px}
}
@media (prefers-reduced-motion:reduce){
  .exp-track{animation:none}
  .exp-band{overflow-x:auto;-webkit-overflow-scrolling:touch}
}

/* the Partner hero photo is a close crop, so it wants a taller frame */
.hero-bg-tall{aspect-ratio:4/3.4}
@media (max-width:900px){.hero-bg-tall{aspect-ratio:5/4}}

/* ── two-step booking request (request.html) ─────────────────────────────── */
.steps[hidden],.rq-grid[hidden],.rq-head[hidden],.rq-lines[hidden],.rq-pick[hidden],.rq-done[hidden],.rq-photo[hidden],.rq-change[hidden],.rq-form[hidden],.rq-block[hidden],.checks[hidden]{display:none}
.rq-wrap{max-width:60rem}
.steps{display:flex;align-items:center;gap:.75rem;list-style:none;padding:0;margin:0 0 1.75rem;
  flex-wrap:wrap;font-size:var(--text-xs);font-weight:600;letter-spacing:.05em;
  text-transform:uppercase;color:var(--color-text-faint)}
.steps li{display:flex;align-items:center;gap:.5rem}
.steps li+li::before{content:"";width:1.75rem;height:1px;background:var(--color-border);
  margin-right:.25rem}
.step-n{display:grid;place-items:center;width:1.5rem;height:1.5rem;border-radius:var(--radius-full);
  border:1px solid var(--color-border);font-size:.7rem;letter-spacing:0;flex:none}
.steps .step-done{color:var(--color-primary)}
.steps .step-done .step-n{background:var(--color-primary-soft);border-color:transparent;
  color:var(--color-primary)}
.steps .step-now{color:var(--color-text)}
.steps .step-now .step-n{background:var(--color-primary);border-color:transparent;
  color:var(--color-text-inverse)}
.rq-head{text-align:left;margin-bottom:2rem;max-width:38rem}
.rq-head h1{margin:.4rem 0 .75rem}

.rq-grid{display:grid;grid-template-columns:minmax(0,1fr) 21rem;gap:2.5rem;align-items:start}
.rq-form{display:flex;flex-direction:column;gap:1.5rem;min-width:0}
.rq-block{border:1px solid var(--color-divider);border-radius:var(--radius-xl);
  background:var(--color-surface);padding:1.5rem;margin:0;
  display:flex;flex-direction:column;gap:1rem}
.rq-block>legend{padding:0 .5rem;margin-left:-.25rem;font-size:var(--text-sm);font-weight:600;
  color:var(--color-text)}
.rq-block .field-note{margin:0}
.rq-block .two{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.rq-form .opt{font-weight:500;letter-spacing:0;text-transform:none;color:var(--color-text-faint)}
.rq-submit{justify-content:center;width:100%;font-size:var(--text-base);padding:.9rem 1.25rem}
.rq-form .book-note{margin:-.75rem 0 0}

.rq-aside{position:sticky;top:5.5rem}
.rq-card{border:1px solid var(--color-border);border-radius:var(--radius-xl);
  background:var(--color-bg);box-shadow:var(--shadow-md);overflow:hidden}
.rq-photo img{display:block;width:100%;aspect-ratio:16/10;object-fit:cover}
.rq-card-body{padding:1.35rem;display:flex;flex-direction:column;gap:1.1rem}
.rq-eyebrow{font-size:var(--text-xs);font-weight:600;letter-spacing:.06em;text-transform:uppercase;
  color:var(--color-text-faint)}
.rq-home h2{font-size:var(--text-lg);margin:.3rem 0 .15rem;line-height:1.25}
.rq-home p{margin:0;font-size:var(--text-sm);color:var(--color-text-muted)}
.rq-lines{margin:0;display:flex;flex-direction:column;gap:.6rem;
  padding-top:1.1rem;border-top:1px solid var(--color-divider)}
.rq-lines>div{display:flex;justify-content:space-between;align-items:baseline;gap:1rem}
.rq-lines dt{font-size:var(--text-sm);color:var(--color-text-muted)}
.rq-lines dd{margin:0;font-size:var(--text-sm);font-weight:600;text-align:right;
  font-variant-numeric:tabular-nums lining-nums}
.rq-change{font-size:var(--text-sm);font-weight:500;color:var(--color-primary);align-self:start}
.rq-pick{display:flex;flex-direction:column;gap:.9rem;padding-top:1.1rem;
  border-top:1px solid var(--color-divider)}
.rq-fine{margin:0;padding-top:1.1rem;border-top:1px solid var(--color-divider);
  font-size:var(--text-xs);line-height:1.55;color:var(--color-text-faint)}

.rq-done{max-width:34rem;margin:1rem auto 0;text-align:center;
  border:1px solid var(--color-divider);border-radius:var(--radius-xl);
  background:var(--color-surface);padding:2.5rem 1.75rem;
  display:flex;flex-direction:column;gap:.85rem;align-items:center}
.rq-tick{display:grid;place-items:center;width:3.25rem;height:3.25rem;
  border-radius:var(--radius-full);background:var(--color-primary-soft);color:var(--color-primary)}
.rq-done h2{margin:.25rem 0 0}
.rq-done p{margin:0;color:var(--color-text-muted);font-size:var(--text-sm)}
.rq-done .rq-fine{border-top:0;padding-top:.25rem}

@media (max-width:900px){
  .rq-grid{grid-template-columns:1fr;gap:1.75rem}
  .rq-aside{position:static;order:-1}
  .rq-photo{display:none}
}
@media (max-width:560px){
  .rq-block{padding:1.15rem}
  .rq-block .two{grid-template-columns:1fr}
}