/* v3 additions for About, Resorts and Service businesses.
   es-  Experience and systems: the guest's five moments, Guest view and Owner view (from round 3 piece S5). About.
   bs-  By season: the year as a ring (from round 3 piece S4). Resorts.
   lf-  Leaks first, ads last notes. Resorts and Service businesses. */

/* ================= es-: Experience and systems ================= */
.es-head{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:28px 72px;align-items:end}
.es-head h2{max-width:12ch}
.es-head .lede{margin-top:0;color:#C3CAD6}
.es-defs{display:grid;grid-template-columns:1fr 1fr;gap:18px 28px;margin-top:30px}
.es-defs div{border-top:1px solid var(--rule-d);padding-top:14px}
.es-defs b{display:flex;align-items:center;gap:8px;font-weight:600;color:#ECEDF2;margin-bottom:4px}
.es-defs p{font-size:.92rem;line-height:1.5;color:var(--mist)}

.es-rail{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:40px;margin-top:clamp(64px,7vw,96px)}
.es-line{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;overflow:visible;z-index:0}
.es-line path{fill:none;stroke:#3A4566;stroke-width:1.5;stroke-linecap:round}
.es-line .es-tail{stroke-dasharray:3 7}
.es-rail > *:not(.es-line):not(.es-switch){position:relative;z-index:1}

.es-node{display:block;width:16px;height:16px;border-radius:50%;background:var(--night);box-shadow:inset 0 0 0 1.5px var(--mist);transition:background .4s}
.es-node.is-click{background:var(--orange);box-shadow:none}
.es-node.is-end{box-shadow:inset 0 0 0 1.5px var(--orange)}
.es-after .es-node.is-end{box-shadow:none;border:1.5px dashed var(--mist)}
.es[data-view="owner"] .es-step .es-node:not(.is-click){background:#ECEDF2;box-shadow:none}

/* the switch */
.es-switch{grid-column:2;grid-row:1;align-self:start;position:relative;z-index:2;display:inline-flex;gap:4px;padding:5px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--rule-d);background:var(--night)}
.es-switch button{display:grid;gap:3px;text-align:left;border:0;border-radius:999px;background:none;color:#ECEDF2;cursor:pointer;padding:.75em 1.45em;min-height:44px;transition:background .25s,color .25s}
@media (hover:hover){.es-switch button:not([aria-pressed="true"]):hover{background:rgba(236,237,242,.08)}}
.es-switch b{display:flex;align-items:center;gap:8px;font-weight:600;font-size:.95rem;line-height:1.2}
.es-switch b::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--mist);opacity:.5}
.es-switch span{font-size:.76rem;line-height:1.2;color:var(--mist)}
.es-switch button[aria-pressed="true"]{background:#ECEDF2;color:var(--night)}
.es-switch button[aria-pressed="true"] b::before{background:var(--orange);opacity:1}
.es-switch button[aria-pressed="true"] span{color:var(--mute)}
.es-ex{grid-column:2;grid-row:1;align-self:end;justify-self:end;margin:0}

/* bookends */
.es-before{grid-column:1;grid-row:1;padding-left:36px;max-width:600px}
.es-before .es-node,.es-after .es-node{position:absolute;top:5px}
.es-before .es-node{left:0}
.es-bk{font-size:.82rem;color:var(--mist)}
.es-before h3,.es-after h3{font-size:1.35rem;line-height:1.2;margin:4px 0 6px}
.es-before p:last-child,.es-after p:last-child{font-size:.94rem;line-height:1.55;color:var(--mist)}
.es-after{grid-column:2;grid-row:3;justify-self:end;text-align:right;padding-right:36px;max-width:440px;margin-top:48px}
.es-after .es-node{right:0}

/* the five moments */
.es-steps{grid-column:1 / -1;grid-row:2;list-style:none;padding:0 32px 0 0;margin-top:60px;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:20px}
.es-step{display:flex;flex-direction:column}
.es-step .es-node{margin-bottom:20px}
.es-step h3{display:flex;align-items:baseline;gap:10px;font-size:1.5rem;line-height:1.1;margin-bottom:14px}
.es-step h3 span{font-size:.78rem;font-weight:500;color:var(--mist);font-variant-numeric:tabular-nums;letter-spacing:0}
.es-card{flex:1;display:grid;perspective:1400px}
.es-flip{display:grid;transform-style:preserve-3d;transition:transform .85s var(--ease);transition-delay:calc(var(--i) * 90ms)}
.es-face{grid-area:1 / 1;display:flex;flex-direction:column;gap:12px;padding:18px;border-radius:18px;-webkit-backface-visibility:hidden;backface-visibility:hidden}
.es-guest{background:var(--night-2);box-shadow:inset 0 0 0 1px var(--rule-d)}
.es-owner{background:var(--salt);color:var(--ink);transform:rotateY(180deg)}
.es[data-view="owner"] .es-flip{transform:rotateY(180deg)}
.es-when{font-size:.76rem;line-height:1.3;color:var(--mist)}
.es-bub{align-self:flex-start;background:rgba(236,237,242,.1);border-radius:14px 14px 14px 4px;padding:9px 12px;font-size:.9rem;line-height:1.4;color:#ECEDF2}
.es-felt{font-size:.92rem;line-height:1.42}
.es-felt small{display:block;font-size:.72rem;color:var(--mist);margin-bottom:3px}
.es-felt.is-no{color:var(--mist)}
.es-felt.is-yes{margin-top:auto;padding-top:12px;border-top:1px solid var(--rule-d);color:#fff;font-weight:500}
.es-owner .es-when{color:var(--mute)}
.es-owner ul{list-style:none;padding:0;font-size:.88rem;line-height:1.4}
.es-owner li{padding:8px 0;border-top:1px solid var(--rule)}
.es-owner li:first-child{border-top:0;padding-top:2px}
.es-check{margin-top:auto;padding-top:10px;border-top:1.5px solid var(--ink)}
.es-check small{display:block;font-size:.72rem;color:var(--mute);margin-bottom:3px}
.es-check b{display:flex;gap:8px;align-items:baseline;font-weight:600;font-size:.92rem;line-height:1.35}
.es-check b::before{content:"";flex:none;width:7px;height:7px;border-radius:50%;background:var(--orange);transform:translateY(-1px)}

.es-note{grid-column:1;grid-row:3;margin-top:48px;max-width:58ch;font-size:1.06rem;line-height:1.55;color:var(--mist);min-height:5em}
.es-note b{color:#ECEDF2;font-weight:600}
.es-note small{display:block;margin-top:12px;font-size:.78rem}

/* first step */
.es-foot{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:28px 56px;align-items:end;margin-top:clamp(56px,6vw,88px);padding-top:30px;border-top:1px solid var(--rule-d)}
.es-terms{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr) minmax(0,1fr);gap:18px 32px}
.es-terms span{display:block;font-size:.78rem;color:var(--mist);margin-bottom:4px}
.es-terms b{font-weight:500;font-size:.96rem;line-height:1.4}
.es-cta{display:grid;justify-items:end;gap:12px;text-align:right}
.es-cta p{font-size:.82rem;line-height:1.45;color:var(--mist);max-width:34ch}

@media (max-width:1179px){
  .es-face{padding:16px}
  .es-step h3{font-size:1.3rem}
}
@media (max-width:1079px){
  .es-head{grid-template-columns:1fr}
  .es-rail{display:block}
  .es-switch{position:sticky;top:80px;z-index:5;display:flex;width:100%;max-width:520px;background:rgba(11,16,32,.94);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
  .es-switch button{flex:1;padding:.7em 1em}
  .es-ex{margin-top:14px}
  .es-before{margin-top:28px}
  .es-steps{padding:0;margin-top:40px;grid-template-columns:1fr;gap:40px}
  .es-step{position:relative;padding-left:36px;max-width:560px}
  .es-step .es-node{position:absolute;left:0;top:7px;margin:0}
  .es-note{margin-top:40px;padding-left:36px;min-height:0}
  .es-after{justify-self:auto;text-align:left;padding:0 0 0 36px;margin-top:40px;max-width:560px}
  .es-after .es-node{right:auto;left:0}
  .es-foot{grid-template-columns:1fr}
  .es-cta{justify-items:start;text-align:left}
}
@media (max-width:640px){
  .es-defs{grid-template-columns:1fr}
  .es-switch span{display:none}
  .es-terms{grid-template-columns:1fr}
}
.still .es-flip{transition:none;transform:none!important}
.still .es-owner{transform:none}
.still .es-face{-webkit-backface-visibility:visible;backface-visibility:visible}
.still .es-card{perspective:none}
.still .es-flip{transform-style:flat}
.still .es[data-view="guest"] .es-owner,.still .es[data-view="owner"] .es-guest{visibility:hidden}
.still .es-node,.still .es-switch button{transition:none}

/* ================= bs-: By season, the year as a ring ================= */
.bs{padding-bottom:clamp(72px,8vw,120px)}
.bs-head{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:20px 64px;align-items:end;margin-bottom:clamp(40px,5vw,72px)}
.bs-head h2{max-width:13ch}
.bs-head .lede{margin-top:0}

.bs-body{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(36px,5vw,88px);align-items:start}
.bs-left{display:flex;flex-direction:column;align-items:center;gap:18px}
.bs-ringwrap{position:relative;width:100%;max-width:540px;container-type:inline-size}
.bs-ring{display:block;width:100%;height:auto;overflow:visible;touch-action:manipulation}
.bs-m{cursor:pointer;outline:none}
.bs-seg{stroke-width:1.2;transition:stroke .2s,stroke-width .2s}
.bs-m.is-peak .bs-seg{fill:var(--ink);stroke:var(--ink)}
.bs-m.is-shoulder .bs-seg{fill:#B8C4BF;stroke:#B8C4BF}
.bs-m.is-lean .bs-seg{fill:url(#bs-rain);stroke:#AEBBB6}
.bs-m text{font:600 14px var(--sans);text-anchor:middle;dominant-baseline:central;pointer-events:none;fill:var(--ink)}
.bs-m.is-peak text{fill:#F2F4F1}
.bs-m.is-lean text{paint-order:stroke;stroke:var(--paper);stroke-width:4px;stroke-linejoin:round}
.bs-lift{transition:transform .5s var(--ease)}
.bs-m:hover .bs-seg{stroke:var(--ink);stroke-width:2}
.bs-m.is-peak:hover .bs-seg{stroke:#3B5A53}
.bs-m[aria-checked="true"] .bs-seg{stroke:var(--orange);stroke-width:2.5}
.bs-m:focus-visible .bs-seg{stroke:var(--orange);stroke-width:4}
.bs-m:focus-visible text{text-decoration:underline}
.bs-tick{stroke:var(--rule);stroke-width:1.4;stroke-linecap:round;transition:stroke .3s}
.bs-tick.is-on{stroke:var(--ink);stroke-width:1.8}
.bs-pin{transition:transform .6s var(--ease)}
.bs-pin circle{fill:var(--orange)}
.bs-pin line{stroke:var(--orange);stroke-width:1.5}
.still .bs-lift,.still .bs-pin,.still .bs-tick,.still .bs-seg{transition:none}

.bs-center{position:absolute;left:50%;top:50%;width:42%;transform:translate(-50%,-50%);text-align:center;pointer-events:none}
.bs-center small{display:block;font-size:max(.72rem,3.1cqw);font-weight:500;color:var(--mute);line-height:1.25}
.bs-center strong{display:block;font-family:var(--serif);font-style:italic;font-weight:400;font-size:max(1.5rem,8.6cqw);line-height:1.05;letter-spacing:-.02em;margin:.12em 0 .1em}
.bs-center span{display:block;font-size:max(.8rem,3.5cqw);font-weight:600;line-height:1.2}

.bs-nav{display:flex;align-items:center;justify-content:center;gap:14px;font-size:.88rem;color:var(--mute)}
.bs-arrow{width:44px;height:44px;border-radius:50%;border:0;background:var(--salt);box-shadow:inset 0 0 0 1px var(--rule);cursor:pointer;display:grid;place-items:center;transition:background .2s,box-shadow .2s}
.bs-arrow:hover{box-shadow:inset 0 0 0 1px var(--ink)}
.bs-arrow svg{width:16px;height:16px;fill:none;stroke:var(--ink);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.bs-typ{font-size:.84rem;line-height:1.5;color:var(--mute);text-align:center;max-width:44ch}

.bs-panel{border-top:1px solid var(--ink);padding-top:22px;min-height:560px;display:flex;flex-direction:column}
.bs-kick{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;font-size:.92rem;font-weight:500;color:var(--mute)}
.bs-now{font:600 .74rem/1 var(--sans);padding:.5em .8em;border-radius:999px;background:var(--salt);color:var(--ink);box-shadow:inset 0 0 0 1px var(--rule)}
.bs-sw{display:inline-block;width:14px;height:14px;border-radius:4px;flex:none}
.bs-sw.is-peak{background:var(--ink)}
.bs-sw.is-shoulder{background:#B8C4BF}
.bs-sw.is-lean{background:repeating-linear-gradient(110deg,#AEBBB6 0 1.2px,var(--salt) 1.2px 5px);box-shadow:inset 0 0 0 1px #AEBBB6}
.bs-sw.is-all{border-radius:50%;background:none;box-shadow:inset 0 0 0 1.5px var(--ink)}
.bs-svc{font-size:clamp(2.2rem,4vw,3.4rem);line-height:1;letter-spacing:-.04em;margin-top:14px}
.bs-svc em{font-weight:400}
.bs-why{margin-top:18px;font-size:1.12rem;line-height:1.5;max-width:46ch}
.bs-why b{font-weight:600}
.bs-work{list-style:none;padding:0;margin-top:26px;display:grid;gap:14px}
.bs-work li{position:relative;padding-left:26px;color:var(--mute);font-size:.98rem;line-height:1.5}
.bs-work li::before{content:"";position:absolute;left:2px;top:.55em;width:9px;height:9px;border-radius:50%;box-shadow:inset 0 0 0 1.5px var(--ink)}
.bs-work li::after{content:"";position:absolute;left:6px;top:calc(.55em + 12px);bottom:-12px;width:1px;background:var(--rule)}
.bs-work li:last-child::after{display:none}
.bs-work b{display:block;color:var(--ink);font-weight:600}
.bs-feeds{margin-top:24px;padding:14px 16px;border-radius:14px;background:var(--salt);font-size:.95rem;line-height:1.5;color:var(--ink)}
.bs-feeds span{display:block;font-size:.78rem;font-weight:600;color:var(--mute);margin-bottom:2px}
.bs-always{display:grid;grid-template-columns:auto 1fr;gap:4px 12px;align-items:start;margin-top:22px;padding-top:18px;border-top:1px solid var(--rule);font-size:.95rem;color:var(--mute);line-height:1.5}
.bs-always .bs-sw{margin-top:4px}
.bs-always b{color:var(--ink);font-weight:600}
.bs-act{margin-top:auto;padding-top:24px;display:flex;flex-wrap:wrap;gap:12px 18px;align-items:center}
.bs-act small{font-size:.82rem;color:var(--mute)}
.bs-dyn.is-swap{animation:bsin .45s var(--ease)}
@keyframes bsin{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.still .bs-dyn.is-swap{animation:none}

.bs-keys{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:clamp(48px,6vw,84px)}
.bs-key{display:grid;grid-template-columns:auto 1fr;gap:4px 12px;align-items:start;text-align:left;padding:18px;border-radius:18px;border:0;background:var(--salt);box-shadow:inset 0 0 0 1px var(--rule);font:inherit;color:inherit;min-height:44px}
button.bs-key{cursor:pointer;transition:box-shadow .2s,background .2s}
button.bs-key:hover{box-shadow:inset 0 0 0 1px var(--ink)}
.bs-key.is-on{background:var(--paper);box-shadow:inset 0 0 0 1.5px var(--ink)}
.bs-key .bs-sw{margin-top:5px}
.bs-key b{font-weight:600;font-size:1.02rem}
.bs-key > span{grid-column:2;font-size:.86rem;color:var(--mute);line-height:1.4}
.bs-key .bs-months{grid-column:2;font-style:normal;font-size:.8rem;color:var(--mute);margin-top:6px}

/* night: the free check starts it, any month */
.bs-start-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(40px,6vw,96px);align-items:start}
.bs-start h2{max-width:12ch}
.bs-start .lede{max-width:48ch}
.bs-stages{list-style:none;padding:0;position:relative;display:grid;gap:0}
.bs-stages li{position:relative;display:grid;grid-template-columns:auto 1fr;gap:2px 18px;padding:14px 0}
.bs-stages li::after{content:"";position:absolute;left:7px;top:33px;bottom:-18px;width:1px;background:var(--rule-d)}
.bs-stages li:last-child::after{display:none}
.bs-stages li::before{content:"";width:15px;height:15px;border-radius:50%;background:var(--night);box-shadow:inset 0 0 0 1.5px #ECEDF2;margin-top:4px;position:relative;z-index:1;grid-row:span 2}
.bs-stages li:first-child::before{background:var(--orange);box-shadow:none}
.bs-stages b{font-weight:600;font-size:1.08rem}
.bs-stages span{color:var(--mist);font-size:.95rem;line-height:1.45}
.bs-honest{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px;padding-left:33px}
.bs-bridge{margin-top:clamp(56px,7vw,96px);padding-top:clamp(32px,4vw,48px);border-top:1px solid var(--rule-d);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px 32px}
.bs-bridge p{font-size:clamp(1.4rem,2.6vw,2.1rem);font-weight:500;letter-spacing:-.025em;line-height:1.2;max-width:26ch}
.bs-bridge p em{color:var(--mist)}
.bs-quiet{margin-top:22px;font-size:.92rem;color:var(--mist);max-width:60ch}
.bs-quiet a{color:#ECEDF2}

@media (max-width:960px){
  .bs-head,.bs-body,.bs-start-grid{grid-template-columns:1fr}
  .bs-panel{min-height:0}
  .bs-ringwrap{max-width:440px}
  .bs-keys{grid-template-columns:1fr 1fr}
}
@media (max-width:520px){
  .bs-keys{grid-template-columns:1fr}
  .bs-key{padding:14px 16px}
  .bs-bridge .btn{width:100%;justify-content:center}
}

/* ================= lf-: leaks first, ads last ================= */
.lf-order{display:inline-flex;align-items:center;gap:8px;font-size:.85rem;font-weight:500;color:var(--mute)}
.lf-order::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--orange)}
.two-col article.b .lf-order::before{background:none;box-shadow:inset 0 0 0 1.5px var(--ink)}
.lf-last{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:16px 24px;align-items:center;margin-top:16px;padding:24px 28px;border-radius:22px;background:var(--paper);box-shadow:inset 0 0 0 1px var(--rule)}
.lf-last .lf-dot{width:14px;height:14px;border-radius:50%;box-shadow:inset 0 0 0 1.5px var(--ink);align-self:start;margin-top:.3em}
.lf-last p{font-size:1.02rem;line-height:1.5;max-width:70ch}
.lf-last p b{font-weight:600}
.lf-last .side{display:inline-block;font-size:.78rem;padding:.35em .8em;border-radius:999px;background:var(--tint);text-decoration:none;white-space:nowrap}
@media (max-width:760px){
  .lf-last{grid-template-columns:auto minmax(0,1fr);padding:22px 20px}
  .lf-last .side{grid-column:2;justify-self:start}
}