/* Pangea v15 world: Travel, the blank page. White paper, Jost light, the leaf light, scale and room.
 * Everything is scoped under .wd--travel (each of this world's sections carries it). */
.wd--travel{--tv-line:#b8744c;--tv-coast:rgba(29,27,24,.3);--tv-card:#f4f0e9}

/* type that writes itself: words stay whole, letters or words arrive in turn, rising out of the paper */
.wd--travel .tv-w .tv-wd{display:inline-block;white-space:nowrap}
.wd--travel .tv-w .tv-c{display:inline-block;opacity:0;transform:translateY(.32em);transition:opacity .9s var(--caress),transform 1.1s var(--caress);transition-delay:calc(var(--k) * 36ms)}
.wd--travel .on .tv-w .tv-c,.wd--travel .tv-w.on .tv-c{opacity:1;transform:none}

/* ---------- 1. the door's photograph, settling into a print on the page ---------- */
.wd--travel.wd-hero.tv-hero{height:235vh;overflow:visible;background:var(--paper)}
.wd--travel .tv-hero__stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;background:var(--paper)}
.wd--travel .light{-webkit-mask-image:linear-gradient(to bottom,transparent 13%,#000 34%,#000 64%,transparent 87%);mask-image:linear-gradient(to bottom,transparent 13%,#000 34%,#000 64%,transparent 87%)}
.wd--travel .tv-hero__stage>.light{z-index:0;-webkit-mask-image:linear-gradient(to bottom,#000 52%,transparent 87%);mask-image:linear-gradient(to bottom,#000 52%,transparent 87%)}
.wd--travel .tv-hero__shade{position:absolute;z-index:1;left:calc(var(--x0,0) * 100%);top:calc(var(--y0,0) * 100%);width:calc((var(--x1,1) - var(--x0,0)) * 100%);height:calc((var(--y1,1) - var(--y0,0)) * 100%);border-radius:2px;box-shadow:0 46px 80px -46px rgba(48,34,20,.55),0 2px 10px rgba(48,34,20,.07);opacity:0;pointer-events:none}
.wd--travel .tv-print{position:absolute;inset:0;z-index:2}
.wd--travel.tv-hero:not(.is-still) .tv-print{will-change:clip-path}
.wd--travel.tv-hero:not(.is-still) .tv-print .wd-hero__img{will-change:transform}
/* a breath of paper under the top line, so the logo and the menu read over the palm; it lifts as the photograph settles */
.wd--travel .tv-hero__veil{position:absolute;inset:0;z-index:2;pointer-events:none;opacity:0;transition:opacity 1.6s var(--caress) .2s}
.wd--travel.tv-hero.on .tv-hero__veil{opacity:1}
.wd--travel .tv-hero__veil i{position:absolute;inset:0;background:linear-gradient(to bottom,rgba(252,251,248,.6),rgba(252,251,248,0) 150px)}
.wd--travel .tv-hero__k{position:absolute;z-index:3;right:var(--g);top:19vh;display:grid;justify-items:start}
.wd--travel .tv-hero__h{font-size:17.4vw;font-weight:200;line-height:.8;letter-spacing:-.055em;color:var(--ink);margin:0 0 0 -.05em}
.wd--travel .tv-hero__h .tv-wd{display:inline-block;overflow:hidden;padding:0 .05em .1em 0;margin-bottom:-.1em}
.wd--travel .tv-hero__h .tv-c{display:inline-block;transform:translateY(108%);transition:transform 1.6s var(--caress);transition-delay:calc(var(--k) * 70ms)}
.wd--travel.tv-hero.on .tv-hero__h .tv-c{transform:none}
.wd--travel .tv-hero__note{display:flex;gap:18px;align-items:flex-start;max-width:30ch;margin-top:30px;opacity:0;transform:translateY(16px);transition:opacity 1.4s var(--caress) .75s,transform 1.7s var(--caress) .75s}
.wd--travel.tv-hero.on .tv-hero__note{opacity:1;transform:none}
.wd--travel .tv-hero__note p{font-size:18px;line-height:1.5;color:var(--ink);text-shadow:0 0 22px rgba(252,251,248,.75),0 0 2px rgba(252,251,248,.5)}
.wd--travel .tv-hero__mark{flex:0 0 auto;width:18px;height:29px;margin-top:5px;overflow:visible;opacity:1;transform:none;filter:none}
.wd--travel .tv-hero__mark path{fill:none;stroke:var(--ink);stroke-width:.55;stroke-dasharray:var(--l);stroke-dashoffset:var(--l);transition:stroke-dashoffset 2.4s var(--soft);transition-delay:calc(1s + var(--i) * 110ms)}
.wd--travel.tv-hero.on .tv-hero__mark path{stroke-dashoffset:0}

/* ---------- 2. the sketch: a blank page that writes itself ---------- */
.wd--travel.tv-sketch{position:relative;height:470vh}
.wd--travel .tv-sketch__stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;background:var(--paper)}
.wd--travel .tv-sk__head{position:absolute;z-index:2;left:var(--g);top:16vh;max-width:27vw}
.wd--travel .tv-sk__head .eyebrow{opacity:0;transition:opacity 1.2s var(--caress)}
.wd--travel .tv-sk__head.on .eyebrow{opacity:1}
.wd--travel .tv-sk__title{text-wrap:balance;font-size:5.3vw;font-weight:200;line-height:.95;letter-spacing:-.045em;color:var(--ink);margin:20px 0 22px}
.wd--travel .tv-sk__sub{font-size:17px;color:var(--body)}
.wd--travel .tv-sk__sub .tv-c{transition-delay:calc(.7s + var(--k) * 60ms)}
.wd--travel .tv-map{position:absolute;z-index:2;left:30vw;width:52vw;top:calc(50% - 16.4vw + 3.5vh)}
.wd--travel .tv-map__fig{position:relative;aspect-ratio:262/165}
.wd--travel .tv-map__svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.wd--travel .tv-coast{fill:none;stroke:var(--tv-coast);stroke-width:.42;stroke-dasharray:1;stroke-dashoffset:1;stroke-linejoin:round}
.wd--travel .tv-leg{fill:none;stroke:var(--tv-line);stroke-width:.6;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1 1.05;stroke-dashoffset:1}
.wd--travel .tv-dot{fill:var(--ink)}
.wd--travel .tv-map__svg .tv-dot{display:none}
.wd--travel .tv-nib{fill:var(--tv-line);opacity:0;transition:opacity .4s var(--caress)}
.wd--travel .tv-nib.on{opacity:1}
.wd--travel .tv-pin{position:absolute;z-index:3;width:0;height:0}
.wd--travel .tv-pin i{position:absolute;left:-5px;top:-5px;width:10px;height:10px;border-radius:50%;background:var(--ink);transform:scale(0);transition:transform 1s var(--caress)}
.wd--travel .tv-pin i::after{content:"";position:absolute;inset:-1px;border-radius:50%;border:1px solid var(--tv-line);opacity:0}
.wd--travel .tv-pin.on i{transform:scale(1)}
.wd--travel .tv-pin.on i::after{animation:tvRing 2s var(--caress) .15s 1 both}
@keyframes tvRing{from{opacity:.9;transform:scale(1)}to{opacity:0;transform:scale(4.2)}}
.wd--travel .tv-pin__n{display:none}
.wd--travel .tv-pin__g{position:absolute;right:16px;top:-7px;white-space:nowrap;font-size:10px;font-weight:400;letter-spacing:.16em;color:var(--mute);opacity:0;transition:opacity 1.4s var(--caress) .5s}
.wd--travel .tv-pin--1 .tv-pin__g{right:auto;left:14px;top:-22px}
.wd--travel .tv-pin.on .tv-pin__g{opacity:1}
.wd--travel .tv-note{position:absolute;z-index:3;left:var(--x);top:var(--y);width:16vw}
.wd--travel .tv-note--1{width:21vw;transform:translate(-50%,calc(-100% - 30px));text-align:center}
.wd--travel .tv-note--2,.wd--travel .tv-note--3{left:92%;transform:translateY(-50%)}
.wd--travel .tv-note__k{font-size:11px;font-weight:400;letter-spacing:.22em;text-transform:uppercase;color:var(--mute);opacity:0;transition:opacity 1s var(--caress)}
.wd--travel .tv-note.on .tv-note__k{opacity:1}
.wd--travel .tv-note__n{font-size:2.8vw;font-weight:200;font-style:italic;line-height:1;letter-spacing:-.02em;color:var(--ink);margin:12px 0 12px}
.wd--travel .tv-note__n .tv-c{transition-delay:calc(.12s + var(--k) * 55ms)}
.wd--travel .tv-note__n small{font-size:.42em;letter-spacing:0;color:var(--body)}
.wd--travel .tv-note__n small .tv-c{transition-delay:calc(.35s + var(--k) * 50ms)}
.wd--travel .tv-note__t{font-size:15px;line-height:1.55;color:var(--body)}
.wd--travel .tv-note__t .tv-c{transition-delay:calc(.45s + var(--k) * 24ms)}
.wd--travel .tv-sk__band{position:absolute;z-index:2;left:var(--g);bottom:9vh;max-width:40vw}
.wd--travel .tv-sketch__stage>.light{opacity:.1}
.wd--travel .tv-sk__band .eyebrow{opacity:0;transition:opacity 1.2s var(--caress)}
.wd--travel .tv-sk__band.on .eyebrow{opacity:1}
.wd--travel .tv-sk__fare{white-space:nowrap;font-size:3vw;font-weight:200;line-height:1.04;letter-spacing:-.035em;color:var(--ink);margin:14px 0 16px}
.wd--travel .tv-sk__fare .tv-c{transition-delay:calc(.15s + var(--k) * 70ms)}
.wd--travel .tv-sk__close{font-size:19px;font-style:italic;font-weight:300;color:var(--ink)}
.wd--travel .tv-sk__close .tv-c{transition-delay:calc(.55s + var(--k) * 45ms)}

/* ---------- 3. the moments, laid down like prints ---------- */
.wd--travel.tv-moments{position:relative;overflow:hidden;height:134vw}
.wd--travel .tv-quote{position:absolute;z-index:3;left:var(--g);top:11vw;width:58vw}
.wd--travel .tv-quote[data-r]{opacity:1;transform:none;filter:none}
.wd--travel .tv-quote p{font-size:4.9vw;font-weight:200;line-height:1.05;letter-spacing:-.04em;color:var(--ink)}
.wd--travel .tv-quote .tv-c{display:inline-block;opacity:0;transform:translateY(.4em);transition:opacity 1.1s var(--caress),transform 1.4s var(--caress);transition-delay:calc(var(--k) * 70ms)}
.wd--travel .tv-quote.in .tv-c{opacity:1;transform:none}
.wd--travel .tv-inpic{display:inline-block;width:1.45em;height:.7em;border-radius:999px;overflow:hidden;vertical-align:-.03em;clip-path:inset(0 100% 0 0 round 999px);transition:clip-path 1.6s var(--caress) .45s}
.wd--travel .tv-quote.in .tv-inpic{clip-path:inset(0 0 0 0 round 999px)}
.wd--travel .tv-inpic img{width:100%;height:100%;object-fit:cover;object-position:50% 36%}
.wd--travel .tv-quote cite{display:block;margin-top:26px;font-size:11px;font-style:normal;font-weight:400;letter-spacing:.28em;text-transform:uppercase;color:var(--mute);opacity:0;transition:opacity 1.4s var(--caress) 1.1s}
.wd--travel .tv-quote.in cite{opacity:1}
.wd--travel .tv-m{position:absolute;z-index:2;margin:0}
.wd--travel .tv-m__p{position:relative;display:block}
.wd--travel .tv-m__p::before{content:"";position:absolute;inset:0;box-shadow:0 36px 56px -34px rgba(48,34,20,.42),0 2px 6px rgba(48,34,20,.06);opacity:0;transition:opacity 1.6s var(--caress) .7s;pointer-events:none}
.wd--travel .tv-m__p:has(.frame.in)::before{opacity:1}
.wd--travel .tv-m .frame{width:100%}
.wd--travel .tv-m figcaption{margin-top:14px;font-size:13px;letter-spacing:.05em;color:var(--mute)}
.wd--travel .tv-m figcaption em{font-style:italic;font-size:17px;letter-spacing:0;color:var(--ink)}
.wd--travel .tv-m1{left:63vw;top:5vw;width:30vw}.wd--travel .tv-m1 figcaption{text-align:right}.wd--travel .tv-m1 .frame{aspect-ratio:3/4}
.wd--travel .tv-m3{left:53vw;top:29vw;width:14vw;z-index:4}.wd--travel .tv-m3 .frame{aspect-ratio:4/5}
.wd--travel .tv-m2{left:6vw;top:41vw;width:29vw}.wd--travel .tv-m2 .frame{aspect-ratio:15/16}
.wd--travel .tv-m4{left:30vw;top:61vw;width:16vw;z-index:4}.wd--travel .tv-m4 .frame{aspect-ratio:3/4}
.wd--travel .tv-m5{left:53vw;top:62vw;width:40vw;z-index:3}.wd--travel .tv-m5 .frame{aspect-ratio:16/9}
.wd--travel .tv-wide{position:absolute;left:0;right:0;top:92vw;margin:0;z-index:2}
.wd--travel .tv-wide__f{overflow:hidden;aspect-ratio:2048/690}
.wd--travel .tv-wide__f img{width:100%;height:100%;object-fit:cover}
.wd--travel .tv-wide figcaption{padding:22px var(--g) 0;text-align:right;font-size:clamp(20px,1.9vw,28px);font-weight:200;color:var(--ink)}

/* ---------- 4. the occasions ---------- */
.wd--travel.tv-occ{position:relative;padding:190px var(--g) 170px}
.wd--travel.tv-occ h2{font-size:clamp(46px,7.6vw,118px);margin:26px 0 0}
.wd--travel.tv-occ h2 em{color:var(--pale)}
.wd--travel .tv-occ__list{list-style:none;margin-top:100px;border-top:1px solid var(--line)}
.wd--travel .tv-o[data-r]{transition-delay:calc(var(--i) * 90ms)}
.wd--travel .tv-o a{display:grid;grid-template-columns:4.5em minmax(0,1fr) 12em 15em;gap:28px;align-items:baseline;padding:26px 0 24px;border-bottom:1px solid var(--line);transition:opacity .5s var(--caress),transform .14s ease-out}
.wd--travel .tv-o__n{font-size:12px;font-weight:400;letter-spacing:.2em;color:var(--mute)}
.wd--travel .tv-o__t{font-size:clamp(30px,3.3vw,50px);font-weight:200;line-height:1.1;letter-spacing:-.03em;color:var(--ink);transition:transform 1s var(--caress)}
.wd--travel .tv-o__last{white-space:nowrap}
.wd--travel .tv-o__last .tv-o__pic{margin-right:.22em}
.wd--travel .tv-o__pic{display:inline-block;width:1.55em;height:.74em;margin:0;border-radius:999px;overflow:hidden;vertical-align:-.06em;background:var(--tv-card)}
.wd--travel .tv-o__pic img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--caress)}
.wd--travel .tv-o__pic--sk{box-shadow:inset 0 0 0 1px var(--line)}
.wd--travel .tv-o__sk,.wd--travel .tv-plate__sk{display:block;width:100%;height:100%}
.wd--travel .tv-o__sk path,.wd--travel .tv-plate__sk path{stroke-dashoffset:0}
.wd--travel .tv-o__sk{padding:10% 12%}
.wd--travel .tv-o__sk .tv-coast{stroke-width:4.2;stroke:rgba(29,27,24,.55)}
.wd--travel .tv-o__sk .tv-leg{stroke-width:7}
.wd--travel .tv-o__sk .tv-dot{display:none}
.wd--travel .tv-o__k,.wd--travel .tv-o__f{font-size:14px;line-height:1.45;color:var(--ink)}
.wd--travel .tv-o small{display:block;margin-top:3px;font-size:13px;color:var(--mute)}
.wd--travel .tv-o a:active{transform:scale(.985)}
.wd--travel .tv-o a:focus-visible{outline-offset:-1px}
.wd--travel .tv-o a:focus-visible .tv-o__t{transform:translateX(14px)}
@media (hover:hover) and (pointer:fine){
  .wd--travel .tv-occ__list:hover .tv-o a{opacity:.38}
  .wd--travel .tv-occ__list .tv-o a:hover{opacity:1}
  .wd--travel .tv-o a:hover .tv-o__t{transform:translateX(14px)}
  .wd--travel .tv-o a:hover .tv-o__pic img{transform:scale(1.16)}
}
.wd--travel .tv-plate{position:fixed;left:0;top:0;z-index:30;width:280px;height:360px;pointer-events:none;opacity:0;overflow:hidden;border-radius:2px;background:var(--tv-card);box-shadow:0 40px 70px -40px rgba(48,34,20,.5);will-change:transform,opacity}
.wd--travel .tv-plate img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .7s var(--caress)}
.wd--travel .tv-plate img.on{opacity:1}
.wd--travel .tv-plate.sk img.on{opacity:0}
.wd--travel .tv-plate__sk{position:absolute;inset:0;padding:22% 12%;opacity:0;transition:opacity .6s var(--caress)}
.wd--travel .tv-plate__sk .tv-coast{stroke-width:1.2}
.wd--travel .tv-plate__sk .tv-leg{stroke-width:1.8}
.wd--travel .tv-plate.sk .tv-plate__sk{opacity:1}
@media (hover:none),(pointer:coarse){.wd--travel .tv-plate{display:none}}

