/* A single illustrated destination rail, using the established ブロ猫の旅 tokens. */
.region-quicklinks{background:var(--paper);border-top:1px solid var(--line);padding:24px 0 27px;isolation:isolate}
.region-quicklinks-wrap{max-width:1440px;margin-inline:auto;padding-inline:var(--gutter)}
.region-quicklinks-heading{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-bottom:10px}
.region-quicklinks-heading h2{font-size:20px;line-height:1.6;font-weight:800;letter-spacing:.015em;color:var(--ink);margin:0}
.region-quicklinks-hint{display:none;font-size:12px;line-height:1.8;color:var(--muted);margin:0;white-space:nowrap}
.region-quicklinks-list{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:18px;list-style:none;padding:0;margin:0}
.region-quicklinks-item{min-width:0}
.region-quicklink{--region-wash:#e4eef2;--region-tilt:-3deg;display:flex;flex-direction:column;align-items:center;position:relative;gap:5px;min-height:220px;padding:8px 6px 10px;text-align:center;border-radius:14px;color:var(--ink);text-decoration:none}
.region-quicklink--hokkaido{--region-wash:#dfedf5;--region-tilt:-4deg}
.region-quicklink--tokyo{--region-wash:#f7ddd7;--region-tilt:4deg}
.region-quicklink--kansai{--region-wash:#e8e1f0;--region-tilt:-3deg}
.region-quicklink--kyushu{--region-wash:#f4e5c9;--region-tilt:3deg}
.region-quicklink--okinawa{--region-wash:#d7eee7;--region-tilt:-4deg}
.region-portrait{position:relative;isolation:isolate;display:grid;place-items:center;flex:none;width:170px;max-width:100%;height:170px;transition:transform .24s ease;transform-origin:50% 85%}
.region-portrait:before{content:"";position:absolute;inset:23px 7px 3px;background:var(--region-wash);border-radius:52% 48% 43% 57% / 56% 45% 55% 44%;transform:rotate(var(--region-tilt));z-index:-1;transition:transform .24s ease}
.region-portrait img{display:block;width:160px;height:160px;max-width:100%;object-fit:contain;pointer-events:none}
.region-name{display:flex;align-items:center;justify-content:center;gap:8px;font-size:18px;font-weight:800;line-height:1.6;white-space:nowrap}
.region-name svg{width:16px;height:16px;opacity:0;transform:translateX(-4px);transition:opacity .2s ease,transform .2s ease;flex:none;margin-right:-24px}
.region-feature{font-size:11px;line-height:1.8;letter-spacing:.045em;color:var(--muted)}
.region-quicklink:focus-visible{outline:2px solid var(--ink);outline-offset:3px;background:color-mix(in srgb,var(--region-wash) 22%,transparent)}
.region-quicklink:focus-visible .region-name svg{opacity:1;transform:none}
@media(hover:hover) and (pointer:fine){.region-quicklink:hover .region-portrait{transform:translateY(-5px) rotate(-2deg)}.region-quicklink:hover .region-portrait:before{transform:rotate(calc(var(--region-tilt) * -1)) scale(1.025)}.region-quicklink:hover .region-name svg{opacity:1;transform:none}}
@media(max-width:1100px){.region-quicklinks-list{gap:10px}.region-portrait{width:148px;height:153px}.region-portrait img{width:145px;height:145px}.region-name{font-size:17px}.region-quicklink{min-height:204px}}
@media(max-width:760px){.region-quicklinks{padding:22px 0 20px}.region-quicklinks-wrap{padding-inline:0}.region-quicklinks-heading{padding-inline:var(--gutter);margin-bottom:10px;align-items:flex-start;flex-direction:column;gap:3px}.region-quicklinks-heading h2{font-size:18px;line-height:1.6}.region-quicklinks-hint{display:block}.region-quicklinks-list{display:flex;gap:12px;overflow-x:auto;overflow-y:hidden;padding:7px var(--gutter) 9px;scroll-padding-inline:var(--gutter);scroll-snap-type:x proximity;overscroll-behavior-inline:contain;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:var(--line) transparent}.region-quicklinks-list::-webkit-scrollbar{height:3px}.region-quicklinks-list::-webkit-scrollbar-thumb{background:var(--line);border-radius:3px}.region-quicklinks-item{flex:0 0 145px;scroll-snap-align:start}.region-quicklink{min-height:198px;padding:5px 4px 9px;gap:4px}.region-portrait{width:137px;height:145px}.region-portrait img{width:137px;height:137px}.region-portrait:before{inset:22px 5px 3px}.region-name{font-size:16px;gap:5px}.region-name svg{width:14px;height:14px;margin-right:-19px}.region-feature{font-size:12px}}
html.motion-off .region-portrait,html.motion-off .region-portrait:before,html.motion-off .region-name svg{transition:none!important;transform:none!important}
@media(prefers-reduced-motion:reduce){.region-portrait,.region-portrait:before,.region-name svg{transition:none!important;transform:none!important}.region-quicklinks-list{scroll-behavior:auto}}
