:root{
  --ivory:#FFF2E9; --peach:#F7D8BA; --sky:#9EB3AC; --sage:#B2B197; --forest:#2A5448;
  --deep:#1C3A31; --ink:#24483E; --muted:#41625A; --line:#e2d3c4;
  --serif:"Cormorant Garamond","Ivy Mode",Georgia,serif;
  --sans:Jost,"Cera Pro",system-ui,sans-serif;
  --gut:32px;
}
*{box-sizing:border-box;margin:0}
body{background:var(--ivory);color:var(--ink);font:300 19px/1.7 var(--sans)}
img{display:block;width:100%;height:100%;object-fit:cover}
a{color:inherit;text-underline-offset:4px;text-decoration-thickness:1px}
:focus-visible{outline:2px solid currentColor;outline-offset:3px}
.ph{position:relative;overflow:hidden;background:#e9ddd2}.ph>img{position:absolute;inset:0;filter:saturate(.8) contrast(.97) sepia(.06)}
.mask{display:block;background:currentColor;-webkit-mask:var(--m) center/contain no-repeat;mask:var(--m) center/contain no-repeat}
.wrap{max-width:1280px;margin:0 auto;padding-left:var(--gut);padding-right:var(--gut)}
.btn{display:inline-block;background:var(--forest);color:var(--ivory);text-decoration:none;font:400 16px/1 var(--sans);padding:18px 32px;border-radius:999px}
.btn:hover{background:var(--deep)}
.btn.small{padding:12px 20px;font-size:15px}

.gtop{display:flex;justify-content:space-between;align-items:center;padding:24px var(--gut);font-size:16px;border-bottom:1px solid var(--line)}
.wm{--m:url(img/wordmark.svg);width:260px;aspect-ratio:1306/150;color:var(--forest)}
.gtop nav{display:flex;gap:28px;align-items:center}
.gtop nav a:not(.btn){text-decoration:none}
.gtop nav a:not(.btn):hover{text-decoration:underline}

/* guide index */
.gindex-head{padding-top:110px;padding-bottom:64px;max-width:1280px}
.gindex-head h1{font:300 clamp(46px,6vw,88px)/1 var(--serif);max-width:10em}
.lede{font:300 clamp(22px,2vw,28px)/1.45 var(--serif);color:var(--ink);margin-top:24px;max-width:30em}
.gband{height:min(64svh,640px)}
.glist{list-style:none;padding:0;margin:96px 0 40px;border-top:1px solid var(--line)}
.glist li{border-bottom:1px solid var(--line)}
.glist a{display:grid;grid-template-columns:240px 1fr;gap:40px;align-items:center;padding:28px 0;text-decoration:none}
.glist .ph{aspect-ratio:3/2}
.glist .ph.blank{background:var(--deep)}
.glist b{display:block;font:400 clamp(26px,2.4vw,34px)/1.15 var(--serif)}
.glist a:hover b{text-decoration:underline;text-underline-offset:6px}
.glist .t>span{display:block;color:var(--muted);margin-top:8px;max-width:40em;font-size:17px}
.guests-row{padding:8px 0 120px;color:var(--muted)}

/* article */
.glayout{display:grid;grid-template-columns:220px minmax(0,1fr);gap:80px;padding-top:80px;padding-bottom:140px}
.gnav{position:sticky;top:32px;align-self:start;font-size:16px}
.gnav-home{font:400 24px var(--serif);text-decoration:none}
.gnav ol{list-style:none;padding:0;margin:18px 0 28px;border-top:1px solid var(--line)}
.gnav li{border-bottom:1px solid var(--line)}
.gnav li a{display:block;padding:10px 0;text-decoration:none;color:var(--muted)}
.gnav li a:hover,.gnav li a[aria-current]{color:var(--ink)}
.gnav li a[aria-current]{font-weight:400}
.gnav .guests{font-size:15px;color:var(--muted)}
.gart{max-width:760px}
.gart h1{font:300 clamp(42px,4.8vw,70px)/1.04 var(--serif);text-wrap:balance}
.ghero{aspect-ratio:3/2;margin:48px 0 56px}
.private-note{font-size:15px;color:var(--muted);border-left:2px solid var(--sage);padding-left:14px;margin-bottom:28px}
.prose{max-width:38em}
.prose>*+*{margin-top:1em}
.prose h2{font:300 clamp(32px,3vw,42px)/1.1 var(--serif);margin-top:2.2em}
.prose h3{font:400 clamp(24px,2vw,28px)/1.2 var(--serif);margin-top:1.8em}
.prose h3+p{margin-top:.4em}
.prose ul,.prose ol{padding-left:1.2em}
.prose li+li{margin-top:.35em}
.prose .meta{font-size:16px;color:var(--muted);margin-top:.4em}
.prose table{width:100%;border-collapse:collapse;font-size:17px;margin-top:1.4em}
.prose th{text-align:left;font-weight:400;color:var(--muted);font-size:15px;padding:0 16px 10px 0;border-bottom:1px solid var(--ink)}
.prose td{padding:12px 16px 12px 0;border-bottom:1px solid var(--line);vertical-align:top}
.prose td:last-child{white-space:nowrap}
.gcta{margin-top:72px}

footer{background:var(--forest);color:var(--ivory);padding:64px 0}
footer .wrap{display:flex;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;gap:32px;font-size:15px}
footer .badge{--m:url(img/badge.svg);width:92px;aspect-ratio:1006/1216;color:var(--peach)}
footer address{font-style:normal;color:#d6e0db}

@media (max-width:900px){
  :root{--gut:20px}
  body{font-size:17px}
  .wm{width:180px;flex-shrink:0}
  .gtop{padding:18px var(--gut)}
  .gtop nav a:not(.btn):not(.g):not([hreflang]){display:none}
  .gtop nav{gap:16px}
  .gindex-head{padding-top:64px;padding-bottom:40px}
  .glist{margin-top:56px}
  .glist a{grid-template-columns:96px 1fr;gap:18px;padding:20px 0;align-items:start}
  .glist .t>span{font-size:15px}
  .glayout{grid-template-columns:minmax(0,1fr);gap:0;padding-top:40px;padding-bottom:96px}
  .gnav{position:static;order:2;margin-top:72px}
  .ghero{margin:32px calc(-1 * var(--gut)) 40px}
  .prose td:last-child{white-space:normal}
}
.gtop .abbr{display:none}
@media (max-width:600px){
  .gtop nav a.g,.gtop .full{display:none}
  .gtop .abbr{display:inline;letter-spacing:.06em}
  .gtop{gap:12px}
  .gtop .wm{--m:url(img/lockup.svg);aspect-ratio:1206/500;width:128px;flex-shrink:0}
  .gtop nav{gap:14px}
  .gtop .btn{white-space:nowrap;padding:12px 18px;font-size:14px}
}
@media (max-width:340px){
  .gtop .wm{width:112px}
  .gtop nav{gap:10px}
  .gtop .btn{padding:11px 14px}
}