/* ---------- 5. one way to begin ---------- */
.wd--travel.tv-begin{position:relative;overflow:hidden;padding:210px var(--g) 220px}
.wd--travel.tv-begin>*:not(.light){position:relative;z-index:2}
.wd--travel.tv-begin h2{font-size:clamp(56px,11.4vw,196px);margin:30px 0 64px}
.wd--travel.tv-begin h2 em{font-style:italic}
.wd--travel .tv-begin__mark{display:block;width:clamp(34px,3vw,46px);height:auto;aspect-ratio:41/67;overflow:visible}
.wd--travel .tv-begin__mark path{fill:none;stroke:var(--ink);stroke-width:.3;stroke-dasharray:var(--l);stroke-dashoffset:var(--l);transition:stroke-dashoffset 2.6s var(--soft);transition-delay:calc(var(--i) * 140ms)}
.wd--travel .tv-begin__mark.in path{stroke-dashoffset:0}
.wd--travel .tv-begin__go{display:flex;flex-wrap:wrap;align-items:center;gap:24px 40px}
.wd--travel .tv-begin__note{font-size:15px;color:var(--mute)}

/* short laptop screens: the type rises so the line stays clear of the jetty */
@media (min-width:700px) and (max-height:800px){.wd--travel .tv-hero__k{top:13vh}.wd--travel .tv-hero__h{font-size:16.5vw}}

