/* Riverside / a continuous road, a pocketful of notes, and a light left on. */
body { text-rendering:optimizeLegibility; }
.hero-scene { overflow:hidden; }
.hero-copy,.odometer-control,.mile-note,.road-caption { z-index:2; }
.hero-glass { position:absolute; inset:0; z-index:1; pointer-events:none; opacity:0; background:radial-gradient(ellipse 340px 240px at var(--light-x,30%) var(--light-y,38%),#fff5d55e,transparent 74%); mix-blend-mode:soft-light; transition:opacity .6s; }
.hero-scene.has-light .hero-glass { opacity:1; }
.hero-road-light { position:absolute; inset:0; width:100%; height:100%; z-index:1; pointer-events:none; opacity:var(--road-light,0); }
.hero-road-light .lane-ink { stroke-dasharray:13 28; stroke-dashoffset:var(--lane-travel,0); }
.journey-mile-tag { position:absolute; left:7%; top:70%; display:flex; align-items:center; gap:13px; color:#fff2de; border-left:1px solid #f4ddac7a; padding:3px 0 4px 13px; opacity:0; transform:translateY(7px); transition:opacity .5s,transform .8s; z-index:2; pointer-events:none; }
.journey-mile-tag.is-travelled { opacity:1; transform:none; }
.journey-mile-tag strong { font:clamp(25px,2.4vw,42px)/1 RiversideDigits,var(--sans); font-variant-numeric:tabular-nums; letter-spacing:.05em; }
.journey-mile-tag span { font:clamp(13px,1.1vw,19px)/1.2 var(--note); max-width:9ch; }
.odometer-control::after { content:""; position:absolute; inset:2% -2%; border-radius:13%; opacity:0; pointer-events:none; background:linear-gradient(108deg,transparent 15%,#fff0d419 42%,#fff0d43b 48%,transparent 62%); background-position:var(--glint-x,0%) 0; background-size:180% 100%; transition:opacity .3s; }
.odometer-control:hover::after,.odometer-control:focus-visible::after,.odometer-control.is-pressed::after { opacity:1; }
.odometer-control.is-pressed::after { background-color:#ffd4950a; }

/* A slim map at the page edge. Its car follows the reader, including on the way back. */
.journey-rail { position:fixed; right:20px; top:50%; width:24px; height:210px; transform:translateY(-50%); z-index:12; color:var(--olive); opacity:0; visibility:hidden; transition:opacity .4s,visibility .4s; }
.journey-rail.is-visible { opacity:1; visibility:visible; }
.journey-rail::before { content:""; position:absolute; left:11px; top:10px; bottom:10px; border-left:1px dashed #83764e66; }
.journey-rail a { display:block; position:absolute; left:-12px; width:48px; height:36px; top:calc(var(--stop) * 38px); }
.journey-rail a::before { content:""; position:absolute; left:21px; top:14px; width:7px; height:7px; border:1px solid var(--olive); background:var(--paper); border-radius:50%; }
.journey-rail a[aria-current]::before { background:var(--olive); }
.journey-rail a span { position:absolute; right:42px; top:7px; padding:4px 9px; background:var(--paper); color:var(--olive-dark); font:11px/1.4 var(--sans); white-space:nowrap; border:1px solid #b7a58b77; opacity:0; transform:translateX(6px); transition:opacity .2s,transform .3s; pointer-events:none; }
.journey-rail a:hover span,.journey-rail a:focus-visible span { opacity:1; transform:none; }
.journey-rail-car { position:absolute; width:20px; height:30px; left:2px; top:0; pointer-events:none; filter:drop-shadow(0 1px 1px #fff2de); }

/* Services are filed as five real photographic scenes, each with its own paper edge. */
.services { position:relative; isolation:isolate; }
.service-layout { grid-template-columns:1fr 1.04fr; gap:7%; align-items:start; }
.service-intro { position:relative; }
.service-intro .service-mark { position:absolute; top:125px; right:8px; margin:0; opacity:.4; }
.service-intro .service-mark svg { width:64px; height:64px; }
.service-intro .hand-note { margin:20px 0 15px; }
.service-intro>.text-link { font-size:18px; }
.service-visual { position:relative; margin:38px 10px 12px 0; padding:11px 11px 18px; background:#fff6e7; border:1px solid #c4b29377; box-shadow:4px 6px 0 #c7b79844,9px 13px 24px #573d2418; transform:rotate(-2deg); transform-origin:50% 80%; isolation:isolate; }
.service-visual::before,.service-visual::after { content:""; position:absolute; inset:3px; background:#f4ebd9; border:1px solid #c6b89a77; z-index:-1; transform:rotate(3deg) translate(4px,2px); }
.service-visual::after { transform:rotate(-3deg) translate(-3px,4px); background:#e5d8bc; }
.service-visual .file-tab { position:absolute; left:25px; top:-15px; z-index:3; padding:6px 15px 5px; background:var(--olive); color:var(--pale); font:9px/1.5 var(--sans); letter-spacing:.15em; transform:rotate(-2deg); }
.service-photo-window { width:100%; aspect-ratio:4/3; position:relative; overflow:hidden; background:#d7c8ac; }
.service-photo-face { width:100%; height:100%; }
.service-photo-face img { width:100%; height:100%; object-fit:cover; transform:scale(1.035) translate(var(--photo-x,0px),var(--photo-y,0px)); transition:transform .5s ease-out; }
.service-photo-window::after { content:""; position:absolute; inset:0; pointer-events:none; opacity:0; background:linear-gradient(115deg,transparent 15%,#fff9e04a 44%,transparent 69%); transform:translateX(var(--shine-x,0px)); mix-blend-mode:soft-light; transition:opacity .4s; }
.service-visual:hover .service-photo-window::after { opacity:1; }
.service-visual figcaption { display:flex; gap:15px; align-items:center; justify-content:space-between; padding:15px 4px 0; }
.service-visual figcaption strong { font:27px/1.1 var(--note); color:var(--olive); }
.service-visual figcaption span { font:10px var(--sans); color:var(--muted); letter-spacing:.1em; }
.service-image-status { position:absolute; inset:0; display:grid; place-items:center; padding:25px; font:13px/1.5 var(--sans); color:var(--olive-dark); background:#efe2ca; text-align:center; }
.service-image-status:empty { display:none; }
.service-row { position:relative; }
.service-row[open] { background:#fff6e522; }
.service-row summary { position:relative; min-height:78px; padding-left:10px; padding-right:10px; transition:background .3s,color .3s; }
.service-row summary:hover { background:#fff6e555; }
.service-row[open] summary::before { content:""; position:absolute; left:-15px; top:50%; height:30px; width:4px; background:var(--olive); transform:translateY(-50%) rotate(-4deg); }
.service-row[open] summary .service-no { color:var(--olive-dark); }
.service-detail { padding-left:55px; }
.service-questions { margin:17px 0 0; padding:14px 0 0; border-top:1px dashed #a99e8280; }
.service-questions span { display:block; font:10px/1.4 var(--sans); color:var(--olive); letter-spacing:.13em; margin-bottom:7px; }
.service-questions ul { margin:0; padding-left:17px; font:14px/1.6 var(--serif); color:var(--ink); }
.service-detail button { min-height:44px; }
.service-visual .service-photo-closer { position:absolute; bottom:12px; right:12px; z-index:2; display:grid; place-items:center; width:44px; height:44px; min-height:44px; padding:0; margin:0; border:1px solid #fff2deaa; border-radius:50%; background:#f3e7d5df; color:var(--olive-dark); transition:transform .3s,background .3s; }
.service-photo-closer:hover { transform:rotate(8deg); background:var(--pale); }
.service-photo-closer svg { width:20px; height:20px; }
.service-visual.is-close .service-photo-face img { transform:scale(1.4) translate(var(--photo-x,0px),var(--photo-y,0px)); }

/* A folded route card translates a future journey into a useful first conversation. */
.roadbook { background:var(--paper); padding:84px 0 72px; position:relative; }
.roadbook .section-wrap { position:relative; }
.roadbook-heading { display:flex; align-items:end; justify-content:space-between; gap:45px; margin-bottom:38px; }
.roadbook-heading .eyebrow { color:var(--olive); margin-bottom:20px; }
.roadbook-heading h2 { font-size:clamp(48px,5vw,76px); max-width:720px; }
.roadbook-heading>p { max-width:245px; font:20px/1.55 var(--note); color:var(--muted); transform:rotate(-3deg); padding-bottom:7px; }
.roadbook-body { display:grid; grid-template-columns:1.28fr 1fr; min-height:420px; background:#ebe1cb; border:1px solid #baa88b; box-shadow:0 9px 0 -4px #d6c8ab,0 17px 25px #503c1810; transform:rotate(.3deg); }
.route-sheet { position:relative; min-width:0; overflow:hidden; background-color:#f6eddc; background-image:linear-gradient(90deg,transparent 33.1%,#82755014 33.3%,#fff9ed 33.55%,transparent 34%,transparent 66.2%,#82755014 66.4%,#fff9ed 66.65%,transparent 67%); }
.route-sheet::after { content:""; position:absolute; inset:0; pointer-events:none; background:radial-gradient(ellipse 230px 160px at var(--map-x,45%) var(--map-y,55%),#fffef544,transparent 90%); }
.route-sheet svg { display:block; width:100%; height:100%; position:absolute; inset:0; }
.route-sheet-title { position:absolute; left:24px; top:21px; font:10px var(--sans); letter-spacing:.14em; color:var(--olive); z-index:1; }
.route-sheet-note { position:absolute; bottom:20px; left:27px; font:21px var(--note); color:var(--olive); transform:rotate(-4deg); }
.route-sheet-code { position:absolute; bottom:21px; right:22px; font:9px var(--sans); color:var(--muted); letter-spacing:.12em; }
.route-trip-ink { stroke-dasharray:9 11; }
.route-car { color:var(--olive-dark); filter:drop-shadow(1px 2px 1px #64562e33); }
.route-car.is-travelling .route-car-body { animation:route-suspension .35s linear infinite; }
.roadbook-note { position:relative; padding:30px 32px; border-left:1px dashed #9d8e7055; display:flex; flex-direction:column; }
.trip-tabs { display:flex; gap:6px; margin:-45px -7px 30px; position:relative; z-index:2; }
.trip-tabs button { flex:1; padding:12px 10px; min-height:56px; border:1px solid #ab9b7c; background:#e2d5b8; font:13px/1.2 var(--note); text-align:center; box-shadow:0 3px 0 #b5a38433; transition:transform .35s,background .35s; transform:rotate(-1deg); }
.trip-tabs button:nth-child(2) { transform:rotate(1deg); }
.trip-tabs button[aria-pressed=true] { background:var(--olive); color:var(--pale); border-color:var(--olive); transform:translateY(-6px) rotate(-2deg); }
.trip-tabs button:hover { transform:translateY(-4px); }
.trip-panel { flex:1; }
.trip-panel h3 { font:36px/.98 var(--display); color:var(--olive); letter-spacing:-.02em; margin:2px 0 16px; }
.trip-panel p { font:15px/1.55 var(--serif); }
.trip-panel ul { padding:0; margin:20px 0 25px; list-style:none; }
.trip-panel li { position:relative; padding:9px 0 9px 24px; border-bottom:1px solid #ab9b7c44; font:14px/1.4 var(--serif); }
.trip-panel li::before { content:""; width:9px; height:9px; border:1px solid var(--olive); position:absolute; left:2px; top:14px; transform:rotate(-4deg); }
.roadbook-note .text-link { font-size:21px; max-width:max-content; margin-top:auto; }
.roadbook-smallprint { font:11px/1.5 var(--sans); color:var(--muted); padding:18px 6px 0; }
.route-map-label { font-family:Georgia,serif; fill:#657044; font-style:italic; }

/* First visit keepsakes and the questions that make a visit easier. */
.first-visit { border-top:1px solid #b7a58b66; }
.bring-list button { display:flex; align-items:center; gap:8px; font:inherit; padding:8px 10px 8px 0; text-align:left; min-height:44px; border-bottom:1px dashed #b7a58b77; transition:color .3s; }
.bring-list button[aria-pressed=true] { color:var(--olive); border-bottom-style:solid; }
.bring-list button .bring-tick { width:14px; height:14px; border:1px solid #a79a7c; display:grid; place-items:center; flex:none; transform:rotate(-5deg); }
.bring-list button .bring-tick::after { content:""; width:8px; height:4px; border-left:1.5px solid var(--olive); border-bottom:1.5px solid var(--olive); transform:rotate(-45deg) scale(0); transition:transform .3s cubic-bezier(.2,1.5,.4,1); }
.bring-list button[aria-pressed=true] .bring-tick::after { transform:rotate(-45deg) scale(1); }
.visit-questions { margin-top:30px; border-top:1px solid var(--line); }
.visit-questions details { border-bottom:1px solid #b7a58b77; }
.visit-questions summary { display:flex; gap:18px; align-items:center; justify-content:space-between; min-height:53px; list-style:none; font:19px/1.2 var(--note); color:var(--olive-dark); cursor:pointer; padding:13px 0; }
.visit-questions summary::-webkit-details-marker { display:none; }
.visit-questions summary::after { content:"+"; font:22px var(--note); transform:rotate(0); transition:transform .3s; }
.visit-questions details[open] summary::after { transform:rotate(45deg); }
.visit-questions p { font:14px/1.6 var(--serif); color:var(--muted); padding:0 20px 18px 0; }
.workshop-photo { position:relative; }
.notebook-photo-stack::after { content:""; position:absolute; inset:0; pointer-events:none; z-index:1; opacity:0; background:radial-gradient(ellipse at var(--photo-light-x,50%) var(--photo-light-y,40%),#fff8d73b,transparent 70%); mix-blend-mode:soft-light; transition:opacity .45s; }
.workshop-photo:hover .notebook-photo-stack::after { opacity:1; }
.notebook { --paper-light:50%; }
.notebook::after { content:""; position:absolute; inset:0; pointer-events:none; opacity:0; background:linear-gradient(100deg,transparent,#fffbed40,transparent); background-size:200% 100%; background-position:var(--paper-light) 0; transition:opacity .5s; }
.notebook:hover::after { opacity:1; }
.shop-sketch { position:relative; }
.shop-lights { pointer-events:none; position:absolute; inset:0; width:100%; height:100%; opacity:0; mix-blend-mode:screen; transition:opacity .8s; }
.shop-lights.is-on { opacity:.84; }
.shop-light-switch { display:flex; align-items:center; gap:10px; margin:20px auto 0; min-height:44px; padding:9px 16px; border:1px solid #a7977377; background:#f8edd9; box-shadow:3px 3px 0 #baa88b22; font:18px var(--note); color:var(--olive); transform:rotate(-2deg); transition:transform .3s,background .3s; }
.shop-light-switch:hover { transform:rotate(0); }
.shop-light-switch svg { width:21px; height:26px; flex:none; }
.shop-light-switch[aria-pressed=true] { background:#f7dfad; }
.shop-light-switch[aria-pressed=true] .switch-bulb { fill:#d9a448; }
.final-circle { position:relative; isolation:isolate; }
.final-circle::after { content:""; position:absolute; inset:-8px; border:1px dashed #7b814c99; border-radius:50%; transition:transform 1.3s cubic-bezier(.2,.7,.1,1); }
.final-circle:hover::after,.final-circle:focus-visible::after { transform:rotate(110deg); }
.final-invite { position:relative; overflow:hidden; }
.final-road-car { position:absolute; width:83px; height:41px; left:-100px; bottom:6px; pointer-events:none; color:var(--olive); opacity:.68; }
.final-road-car svg { display:block; width:100%; height:100%; }
.footer-mile-count { display:flex; gap:8px; align-items:center; font:11px var(--sans); }
.footer-mile-count strong { font:18px RiversideDigits,var(--sans); letter-spacing:.08em; }
.journey-pressed .wordmark-car { filter:drop-shadow(0 0 3px #d0b269); }

@keyframes route-suspension { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-.7px)} }
@media(hover:hover) and (pointer:fine) {
 html.key-cursor,html.key-cursor body,html.key-cursor a,html.key-cursor button,html.key-cursor summary,html.key-cursor label,html.key-cursor input[type=checkbox],html.key-cursor input[type=radio] { cursor:url("assets/riverside-key.svg") 3 3,auto; }
 html.key-cursor input:not([type=checkbox]):not([type=radio]):not([type=button]):not([type=submit]),html.key-cursor textarea,html.key-cursor [contenteditable],html.key-cursor .visit-summary { cursor:text; }
 html.key-cursor button:disabled { cursor:wait; }
}
@media(max-width:1250px) { .journey-rail{display:none} .roadbook-body{grid-template-columns:1.05fr 1fr}.roadbook-note{padding:28px 25px}.trip-tabs button{font-size:12px}.trip-panel h3{font-size:32px} }
@media(max-width:1000px) { .service-layout{gap:5%}.service-intro .service-mark{display:none}.service-visual figcaption strong{font-size:23px}.service-visual{margin-top:32px}.service-detail{padding-left:42px}.roadbook-heading{gap:30px}.roadbook-heading>p{font-size:18px;max-width:190px}.roadbook-note{padding:28px 23px}.trip-tabs{margin-left:-12px;margin-right:-12px;gap:4px}.trip-panel h3{font-size:30px}.trip-panel li{font-size:13px}.roadbook-note .text-link{font-size:19px} }
@media(max-width:800px) { .roadbook{padding:58px 0 55px}.roadbook-heading{display:block;margin-bottom:38px}.roadbook-heading>p{max-width:440px;transform:none;margin-top:20px;padding:0;font-size:18px}.roadbook-body{grid-template-columns:1fr;transform:none}.route-sheet{height:330px}.roadbook-note{border-left:0;border-top:1px dashed #ab9b7c66;padding:28px}.trip-tabs{margin:0 0 25px;gap:10px}.trip-tabs button{font-size:17px;min-height:53px}.trip-panel h3{font-size:35px}.trip-panel ul{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.trip-panel li{border-bottom:0;font-size:14px}.roadbook-note .text-link{font-size:22px}.trip-panel p{max-width:560px}.roadbook-heading h2{font-size:51px} }
@media(max-width:580px) {
 .hero-road-light{top:var(--hero-intro-height);height:100cqw;width:100cqw;inset-inline:0;bottom:auto}
 .hero-glass{top:var(--hero-intro-height);height:100cqw;bottom:auto}
 .journey-mile-tag{display:none}
 .journey-mile-tag strong{font-size:25px}.journey-mile-tag span{font-size:12px;max-width:12ch}
 .service-layout{display:block}.service-intro{margin-bottom:26px}.service-intro .hand-note{margin:22px 0 15px}.service-visual{transform:rotate(-1deg);width:100%;margin:14px 0 22px;padding:8px 8px 14px;box-shadow:3px 4px 0 #c7b79844,6px 9px 17px #573d2410}.service-visual figcaption{padding:11px 4px 0}.service-visual figcaption strong{font-size:25px}.service-visual .file-tab{top:-13px;left:20px;font-size:8px}.service-row summary{min-height:77px;padding-left:4px;padding-right:5px}.service-detail{padding-left:38px;padding-right:7px}.service-detail>.service-visual{margin-left:-34px;width:calc(100% + 34px)}.service-row[open] summary::before{left:-10px;height:25px}.service-questions{margin-top:13px}.service-questions li{font-size:14px}.service-image-status{font-size:12px}.service-footnote{margin-left:38px}.service-photo-closer{width:40px;height:40px;bottom:9px;right:9px}
 .roadbook{padding:50px 0 48px}.roadbook-heading{margin-bottom:27px}.roadbook-heading .eyebrow{font-size:9px;margin-bottom:20px}.roadbook-heading h2{font-size:49px}.roadbook-heading>p{font-size:17px;max-width:300px}.route-sheet{height:270px}.route-sheet-title{left:17px;top:17px;font-size:8px}.route-sheet-note{left:18px;bottom:16px;font-size:19px}.route-sheet-code{right:13px;font-size:8px;bottom:18px}.roadbook-note{padding:21px 19px 25px}.trip-tabs{gap:6px;margin-bottom:22px}.trip-tabs button{font-size:15px;padding:11px 5px;min-height:54px}.trip-panel h3{font-size:35px}.trip-panel p{font-size:15px}.trip-panel ul{display:block;margin:16px 0 22px}.trip-panel li{padding:9px 0 9px 24px;border-bottom:1px solid #ab9b7c44}.roadbook-note .text-link{font-size:21px}.roadbook-smallprint{font-size:10px;padding:15px 1px 0}.bring-list{gap:7px 14px}.bring-list button{padding-right:4px;gap:6px}.visit-questions{margin-top:23px}.visit-questions summary{font-size:19px}.visit-questions p{font-size:14px}.shop-light-switch{margin-top:15px;font-size:18px}.footer-mile-count{font-size:10px}.footer-mile-count strong{font-size:17px}.final-road-car{width:66px}
}
@media(max-width:390px) { .route-sheet-code{display:none}.roadbook-heading h2{font-size:43px}.trip-tabs{gap:5px}.trip-tabs button{font-size:14px}.roadbook-note{padding-left:16px;padding-right:16px}.trip-panel h3{font-size:32px}.roadbook-note .text-link{font-size:19px}.route-sheet{height:245px}.service-visual figcaption strong{font-size:23px}.bring-list button{font-size:10px;gap:5px}.bring-list button>span[data-icon]{display:none} }
.reduce-motion .hero-road-light,.reduce-motion .hero-glass,.reduce-motion .odometer-control::after,.reduce-motion .final-road-car { display:none!important; }
.reduce-motion .service-photo-face img { transform:none!important; transition:none; }
.reduce-motion .service-visual.is-close .service-photo-face img { transform:scale(1.4)!important; }
.reduce-motion .route-car.is-travelling .route-car-body { animation:none!important; }
.reduce-motion .notebook::after,.reduce-motion .notebook-photo-stack::after,.reduce-motion .service-photo-window::after { display:none; }
@media print { .journey-rail,.hero-glass,.hero-road-light,.journey-mile-tag,.shop-light-switch,.final-road-car{display:none!important} }
@media(forced-colors:active) { .hero-glass,.hero-road-light{display:none}.trip-tabs button[aria-pressed=true]{outline:3px solid Highlight}.service-row[open] summary{outline:2px solid Highlight}.bring-list button[aria-pressed=true]{outline:1px solid Highlight} }