:root{--ink:#090b0c;--white:#f4f5f2;--blue:#003cff;--yellow:#efff00}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:35px}body{margin:0;background:var(--ink);color:var(--white);font-family:Arial,Helvetica,sans-serif;overflow-x:clip}a{color:inherit;text-decoration:none}button,input,textarea{font:inherit}a:focus-visible,button:focus-visible{outline:3px solid var(--yellow);outline-offset:8px}input:focus-visible,textarea:focus-visible{outline:2px solid var(--yellow);outline-offset:5px}.skip{position:fixed;top:-100px;left:20px;z-index:20;background:var(--yellow);color:var(--ink);padding:15px}.skip:focus{top:15px}header{padding:32px 5%;display:flex;align-items:center;justify-content:space-between;position:relative;z-index:5}.brand{display:inline-flex;align-items:center;gap:10px}.brand span{font-size:37px;font-weight:800;letter-spacing:-2px}.header-note{font-size:13px;letter-spacing:.08em;color:#b5b9ba}.contact-link{font-size:16px;border-bottom:1px solid #808480;padding-bottom:9px}.contact-link span{display:inline-block;margin-left:20px;transition:transform .3s}.contact-link:hover span{transform:translate(4px,-4px)}main{position:relative}.route-wrap{position:absolute;inset:-140px 0 auto;height:2100px;pointer-events:none;overflow:hidden}.route{width:100%;height:100%;overflow:visible;transform:translateX(var(--drift,0px));transition:transform .5s ease-out}.route path{fill:none;stroke-linejoin:round;stroke-linecap:round}.route-main{stroke:var(--yellow);stroke-width:35;opacity:.94}.route-ghost{stroke:var(--blue);stroke-width:1.5;transform:translate(-35px,23px)}.route-pulse{stroke:#fff;stroke-width:7;stroke-dasharray:12 3500;animation:travel 12s linear infinite}@keyframes travel{to{stroke-dashoffset:-3512}}section{position:relative}.hero{min-height:780px;min-height:calc(100svh - 109px);padding:75px 5% 55px}.eyebrow{text-transform:uppercase;font-size:12px;letter-spacing:.18em;font-weight:600;margin:0 0 35px}.hero h1{font-size:clamp(70px,10.7vw,176px);letter-spacing:-.078em;line-height:.97;font-weight:900;margin:0;position:relative;width:max-content;max-width:100%}.hero h1>span{display:block}.hero h1>span:nth-child(2){margin-left:5vw}.blue{color:var(--blue)}em{font-style:normal}.hero h1 em{display:inline-block;transform:rotate(-5deg);transform-origin:left bottom}.hero-bottom{margin-top:50px;display:flex;align-items:center;gap:85px}.hero-bottom p{font-size:clamp(18px,2vw,28px);letter-spacing:-.04em}.round-link{width:142px;height:142px;border:1px solid var(--white);border-radius:50%;display:flex;align-items:center;justify-content:center;gap:12px;font-size:15px;line-height:1.3;transform:rotate(-12deg);transition:background .3s,color .3s,transform .3s}.round-link:hover{background:var(--yellow);color:var(--ink);border-color:var(--yellow);transform:rotate(0deg)}.arrow{font-size:32px}.scroll-note{font-size:12px;letter-spacing:.08em;display:inline-flex;gap:25px;margin-top:60px}.orbit-label{position:absolute;right:3%;top:45%;writing-mode:vertical-rl;font-size:12px;letter-spacing:.13em}.direction{min-height:600px;padding:115px 11% 165px}.direction h2{font-size:clamp(40px,5.6vw,90px);line-height:1.08;letter-spacing:-.065em;margin:0;max-width:1100px}.direction h2 em{font-family:Georgia,serif;font-style:italic;font-weight:400;color:var(--yellow)}.statement{font-size:20px;line-height:1.5;max-width:430px;margin:35px 0 40px auto;position:relative;background:var(--ink);padding:10px}.disciplines{font-size:clamp(20px,3.5vw,48px);display:flex;gap:25px;align-items:center;font-weight:700;transform:rotate(-4deg);width:max-content;max-width:100%}.disciplines i{font-style:normal;color:var(--blue);font-weight:400}.contact{margin-top:-40px;padding:130px 8% 85px;background:var(--blue);border-radius:50% 50% 0 0 / 90px 140px 0 0;transform:skewY(-3deg);scroll-margin-top:60px}.contact-inner{transform:skewY(3deg);max-width:1100px;margin:auto}.contact h2{font-size:clamp(48px,7.5vw,110px);letter-spacing:-.065em;line-height:1.02;margin:0 0 65px}.contact h2 em{font-family:Georgia,serif;font-style:italic;font-weight:400;color:var(--yellow)}form{max-width:820px;margin-left:auto}label{display:block;font-size:14px;line-height:1.5}input,textarea{width:100%;display:block;border:0;border-bottom:1px solid #9ab0ff;background:transparent;color:#fff;border-radius:0;padding:16px 0;font-size:20px;resize:vertical}input::placeholder,textarea::placeholder{color:#ccd6ff;opacity:1}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:45px;margin-bottom:30px}.form-bottom{display:flex;align-items:center;justify-content:space-between;gap:25px;margin-top:30px}.form-bottom p{font-size:12px;line-height:1.5}.form-bottom button{border:0;border-radius:50%;width:235px;height:78px;background:var(--yellow);color:var(--ink);display:flex;align-items:center;justify-content:center;gap:20px;cursor:pointer;transform:rotate(-5deg);transition:transform .3s}.form-bottom button:hover{transform:rotate(0deg)}button:disabled{opacity:.6;cursor:wait}#form-status{font-size:14px;min-height:21px;line-height:1.5}.trap{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}footer{display:flex;align-items:center;justify-content:space-between;padding:95px 5% 40px;gap:20px}footer .brand span{font-size:30px}footer p{font-size:13px;line-height:1.6}footer>span{font-size:12px;color:#babdbe}.js .reveal{opacity:0;transform:translateY(20px);transition:opacity .8s,transform .8s}.js .reveal.visible{opacity:1;transform:translateY(0)}.js .disciplines.visible{transform:rotate(-4deg)}@media(min-width:1700px){.hero{min-height:850px}.route-wrap{height:2400px}}@media(max-width:760px){header{padding:22px 6%}.brand span{font-size:29px}.brand img{width:37px;height:36px}.header-note{display:none}.contact-link{font-size:14px}.hero{min-height:730px;min-height:calc(100svh - 82px);padding:100px 6% 45px}.hero h1{font-size:clamp(58px,11.8vw,90px);letter-spacing:-.075em}.hero h1>span:nth-child(2){margin-left:0}.hero h1 em{transform:rotate(-4deg)}.hero-bottom{gap:20px;justify-content:space-between;margin-top:40px;align-items:flex-start}.hero-bottom p{max-width:140px;line-height:1.6;font-size:19px}.round-link{width:112px;height:112px;flex-shrink:0;font-size:12px;margin-top:40px}.orbit-label{display:none}.route-wrap{height:1750px;width:150%;left:-13%;opacity:.95}.route-main{stroke-width:22}.hero .eyebrow{font-size:11px;margin-bottom:35px}.direction{padding:100px 6% 125px;min-height:530px}.direction h2{font-size:clamp(34px,7vw,53px)}.statement{font-size:18px;margin-top:25px;max-width:310px}.disciplines{gap:12px;font-size:24px}.contact{padding:95px 6% 60px;border-radius:50% 50% 0 0 / 45px 65px 0 0}.contact h2{font-size:clamp(46px,10vw,75px);margin-bottom:45px}.form-row{grid-template-columns:1fr;gap:25px}.form-bottom{align-items:flex-start;flex-direction:column}.form-bottom button{width:220px;height:75px;align-self:flex-end}footer{padding:75px 6% 30px;flex-wrap:wrap}footer p{display:none}footer>span{font-size:11px}.scroll-note{margin-top:55px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.js .reveal{opacity:1;transform:none}.route-pulse{display:none}.route{transform:none}.js .disciplines.visible{transform:rotate(-4deg)}}
main{overflow:clip}.hero h1{text-shadow:0 0 3px var(--ink),2px 2px 0 var(--ink),-2px -2px 0 var(--ink)}.direction h2,.disciplines{text-shadow:0 0 6px var(--ink),3px 3px 0 var(--ink),-3px -3px 0 var(--ink)}

.direction h2 em{background:var(--ink);box-decoration-break:clone;-webkit-box-decoration-break:clone;padding:0 .03em}.disciplines span{background:var(--ink)}@media(max-width:760px){.disciplines{font-size:clamp(17px,5vw,23px);gap:9px}}

.route-main{opacity:.3}.route-pulse{display:none}.route-progress{fill:none;stroke:var(--yellow);stroke-width:35;stroke-linecap:round;stroke-linejoin:round}.traveller-halo{fill:var(--yellow);opacity:.22}.traveller-core{fill:var(--white);stroke:var(--ink);stroke-width:4}.route-traveller{filter:drop-shadow(0 0 12px var(--yellow))}@media(max-width:760px){.route-progress{stroke-width:22}}@media(prefers-reduced-motion:reduce){.route-main{opacity:.94}.route-progress,.route-traveller{display:none}}
/* YODEL: a playable demonstration of Trailside's creative approach. */
.yodel-nav{transition:color .2s}.yodel-nav:hover{color:var(--yellow)}.yodel-nav span{margin-left:9px;color:var(--yellow)}.yodel-detour{display:inline-flex;align-items:center;gap:13px;margin-top:34px;margin-right:36px;font-size:11px;line-height:1.5;color:#b5b9ba}.yodel-detour strong{display:block;color:var(--white);font-size:13px;font-weight:500}.detour-icon{display:grid;place-items:center;width:37px;height:37px;border:1px solid #626866;border-radius:50%;font-size:21px;color:var(--yellow);transition:transform .3s,border-color .3s}.yodel-detour:hover .detour-icon{transform:rotate(45deg);border-color:var(--yellow)}.yodel-invitation{display:grid;grid-template-columns:1fr 1.16fr;align-items:center;gap:6%;padding:60px 7% 155px;min-height:730px;isolation:isolate}.yodel-scene{position:relative;min-width:0;height:540px;overflow:hidden;border-radius:49% 40% 50% 20% / 33% 51% 38% 54%;background:var(--blue);transform:rotate(-4deg)}.yodel-scene:before{content:'';position:absolute;width:220px;height:220px;background:var(--yellow);border-radius:50%;top:60px;right:-100px;opacity:.98}.yodel-switchback{position:absolute;inset:0;width:100%;height:100%;overflow:visible;transform:rotate(4deg)}.switchback-shadow,.switchback-line,.switchback-dash{fill:none;stroke-linecap:round;stroke-linejoin:round}.switchback-shadow{stroke:#080c45;stroke-width:38;opacity:.18;transform:translate(0,8px)}.switchback-line{stroke:var(--yellow);stroke-width:28}.switchback-dash{stroke:white;stroke-width:6;stroke-dasharray:16 1500;animation:yodel-route-flow 9s linear infinite}@keyframes yodel-route-flow{to{stroke-dashoffset:-1516}}.yodel-home-character{position:absolute;width:104%;height:auto;max-height:470px;object-fit:contain;bottom:45px;left:-3%;transform:rotate(4deg);filter:drop-shadow(8px 14px 8px #00000022)}.scene-label{position:absolute;top:37px;left:70px;font-size:9px;font-weight:700;letter-spacing:1.8px;transform:rotate(4deg)}.scene-stamp{position:absolute;bottom:27px;left:70px;font-size:27px;font-weight:900;letter-spacing:-1px;transform:rotate(4deg)}.scene-stamp span{margin-left:12px;color:var(--yellow)}.yodel-copy{position:relative;z-index:1;min-width:0}.yodel-copy h2{font-size:clamp(42px,5vw,80px);line-height:1.05;letter-spacing:-.065em;margin:0;text-shadow:0 0 6px var(--ink),3px 3px 0 var(--ink)}.yodel-copy h2 em{font-family:Georgia,serif;font-style:italic;font-weight:400;color:var(--yellow)}.yodel-copy>p:not(.eyebrow){font-size:18px;line-height:1.55;max-width:430px;margin:27px 0;color:#c9cccd}.engagement-route{display:flex;align-items:center;gap:10px;font-size:11px;color:#d3d6d7;flex-wrap:wrap;margin:25px 0}.engagement-route i{font-style:normal;color:var(--yellow);font-size:18px}.yodel-play-link{display:flex;align-items:center;justify-content:space-between;gap:25px;width:270px;max-width:100%;min-height:69px;background:var(--yellow);color:var(--ink);padding:18px 26px;border-radius:48% 48% 45% 42% / 14px 21px 16px 24px;transform:rotate(-3deg);font-size:18px;font-weight:700;transition:transform .2s}.yodel-play-link:hover{transform:rotate(0) translateY(-3px)}.yodel-play-link>span:last-child{font-size:30px}.yodel-copy>small{display:block;font-size:10px;color:#b5b9ba;margin-top:16px}.yodel-copy>.yodel-team-line{font-size:13px!important;line-height:1.65!important;margin:30px 0 0!important}.yodel-team-line a{color:var(--white);border-bottom:1px solid #565e60;padding-bottom:4px}.yodel-team-line a span{color:var(--yellow);margin-left:6px}.yodel-return{font-size:15px;line-height:1.5;color:var(--yellow);max-width:500px;margin:-35px 0 40px}.yodel-return[hidden]{display:none}
@media(min-width:1700px){.yodel-invitation{padding-left:11%;padding-right:11%}.yodel-scene{height:610px}.yodel-home-character{max-height:530px}}
@media(max-width:1000px) and (min-width:761px){.yodel-invitation{padding-left:6%;padding-right:6%;gap:5%}.yodel-scene{height:440px}.yodel-home-character{bottom:48px}.scene-label{left:43px;font-size:8px}.scene-stamp{left:43px}.yodel-copy>p:not(.eyebrow){font-size:16px}}
@media(max-width:760px){.yodel-detour{display:flex;margin-top:25px;margin-right:0;width:max-content;max-width:100%}.hero .scroll-note{margin-top:25px}.yodel-invitation{display:flex;flex-direction:column;align-items:stretch;padding:25px 6% 125px;gap:36px;min-height:0}.yodel-scene{height:390px;max-width:420px;width:100%;align-self:center}.yodel-home-character{height:325px;width:100%;max-height:none;bottom:34px;left:0}.scene-label{left:51px;top:28px;font-size:8px}.scene-stamp{left:50px;bottom:18px;font-size:25px}.yodel-scene:before{width:160px;height:160px;top:40px;right:-70px}.yodel-copy h2{font-size:clamp(42px,10.5vw,64px)}.yodel-copy .eyebrow{margin-bottom:24px}.yodel-copy>p:not(.eyebrow){font-size:17px;max-width:440px;margin:24px 0}.yodel-play-link{width:260px}.yodel-return{margin:-20px 0 30px;font-size:14px}}
.yodel-actions{display:flex;align-items:center;gap:18px;flex-wrap:wrap}.yodel-voice{display:flex;align-items:center;gap:8px;background:transparent;color:var(--white);border:0;padding:10px 0;cursor:pointer;font-size:11px;min-width:105px}.yodel-voice>span:first-child{display:grid;place-items:center;width:33px;height:33px;border:1px solid #697174;border-radius:50%;color:var(--yellow);font-size:18px}.yodel-voice[aria-pressed=true]>span:first-child{background:var(--yellow);color:var(--ink);border-color:var(--yellow)}.yodel-home-character.calling{animation:yodel-breath 1.2s ease-in-out infinite}@keyframes yodel-breath{50%{transform:rotate(4deg) scaleY(1.015)}}

/* Trailside signature type: expressive headings, clear text, Alpine accents. */
body{font-family:'Bricolage Grotesque',Arial,Helvetica,sans-serif;font-optical-sizing:auto;font-kerning:normal;letter-spacing:normal}
.brand span{font-family:Arial,Helvetica,sans-serif}
.hero h1{font-weight:800;letter-spacing:-.035em;word-spacing:.025em;line-height:1.04}
.direction h2,.contact h2,.yodel-copy h2{font-weight:800;letter-spacing:-.03em;word-spacing:.025em;line-height:1.12}
.direction h2 em,.contact h2 em,.yodel-copy h2 em{font-family:'Fraunces',Georgia,serif;font-weight:600;font-style:italic;letter-spacing:-.015em}
.hero-bottom p{letter-spacing:-.015em;line-height:1.45}
.scene-stamp{font-weight:800;letter-spacing:-.025em}
.contact-link,.yodel-nav,.yodel-play-link,.form-bottom button{line-height:1.35}
input,textarea{line-height:1.5}
@media(max-width:760px){.hero h1{font-size:clamp(44px,11.4vw,88px);letter-spacing:-.03em}.direction h2{font-size:clamp(32px,7vw,53px)}.contact h2{font-size:clamp(42px,9.8vw,75px)}.yodel-copy h2{font-size:clamp(38px,10vw,64px)}}

/* Vector arrows do not depend on operating-system fallback fonts. */
.trail-icon{display:inline-block;width:1em;height:1em;vertical-align:-.15em;flex-shrink:0;overflow:visible}