/* landscape tablets and small laptops: the island steps left and the stops get room, so no two of them touch */
@media (min-width:700px) and (max-width:1180px) and (orientation:landscape){
  .wd--travel .tv-map{left:27vw;width:50vw;top:calc(50% - 15.75vw + 3.5vh)}
  .wd--travel .tv-note--2,.wd--travel .tv-note--3{width:22vw}
}

/* ---------- the phone (and a tablet held upright), composed on its own: the opening and the sketch ---------- */
@media (max-width:699px) and (min-height:501px),(max-width:1100px) and (orientation:portrait){
  .wd--travel .tv-hero__k{right:auto;left:var(--g);top:auto;bottom:calc(26px + env(safe-area-inset-bottom))}
  .wd--travel .tv-hero__h{font-size:35vw}
  .wd--travel .tv-hero__note{gap:14px;margin-top:16px;max-width:34ch}
  .wd--travel .tv-hero__note p{font-size:14.5px;line-height:1.5}
  .wd--travel .tv-hero__mark{width:14px;height:23px;margin-top:3px}
  /* on the phone the words sit on the sand: a breath of paper rises under them, the page this world becomes */
  .wd--travel .tv-hero__veil i{background:linear-gradient(to bottom,rgba(252,251,248,.6),rgba(252,251,248,0) 118px),linear-gradient(to top,rgba(252,251,248,.84),rgba(252,251,248,.5) 21%,rgba(252,251,248,0) 50%)}

  .wd--travel.tv-sketch{height:520vh}
  /* the sketch sits in the middle of the phone's page, never crowded up under the top line */
  .wd--travel .tv-sketch__stage{--sk-w:min(100vw - 2 * var(--g),560px);--sk-top:max(84px,calc(50% - (var(--sk-w) * 165 / 262 + 316px) / 2))}
  .wd--travel .tv-sk__head{top:var(--sk-top);right:var(--g);max-width:none}
  .wd--travel .tv-sk__title{font-size:40px;margin:12px 0 8px}
  .wd--travel .tv-sk__sub{font-size:14px}
  .wd--travel .tv-map{left:var(--g);right:auto;width:var(--sk-w);top:calc(var(--sk-top) + 132px)}
  .wd--travel .tv-coast{stroke-width:.85}
  .wd--travel .tv-leg{stroke-width:1.2}
  .wd--travel .tv-pin i{left:-4px;top:-4px;width:8px;height:8px}
  .wd--travel .tv-pin__g{display:none}
  .wd--travel .tv-pin__n{display:block;position:absolute;left:11px;top:-11px;white-space:nowrap;font-size:15px;font-style:italic;font-weight:300;color:var(--ink);opacity:0;transition:opacity 1.2s var(--caress) .3s}
  .wd--travel .tv-pin--1 .tv-pin__n{left:-24px;top:auto;bottom:9px}
  .wd--travel .tv-pin.on .tv-pin__n{opacity:1}
  .wd--travel .tv-note,.wd--travel .tv-note--1,.wd--travel .tv-note--2,.wd--travel .tv-note--3{left:0;right:0;top:calc(100% + 34px);width:auto;transform:none;text-align:left;transition:opacity .9s var(--caress),visibility 0s}
  .wd--travel .tv-note.past{opacity:0;visibility:hidden;transition:opacity .5s var(--caress),visibility 0s .5s}
  .wd--travel .tv-note__n{font-size:46px;margin:10px 0 12px}
  .wd--travel .tv-note__t{font-size:16px}
  .wd--travel .tv-sk__band{left:var(--g);right:var(--g);bottom:auto;top:calc(var(--sk-top) + 132px + var(--sk-w) * 165 / 262 + 34px);max-width:none}
  .wd--travel .tv-sk__fare{font-size:30px}
  .wd--travel .tv-sk__close{font-size:17px}
}

