/* Ananda Stays · Option B "Magazine" — cream pages, dark sections; extends styles.css + theme.css */
.stays-b{--paper:#f1eee6;--paper2:#e9e5da;--dk:#0b0c0a;--dmute:#5d5b54;--dline:rgba(11,12,10,.16);background:var(--paper);color:var(--dk)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.stays-b section{scroll-margin-top:4.5rem}
.stays-b .top{background:var(--bg);color:var(--ink);padding-top:max(1rem,env(safe-area-inset-top));padding-bottom:1rem;border-bottom:1px solid rgba(241,238,230,.08)}
.stays-b main{padding-top:4.4rem}
.stays-b .kicker{font-family:var(--sans);font-weight:600;font-size:.66rem;letter-spacing:.18em;text-transform:uppercase;color:var(--dmute)}
.stays-b h2 em,.stays-b h1 em,.stays-b h3 em{font-style:italic}
.mast{padding:clamp(2.2rem,7vh,4.5rem) var(--pad) clamp(2rem,5vh,3rem);text-align:center}
.mast-row{display:flex;justify-content:space-between;gap:1rem;font-size:.64rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;border-top:1px solid var(--dk);border-bottom:1px solid var(--dline);padding:.75rem 0}
.mast-row .dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--dk);margin-right:.5rem;vertical-align:1px;box-shadow:0 0 0 3px rgba(196,244,52,.9)}
.mast h1{font-family:var(--serif);font-weight:400;font-size:clamp(4.2rem,19vw,13.5rem);line-height:.86;letter-spacing:-.03em;margin:clamp(1.6rem,5vh,3rem) auto clamp(1.2rem,3vh,2rem);max-width:none}
.mast-sub{font-family:var(--serif);font-size:clamp(1.25rem,3.6vw,1.75rem);line-height:1.3;max-width:34rem;margin:0 auto;color:#2a2925}
.mast-tags{display:flex;flex-wrap:wrap;justify-content:center;gap:.4rem 1.4rem;margin-top:1.6rem;font-size:.66rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--dmute)}
.cover{padding:0 var(--pad) clamp(4rem,10vh,6rem)}
.cover-media{margin:0}
.cover-media img{width:100%;height:auto;aspect-ratio:4/4.6;object-fit:cover;object-position:38% 50%}
.cover-text{padding-top:1.6rem;max-width:40rem}
.cover-text h2,.stays-b .list-head h2,.method h2{font-family:var(--serif);font-weight:400;font-size:clamp(2.6rem,8.5vw,5rem);line-height:1;letter-spacing:-.01em;margin:.8rem 0 1rem;text-wrap:balance}
.dek{font-family:var(--serif);font-size:clamp(1.2rem,3.4vw,1.5rem);line-height:1.35;color:#2a2925;margin-bottom:1.6rem}
.rule-link{display:inline-block;font-size:.72rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:.3rem}
.contents{border-top:1px solid var(--dline);display:grid;gap:3rem}
.lede{font-family:var(--serif);font-size:clamp(1.55rem,4.6vw,2.2rem);line-height:1.25;margin:1rem 0 1.4rem}
.lede::first-letter{float:left;font-size:4.1em;line-height:.8;padding:.06em .1em 0 0;font-weight:400}
.stays-b .body{color:var(--dmute);max-width:34rem}
.sample-note{margin-top:1.6rem;padding:.9rem 1rem;border-left:3px solid var(--dk);background:var(--paper2);font-size:.82rem;line-height:1.5;color:#3b3a35;max-width:34rem}
.toc ol{list-style:none;padding:0;margin-top:1rem;border-top:1px solid var(--dk)}
.toc li{border-bottom:1px solid var(--dline)}
.toc a{display:grid;grid-template-columns:2.4rem 1fr auto;align-items:baseline;gap:.8rem;padding:1.05rem 0;text-decoration:none;transition:padding .3s}
.toc a:hover{padding-left:.4rem}
.toc span{font-size:.72rem;font-weight:600;letter-spacing:.1em;color:var(--dmute)}
.toc b{font-family:var(--serif);font-weight:400;font-size:clamp(1.35rem,4vw,1.7rem);line-height:1.15}
.toc em{font-style:normal;font-size:.66rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--dmute);white-space:nowrap}
.dark{background:var(--bg);color:var(--ink)}
.dark .kicker{color:var(--mute)}
.ways h2{font-family:var(--serif);font-weight:400;font-size:clamp(2.5rem,8vw,4.8rem);line-height:1.02;margin:1rem 0 clamp(2.5rem,6vh,4rem);max-width:15em;text-wrap:balance}
.ways h2 em{color:var(--lime)}
.ways-grid{display:grid;gap:3rem}
.way{display:block;text-decoration:none}
.way figure{margin:0 0 1.2rem;overflow:hidden}
.way img{width:100%;height:auto;aspect-ratio:4/4.4;object-fit:cover;transition:transform 1.6s ease}
.way:hover img{transform:scale(1.03)}
.way h3{font-family:var(--serif);font-weight:400;font-size:clamp(1.8rem,5vw,2.4rem);line-height:1.08;margin:.5rem 0 .6rem}
.way p:not(.kicker){color:var(--mute);max-width:28rem;margin-bottom:1.1rem}
.way .kicker{color:var(--lime)}
.stays-list{padding-bottom:clamp(3rem,8vh,5rem)}
.list-head{border-top:1px solid var(--dk);padding-top:1.4rem;margin-bottom:2.4rem}
.list-sub{color:var(--dmute);margin-bottom:1.4rem}
.tabs{display:flex;gap:.4rem;overflow-x:auto;scrollbar-width:none;contain:paint;margin:0 calc(var(--pad)*-1);padding:0 var(--pad)}
.tabs::-webkit-scrollbar{display:none}
.stays-b .chip{flex:none;font:inherit;font-size:.74rem;font-weight:600;letter-spacing:.04em;color:var(--dk);background:transparent;border:1px solid var(--dline);border-radius:999px;padding:.6rem 1rem;min-height:40px;cursor:pointer;transition:background .25s,color .25s,border-color .25s}
.stays-b .chip:hover{border-color:var(--dk)}
.stays-b .chip[aria-pressed="true"]{background:var(--dk);color:var(--paper);border-color:var(--dk)}
.entries{display:grid;gap:3.2rem}
.entry[hidden]{display:none}
.entry-media{margin:0;position:relative}
.entry-media img{width:100%;height:auto;aspect-ratio:4/4.3;object-fit:cover}
.entry-media figcaption{margin-top:.55rem;font-size:.64rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--dmute)}
.entry-text{padding-top:1.1rem}
.entry-no{font-family:var(--serif);font-style:italic;font-size:1.15rem;color:var(--dmute)}
.entry h3{font-family:var(--serif);font-weight:400;font-size:clamp(2rem,6vw,2.6rem);line-height:1.04;margin:.2rem 0 .5rem}
.entry-city{font-size:.78rem;font-weight:600;letter-spacing:.06em;margin-bottom:.9rem}
.entry-city span{font-weight:400;color:var(--dmute)}
.entry-note{font-family:var(--serif);font-size:1.25rem;line-height:1.4;color:#2a2925;margin-bottom:1.3rem;max-width:30rem}
.entry-score{border-top:1px solid var(--dk);padding-top:.8rem;max-width:26rem}
.total{display:flex;align-items:baseline;gap:.35rem;margin-bottom:.4rem}
.total span{flex:1;font-size:.64rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--dmute)}
.total strong{font-family:var(--serif);font-weight:400;font-size:2.3rem;line-height:1}
.total em{font-style:normal;font-size:.8rem;color:var(--dmute)}
.entry table{width:100%;border-collapse:collapse;font-size:.82rem}
.entry th{text-align:left;font-weight:400;padding:.42rem 0;border-bottom:1px solid var(--dline);width:6rem}
.entry td{padding:.42rem 0;border-bottom:1px solid var(--dline)}
.entry td.n{text-align:right;width:1.5rem;font-variant-numeric:tabular-nums}
.dots{display:inline-flex;gap:5px;vertical-align:middle}
.dots i{width:9px;height:9px;border-radius:50%;border:1px solid var(--dk)}
.dots i.on{background:var(--dk)}
.method{background:var(--paper2);border-top:1px solid var(--dline)}
.method-head{max-width:44rem;margin-bottom:clamp(2rem,6vh,3.5rem)}
.method-grid{list-style:none;padding:0;display:grid;gap:0;border-top:1px solid var(--dk)}
.method-grid li{padding:1.4rem 0;border-bottom:1px solid var(--dline)}
.method-grid span{font-family:var(--serif);font-style:italic;font-size:1.2rem;color:var(--dmute)}
.method-grid h3{font-family:var(--serif);font-weight:400;font-size:1.8rem;line-height:1.1;margin:.2rem 0 .4rem}
.method-grid p{color:var(--dmute);font-size:.95rem}
.byline{margin-top:clamp(2.5rem,6vh,3.5rem);text-align:center}
.names{font-family:var(--serif);font-size:clamp(1.6rem,5vw,2.4rem);line-height:1.3;margin-top:.6rem}
.names a{text-decoration:none;white-space:nowrap}
.names a span{font-family:var(--sans);font-size:.8rem;color:var(--dmute);letter-spacing:.02em}
.stays-b .sa-feature{background:var(--bg);color:var(--ink)}
.stays-b .invite-media::after{background:linear-gradient(180deg,rgba(11,12,10,0) 40%,var(--bg) 100%)}
.feat-list{list-style:none;padding:0;margin:1.6rem 0 1.8rem;display:grid;gap:.6rem}
.feat-list li{position:relative;padding-left:1.4rem;font-size:.95rem}
.feat-list li::before{content:"";position:absolute;left:0;top:.62em;width:7px;height:7px;border-radius:2px;background:var(--lime)}
.stays-b .sa-feature .btn-solid{width:auto;margin-top:0}
.stays-b .foot{background:var(--bg);color:var(--ink)}
.foot a.handle{text-decoration:none;border-bottom:1px solid var(--lime)}
.stays-b :focus-visible{outline-color:var(--dk)}
.stays-b .dark :focus-visible,.stays-b .sa-feature :focus-visible,.stays-b .top :focus-visible{outline-color:var(--lime)}
@media (max-width:560px){.hide-s{display:none}.mast-row{justify-content:space-between}}
@media (min-width:900px){
  .cover{display:grid;grid-template-columns:1.6fr 1fr;gap:clamp(2rem,4vw,4rem);align-items:end}
  .cover-media img{aspect-ratio:3/2}
  .cover-text{padding:0 0 .4rem}
  .contents{grid-template-columns:1.2fr 1fr;gap:clamp(3rem,7vw,7rem);align-items:start}
  .ways-grid{grid-template-columns:1fr 1fr;gap:clamp(2rem,4vw,4rem)}
  .way:nth-child(2){margin-top:6rem}
  .list-head{display:grid;grid-template-columns:1fr auto;column-gap:2rem;align-items:end}
  .list-head .kicker{grid-column:1/-1}
  .list-head h2{grid-column:1}
  .list-sub{grid-column:1;margin-bottom:0}
  .tabs{grid-column:2;grid-row:2/4;margin:0;padding:0;overflow:visible;flex-wrap:wrap;justify-content:flex-end;max-width:30rem;align-self:end}
  .entries{grid-template-columns:repeat(3,1fr);column-gap:clamp(1.6rem,3vw,3rem);row-gap:4.5rem}
  .entry-lead{grid-column:1/-1;display:grid;grid-template-columns:1.5fr 1fr;gap:clamp(2rem,4vw,4rem);align-items:center}
  .entry-lead .entry-media img{aspect-ratio:3/2.3}
  .entry-lead h3{font-size:3.4rem}
  .entry-lead .entry-note{font-size:1.5rem}
  .method{display:grid;grid-template-columns:1fr 1.4fr;column-gap:clamp(2rem,6vw,6rem)}
  .method-head{grid-row:span 2}
  .method-grid{grid-template-columns:1fr 1fr;column-gap:2.5rem;border-top:0}
  .method-grid li{border-top:1px solid var(--dk);border-bottom:0}
  .byline{grid-column:2;text-align:left}
  .stays-b .invite-media::after{background:linear-gradient(90deg,rgba(11,12,10,0) 55%,var(--bg) 100%)}
}
@media (min-width:900px) and (max-width:1199px){.entries{grid-template-columns:repeat(2,1fr)}}
