:root{--hotel-card-navy:#062b63;--hotel-card-deep:#021e46;--hotel-card-line:#dfe5ed;--hotel-card-muted:#718095;--hotel-card-soft:#f3f6f9}
.hotel-card{position:relative;min-width:0;display:flex;flex-direction:column;overflow:hidden;background:#fff;border:1px solid var(--hotel-card-line);transition:transform .25s ease,box-shadow .25s ease}.hotel-card:hover{transform:translateY(-4px);box-shadow:0 18px 42px rgba(3,34,76,.1)}
.hotel-card-visual{position:relative;aspect-ratio:1.42/1;overflow:hidden;background:var(--hotel-card-soft)}.hotel-card-visual>a{position:absolute;inset:0;display:block}.hotel-card-visual img{width:100%;height:100%;display:block;object-fit:cover;transition:transform .55s cubic-bezier(.22,.65,.3,1)}.hotel-card:hover .hotel-card-visual img{transform:scale(1.035)}.hotel-card-visual:after{content:"";position:absolute;right:0;bottom:0;left:0;height:45%;background:linear-gradient(transparent,rgba(2,30,70,.58));pointer-events:none}
.hotel-card-classification{position:absolute;z-index:1;right:16px;bottom:15px;left:16px;display:flex;align-items:end;justify-content:space-between;gap:12px;color:#fff;pointer-events:none}.hotel-card-classification span{min-width:0;overflow:hidden;font-size:10px;font-weight:600;letter-spacing:.04em;text-overflow:ellipsis;white-space:nowrap}.hotel-card-classification b{flex:0 0 auto;padding:6px 8px;background:#fff;color:var(--hotel-card-navy);font-size:8px;letter-spacing:.04em}
.hotel-card-favorite{position:absolute;z-index:2;top:14px;right:14px;width:42px;height:42px;display:grid;place-items:center;border:0;border-radius:50%;background:rgba(255,255,255,.94);color:var(--hotel-card-navy);font-size:18px;line-height:1;cursor:pointer;box-shadow:0 5px 16px rgba(2,30,70,.15);transition:.2s}.hotel-card-favorite:hover,.hotel-card-favorite.active{background:var(--hotel-card-navy);color:#fff}.hotel-card-favorite span{transform:translate(.5px,1.5px)}.hotel-card-favorite.active span{transform:none}
.hotel-card-body{position:relative;flex:1;padding:22px 21px 20px;display:flex;flex-direction:column}.hotel-card-heading>p{min-height:18px;margin:0 0 8px;display:flex;align-items:center;gap:7px}.hotel-card-heading>p>span{margin-right:auto;color:#8995a6;font-size:7px;font-weight:700;letter-spacing:.16em}.hotel-card-heading>p>b{color:var(--hotel-card-navy);font-size:11px}.hotel-card-heading>p>small{color:#7c8999;font-size:8px}.hotel-card-heading h3{margin:0;font-size:17px;line-height:1.55}.hotel-card-heading h3 a{color:#172338;text-decoration:none}.hotel-card-heading h3 a:after{content:"";position:absolute;inset:0;z-index:0}
.hotel-card-access{margin:13px 0 0;display:-webkit-box;min-height:2.8em;overflow:hidden;color:var(--hotel-card-muted);font-size:9px;line-height:1.7;-webkit-box-orient:vertical;-webkit-line-clamp:2}.hotel-card-access span{margin-right:6px;color:var(--hotel-card-navy)}
.hotel-card-tags{position:relative;z-index:1;margin-top:15px;display:flex;flex-wrap:wrap;gap:6px}.hotel-card-tags span{padding:6px 8px;background:var(--hotel-card-soft);color:#526177;font-size:8px}
.hotel-card-footer{position:relative;z-index:1;margin-top:auto!important;padding:18px 0 0!important;display:flex!important;align-items:end!important;justify-content:space-between!important;gap:12px!important;background:transparent!important;border-top:0!important;color:inherit!important}.hotel-card-footer p{margin:0}.hotel-card-footer p small{display:block;margin-bottom:3px;color:#8290a2;font-size:7px}.hotel-card-footer p b{color:var(--hotel-card-deep);font-size:19px}.hotel-card-footer>a{min-width:105px;min-height:43px;padding:0 13px;display:flex;align-items:center;justify-content:space-between;background:var(--hotel-card-navy);color:#fff;text-decoration:none}.hotel-card-footer>a span{font-size:9px;font-weight:600}.hotel-card-footer>a b{font-size:14px}
.hotel-card-remove{position:relative;z-index:1;margin-top:14px;padding:10px;border:1px solid var(--hotel-card-line);background:#fff;color:#718095;font:500 9px "DM Sans","Noto Sans JP",sans-serif;cursor:pointer}.hotel-card-remove:hover{border-color:var(--hotel-card-navy);color:var(--hotel-card-navy)}
@media(max-width:640px){.hotel-card{display:grid;grid-template-columns:42% 58%;min-height:225px}.hotel-card-visual{aspect-ratio:auto;height:100%}.hotel-card-classification{top:12px;right:auto;bottom:auto;left:10px;align-items:flex-start;flex-direction:column;gap:5px}.hotel-card-classification span,.hotel-card-classification b{max-width:115px;padding:5px 7px;background:rgba(255,255,255,.94);color:var(--hotel-card-navy);font-size:7px}.hotel-card-favorite{top:10px;right:10px;width:37px;height:37px;font-size:16px}.hotel-card-body{padding:17px 15px}.hotel-card-heading>p>span{display:none}.hotel-card-heading>p{justify-content:flex-start;margin-bottom:5px}.hotel-card-heading h3{font-size:14px}.hotel-card-access{margin-top:8px;font-size:8px}.hotel-card-tags{margin-top:9px;gap:4px}.hotel-card-tags span{padding:5px 6px;font-size:7px}.hotel-card-tags span:nth-child(n+3){display:none}.hotel-card-footer{padding-top:12px!important}.hotel-card-footer p small{display:none}.hotel-card-footer p b{font-size:15px}.hotel-card-footer>a{min-width:38px;min-height:38px;padding:0;justify-content:center}.hotel-card-footer>a span{display:none}.hotel-card-remove{margin-top:8px;padding:7px;font-size:8px}}

/* The reusable card itself opens the hotel detail page on desktop and mobile. */
.hotel-card{cursor:pointer}
.hotel-card-hitarea{position:absolute;z-index:3;inset:0;display:block}
.hotel-card-hitarea:focus-visible{outline:2px solid var(--hotel-card-navy);outline-offset:-3px}
.hotel-card-favorite{z-index:5}
.hotel-card-heading h3 a{position:relative;z-index:5}
.hotel-card-heading h3 a:after{display:none}
.hotel-card-footer{z-index:4;pointer-events:none}
.hotel-card-footer>a{position:relative;z-index:5;pointer-events:auto}
.hotel-card-remove{z-index:5}