/* ---------- the phone: the rest of the page ---------- */
@media (max-width:699px){
  .wd--travel.tv-moments{height:auto;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));column-gap:12px;padding:96px var(--g) 0}
  .wd--travel .tv-quote{position:relative;left:auto;top:auto;width:auto;grid-column:1/-1;margin-bottom:64px}
  .wd--travel .tv-quote p{font-size:35px;line-height:1.08}
  .wd--travel .tv-m{position:relative;left:auto;top:auto;width:auto}
  .wd--travel .tv-m1{grid-column:3/7}
  .wd--travel .tv-m3{grid-column:1/4;margin-top:-34%}
  .wd--travel .tv-m2{grid-column:2/7;margin-top:56px}
  .wd--travel .tv-m4{grid-column:1/5;margin-top:-16%}
  .wd--travel .tv-m5{grid-column:2/7;margin-top:48px}
  .wd--travel .tv-wide{position:relative;top:auto;grid-column:1/-1;margin:72px calc(var(--g) * -1) 0}
  .wd--travel .tv-wide__f{aspect-ratio:4/3}
  .wd--travel .tv-wide__f img{object-position:46% 50%}
  .wd--travel .tv-wide figcaption{text-align:left;font-size:22px}

  .wd--travel.tv-occ{padding:130px var(--g) 110px}
  .wd--travel .tv-occ__list{margin-top:60px}
  .wd--travel .tv-o a{grid-template-columns:minmax(0,1fr) auto;gap:10px 16px;padding:22px 0 20px}
  .wd--travel .tv-o__n{display:none}
  .wd--travel .tv-o__t{grid-column:1/-1;font-size:29px}
  .wd--travel .tv-o__k,.wd--travel .tv-o__f{font-size:13px}
  .wd--travel .tv-o__f{text-align:right}
  .wd--travel .tv-o small{font-size:12px}

  .wd--travel.tv-begin{padding:140px var(--g) 150px}
  .wd--travel.tv-begin h2{margin:24px 0 46px}
}

