/* Eat the Map · goeatthemap.com */
@font-face{font-family:'Fraunces';src:url('../fonts/fraunces.woff') format('woff');font-weight:600 900;font-style:normal;font-display:swap}
@font-face{font-family:'DM Sans';src:url('../fonts/dmsans.woff') format('woff');font-weight:400 700;font-style:normal;font-display:swap}
@font-face{font-family:'Caveat';src:url('../fonts/caveat.woff') format('woff');font-weight:600 700;font-style:normal;font-display:swap}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:#FBF3E4;color:#1A2140;font-family:'DM Sans',system-ui,sans-serif}
img{max-width:100%}
[hidden]{display:none!important}
.skip{position:absolute;left:-9999px;top:8px;z-index:10;background:#1A2140;color:#fff;padding:10px 14px;border-radius:8px}
.skip:focus{left:8px}
a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid #FF7A66;outline-offset:2px}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}}
.d{font-family:'Fraunces',serif;font-weight:900;font-variation-settings:'SOFT' 100;letter-spacing:-0.01em}
.lab{font-family:'DM Sans',sans-serif;font-weight:700;font-size:12px;letter-spacing:0.12em;text-transform:uppercase}
.hand{font-family:'Caveat',cursive;font-weight:700}
a{color:inherit;text-decoration:none}a:hover{text-decoration:underline}
.camel{animation:camelbob 0.9s ease-in-out infinite alternate;transform-box:fill-box;transform-origin:center bottom}
@keyframes camelbob{from{transform:translateY(0) rotate(-1.5deg)}to{transform:translateY(-2.5px) rotate(1.5deg)}}
@media (prefers-reduced-motion: reduce){.camel{animation:none}}
.stops{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;max-width:940px;margin-left:auto;margin-right:auto}
.stops>button{flex:0 0 calc((100% - 48px) / 7);white-space:nowrap}
@media (max-width: 900px){.stops{flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;padding-bottom:6px}.stops>button{flex:0 0 auto;min-height:44px;padding:0 14px}}
@media (max-width: 700px){
.route-map{overflow-x:auto;-webkit-overflow-scrolling:touch;padding:3px;margin:-3px}
.route-canvas{min-width:660px}
.route-map::after{content:'Swipe the map →';display:block;font-size:13px;font-weight:700;color:#8A4A00;margin-top:10px;position:sticky;left:0}
}

/* ---------- Phone layout ---------- */
.stop-sub,.stop-chev,.zoom-hint{display:none}
.zoom{display:block}
@media (max-width: 700px){
/* nav + small links: full-size tap targets */
nav a{min-height:44px;display:inline-flex!important;align-items:center}
.signup a,main a[href^="mailto"]{display:inline-block;padding:12px 2px;margin:-12px -2px}

/* hero: photo on top, card below */
.hero{background-image:none!important;background-color:#FBF3E4!important}
.hero::before{content:'';display:block;aspect-ratio:3/2;background:#A8A29A url('../images/mustang-hillside.jpg') center 80%/cover no-repeat}
.hero-wrap{padding:0!important}
.hero-card{max-width:none!important;border-radius:0!important;padding:24px 16px 32px!important}
.hero-credit{top:calc(100vw * 2 / 3 - 26px);bottom:auto!important;right:12px!important;font-size:11px!important}

/* route: whole map as a picture, no swiping */
.route-map{overflow:visible!important;padding:0!important;margin:0!important}
.route-canvas{min-width:0!important;border-radius:16px!important}
.route-map::after{content:none!important;display:none!important}
.route-canvas button[data-stop]{width:24px!important;height:30px!important}
.route-canvas button[data-stop] svg{width:100%;height:100%}

/* route: the 13 stops as a native-feeling list; the card opens under the tapped stop */
.stops{display:flex!important;flex-direction:column;flex-wrap:nowrap!important;overflow:hidden!important;max-width:none!important;gap:0!important;margin-top:20px!important;padding:0!important;background:#FFFFFF;border-radius:18px;box-shadow:0 0 0 2px #1A2140}
.stops>button{flex:none!important;width:100%;min-height:58px!important;display:flex!important;align-items:center;gap:12px;padding:8px 16px!important;border:0!important;border-radius:0!important;border-top:1px solid #EFE6D3!important;background:#FFFFFF!important;color:#1A2140!important;font:700 17px 'DM Sans',sans-serif!important;text-align:left;-webkit-tap-highlight-color:transparent}
.stops>button:first-child{border-top:0!important}
.stops>button b{display:inline-flex;flex:0 0 34px;width:34px;height:34px;border-radius:50%;align-items:center;justify-content:center;background:var(--c);border:2px solid var(--l);color:#1A2140;font-size:14px}
.stops>button .stop-sub{display:block;margin-left:auto;font-weight:400;font-size:15px;color:#4A5070}
.stops>button .stop-chev{display:block;flex:0 0 10px;width:10px;height:10px;border-right:2.5px solid currentColor;border-bottom:2.5px solid currentColor;transform:rotate(-45deg);margin-left:4px;transition:transform .2s}
.stops>button[aria-pressed="true"]{background:#1A2140!important;color:#FFFFFF!important}
.stops>button[aria-pressed="true"] .stop-sub{color:#C9CEE3}
.stops>button[aria-pressed="true"][aria-expanded="true"] .stop-chev{transform:rotate(45deg)}
.stops [data-route-card]{flex:none!important;border-radius:0!important;padding:20px 16px 22px!important;background:#FFF9EF!important;border-top:1px solid #EFE6D3}

/* sample spread opens full size */
.zoom-hint{display:inline;font-weight:700;color:#1A2140}

/* book crew: compact two-column grid, an odd last card spans both */
.crew-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important}
.crew-grid>article{flex-direction:column!important;align-items:center!important;text-align:center;padding:18px 10px 16px!important;gap:6px!important}
.crew-grid>article svg{width:80px!important;height:auto!important}
.crew-grid>article p{display:none}
.crew-grid>article h3{font-size:22px!important}
.crew-grid>article .hand{font-size:18px!important}
.crew-grid>article:last-child:nth-child(odd){grid-column:1/-1;flex-direction:row!important;justify-content:center;text-align:left}

/* footer links: a tidy grid of real tap targets */
.foot-links{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 12px!important;width:100%}
.foot-links a{min-height:44px;display:flex;align-items:center}
.foot-links a[href^="mailto"]{grid-column:span 2}
}
