:root{
  --mist:#f2f1f4;--paper:#fbfafc;--ink:#2e3240;--slate:#4a5163;--muted:#6b6f7d;
  --line:#dcd8e0;--mauve:#8c5670;--mauve-soft:#efe6ec;--sea:#5b7183;
  --serif:"Newsreader",Georgia,"Times New Roman",serif;
  --sans:"Figtree",system-ui,-apple-system,"Segoe UI",sans-serif;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--mist);color:var(--ink);font:17px/1.65 var(--sans)}
img{max-width:100%;display:block}
a{color:var(--mauve)}
a:focus-visible{outline:2px solid var(--mauve);outline-offset:3px}
.wrap{max-width:1080px;margin:0 auto;padding:0 20px}

.top{border-bottom:1px solid var(--line);background:var(--paper)}
.top .wrap{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding-top:16px;padding-bottom:14px}
.mark{font:500 1.45rem/1 var(--serif);letter-spacing:.02em;color:var(--ink);text-decoration:none}
.mark em{font-style:italic;color:var(--mauve)}
.where{font-size:.8rem;color:var(--muted);letter-spacing:.08em;text-transform:uppercase}

.notice{margin:28px 0 0;background:var(--paper);border:1px solid var(--line);border-left:4px solid var(--mauve);border-radius:6px;padding:20px 20px 18px}
.notice .tag{display:inline-block;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--mauve);font-weight:600;margin-bottom:6px}
.notice h1{font:500 1.9rem/1.2 var(--serif);margin:0 0 8px}
.notice p{margin:0;color:var(--slate)}
.notice .alt{margin-top:10px;font-size:.92rem;color:var(--muted)}
.notice .alt span{display:inline-block;white-space:nowrap;margin-right:14px}
.intro section{padding-top:0;padding-bottom:0}
.intro+section{border-top:1px solid var(--line);margin-top:28px}

.intro{display:grid;gap:28px;margin:32px 0 8px}
.intro figure{margin:0}
.photo{position:relative;border-radius:6px;overflow:hidden;background:#ddd}
.photo img{width:100%;height:100%;object-fit:cover}
.credit{font-size:.74rem;color:var(--muted);margin-top:6px}
.intro .photo{aspect-ratio:4/5}

h2{font:500 1.55rem/1.25 var(--serif);margin:0 0 12px}
section{padding:28px 0}
section+section{border-top:1px solid var(--line)}
.about p{margin:0 0 12px;color:var(--slate)}
.facts{list-style:none;margin:18px 0 0;padding:0;display:grid;gap:12px}
.facts li{background:var(--paper);border:1px solid var(--line);border-radius:6px;padding:12px 14px}
.facts b{display:block;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-weight:600;margin-bottom:2px}
.btn{display:inline-block;margin-top:6px;padding:10px 16px;border:1px solid var(--mauve);border-radius:999px;color:var(--mauve);text-decoration:none;font-weight:600;font-size:.92rem}
.btn:hover{background:var(--mauve-soft)}

.gallery{display:grid;gap:18px;grid-template-columns:1fr}
.gallery figure{margin:0}
.gallery .photo{aspect-ratio:6/5}
.gallery figcaption{font-size:.9rem;color:var(--slate);margin-top:8px}

.reviews{display:grid;gap:16px}
.lede{color:var(--muted);margin:-4px 0 16px;font-size:.95rem}
blockquote{margin:0;background:var(--paper);border:1px solid var(--line);border-radius:6px;padding:18px 18px 14px}
blockquote p{margin:0 0 10px;font:italic 400 1.12rem/1.55 var(--serif);color:var(--ink)}
blockquote footer{font-size:.86rem;color:var(--muted)}
.stars{color:var(--mauve);letter-spacing:.1em}

.foot{border-top:1px solid var(--line);background:var(--paper);margin-top:24px}
.foot .wrap{padding-top:22px;padding-bottom:28px;font-size:.8rem;color:var(--muted)}
.foot p{margin:0 0 8px}

@media (min-width:760px){
  .notice{padding:26px 30px 24px}
  .notice h1{font-size:2.4rem}
  .intro{grid-template-columns:1.15fr .85fr;align-items:start;gap:44px}
  .facts{grid-template-columns:1fr 1fr}
  .gallery{grid-template-columns:repeat(2,1fr)}
  .reviews{grid-template-columns:1fr 1fr}
  section{padding:40px 0}
}