/* ---------- a phone turned on its side: the island on the left, one stop at a time beside it ---------- */
@media (orientation:landscape) and (max-height:500px){
  .wd--travel .tv-hero__note p{font-size:15px}
  .wd--travel.tv-sketch{--sk-mw:calc((100vh - 170px) * 262 / 165)}
  .wd--travel .tv-sk__head{top:62px;max-width:none}
  .wd--travel .tv-sk__title{font-size:30px;margin:8px 0 4px}
  .wd--travel .tv-sk__sub{font-size:13px}
  .wd--travel .tv-coast{stroke-width:.8}
  .wd--travel .tv-leg{stroke-width:1.1}
  .wd--travel .tv-pin__g{display:none}
  .wd--travel .tv-pin__n{display:block;position:absolute;left:11px;top:-11px;white-space:nowrap;font-size:14px;font-style:italic;font-weight:300;color:var(--ink);opacity:0;transition:opacity 1.2s var(--caress) .3s}
  .wd--travel .tv-pin--1 .tv-pin__n{left:-24px;top:auto;bottom:9px}
  .wd--travel .tv-pin.on .tv-pin__n{opacity:1}
  .wd--travel .tv-note__n{font-size:34px;margin:8px 0 8px}
  .wd--travel .tv-note__t{font-size:14px}
  .wd--travel .tv-sk__fare{font-size:26px}
  .wd--travel.tv-sketch:not(.is-still) .tv-map{left:var(--g);top:auto;bottom:18px;width:var(--sk-mw)}
  .wd--travel.tv-sketch:not(.is-still) .tv-note{left:calc(100% + 6vw);right:auto;top:0;width:min(40vw,380px);transform:none;text-align:left;transition:opacity .9s var(--caress),visibility 0s}
  .wd--travel.tv-sketch:not(.is-still) .tv-note.past{opacity:0;visibility:hidden;transition:opacity .5s var(--caress),visibility 0s .5s}
  .wd--travel.tv-sketch:not(.is-still) .tv-sk__band{left:calc(var(--g) + var(--sk-mw) + 6vw);bottom:auto;top:152px;max-width:40vw}
  .wd--travel.tv-sketch.is-still .tv-sketch__stage{height:auto;min-height:0;padding:90px var(--g) 70px}
  .wd--travel.tv-sketch.is-still .tv-sk__head,.wd--travel.tv-sketch.is-still .tv-map,.wd--travel.tv-sketch.is-still .tv-sk__band{position:relative;left:auto;right:auto;top:auto;bottom:auto}
  .wd--travel.tv-sketch.is-still .tv-map{width:min(60vw,480px);margin-top:30px}
  .wd--travel.tv-sketch.is-still .tv-note{position:relative;left:auto;top:auto;width:auto;max-width:60ch;transform:none;text-align:left;margin-top:28px}
  .wd--travel.tv-sketch.is-still .tv-sk__band{margin-top:40px;max-width:none}
}

/* ---------- reduced motion and ?static=1: every scene in its finished state, nothing held ---------- */
.wd--travel.tv-hero.is-still{height:100vh;height:100svh}
.wd--travel.tv-hero.is-still .tv-hero__stage{position:relative}
.wd--travel.tv-sketch.is-still{height:auto}
.wd--travel.tv-sketch.is-still .tv-sketch__stage{position:relative;height:100vh;min-height:760px}
.wd--travel.is-still .tv-coast,.wd--travel.is-still .tv-leg{stroke-dashoffset:0}
@media (max-width:699px) and (min-height:501px),(max-width:1100px) and (orientation:portrait){
  .wd--travel.tv-sketch.is-still .tv-sketch__stage{height:auto;min-height:0;padding:96px var(--g) 90px}
  .wd--travel.tv-sketch.is-still .tv-sk__head,.wd--travel.tv-sketch.is-still .tv-map,.wd--travel.tv-sketch.is-still .tv-sk__band{position:relative;left:auto;right:auto;top:auto;bottom:auto}
  .wd--travel.tv-sketch.is-still .tv-map{margin-top:36px}
  .wd--travel.tv-sketch.is-still .tv-note{position:relative;top:auto;margin-top:40px}
  .wd--travel.tv-sketch.is-still .tv-note.past{opacity:1;visibility:visible}
  .wd--travel.tv-sketch.is-still .tv-sk__band{margin-top:48px}
}
@media (prefers-reduced-motion:reduce){
  .wd--travel .tv-w .tv-c,.wd--travel .tv-quote .tv-c,.wd--travel .tv-hero__h .tv-c{transform:none;filter:none;transition:opacity .4s ease;transition-delay:0s}
  .wd--travel .tv-hero__note,.wd--travel .tv-hero__mark path{transform:none;transition:opacity .4s ease;stroke-dashoffset:0}
  .wd--travel .tv-inpic{clip-path:none;transition:none}
  .wd--travel .tv-pin i,.wd--travel .tv-pin.on i::after{transform:scale(1);animation:none;transition:none}
}