
:root{
    --hotel-paper:#f1efe8;
    --hotel-paper2:#e5dfd5;
    --hotel-ink:#090909;
    --hotel-red:#b72424;
    --hotel-muted:#716a62;
    --hotel-line:rgba(9,9,9,.16);
    --hotel-sand:#c7b8a3;
    --hotel-pad:clamp(22px,3vw,55px);
}

html{scroll-padding-top:0}
body.hotel-page{
    margin:0;
    overflow-x:hidden;
    background:var(--hotel-paper);
    color:var(--hotel-ink);
}
body.hotel-page .header.hidden{transform:none!important}
body.hotel-page .mega-card.is-current{background:var(--black);color:var(--paper)}
body.hotel-page .mega-card.is-current i{color:var(--accent)}
body.hotel-page .mega-card.is-current small{color:rgba(255,255,255,.48)}

.hotel-section{
    position:relative;
    width:100%;
    height:100dvh;
    min-height:100dvh;
    max-height:100dvh;
    overflow:hidden;
    padding:calc(var(--header-h) + 18px) var(--hotel-pad) 22px;
    background:var(--hotel-paper);
}

.hotel-kicker{
    position:relative;
    z-index:8;
    display:flex;
    align-items:center;
    gap:12px;
    min-height:20px;
    font:500 7px var(--mono);
    letter-spacing:.13em;
}
.hotel-kicker span:first-child{
    display:grid;
    place-items:center;
    width:26px;
    height:18px;
    border:1px solid var(--hotel-line);
    border-radius:999px;
}
.hotel-kicker-light{color:rgba(255,255,255,.72)}
.hotel-kicker-light span:first-child{border-color:rgba(255,255,255,.2)}
.hotel-eyebrow{font:500 7px var(--mono);letter-spacing:.14em;color:var(--hotel-red)}
.hotel-section h1,.hotel-section h2{
    margin:0;
    font-family:var(--sans);
    font-weight:700;
    letter-spacing:-.075em;
}
.hotel-section h1 em,.hotel-section h2 em{
    font-family:var(--serif);
    font-weight:400;
    font-style:italic;
}
.hotel-section p{color:var(--hotel-muted);font-size:13px;line-height:1.55}

/* index */
.hotel-screen-index{
    position:fixed;z-index:950;right:12px;top:50%;transform:translateY(-50%);
    display:grid;gap:4px
}
.hotel-screen-index button{
    width:34px;height:20px;padding:0;
    display:flex;align-items:center;justify-content:flex-end;gap:5px;
    border:0;background:transparent;color:rgba(9,9,9,.3);cursor:pointer
}
.hotel-screen-index span{font:500 5px var(--mono)}
.hotel-screen-index i{width:5px;height:1px;background:currentColor;transition:.25s}
.hotel-screen-index button.active{color:var(--hotel-red)}
.hotel-screen-index button.active i{width:14px}

/* 01 */
.hotel-hero{
    background:
        radial-gradient(circle at 75% 30%,rgba(183,36,36,.075),transparent 24%),
        linear-gradient(180deg,#f3f0e9,#e9e3d9);
}
.hotel-hero-grid{
    height:calc(100% - 62px);
    display:grid;
    grid-template-columns:minmax(0,.86fr) minmax(520px,1.14fr);
    gap:clamp(32px,5vw,85px);
    align-items:center
}
.hotel-hero-copy h1{
    margin-top:12px;
    max-width:9.5ch;
    font-size:clamp(62px,6.8vw,110px);
    line-height:.8
}
.hotel-hero-copy h1 em{display:block}
.hotel-hero-copy p{max-width:49ch;margin:20px 0 16px}
.hotel-hero-meta{display:flex;flex-wrap:wrap;gap:6px}
.hotel-hero-meta span{
    padding:7px 9px;border:1px solid var(--hotel-line);border-radius:999px;
    font:500 6px var(--mono);letter-spacing:.09em
}

.hotel-reception{
    height:min(69dvh,640px);
    min-height:450px;
    display:grid;
    grid-template-rows:34px minmax(0,1fr) 128px;
    border:1px solid rgba(9,9,9,.28);
    background:#d5cec2;
    box-shadow:0 28px 85px rgba(9,9,9,.1)
}
.hotel-reception-top{
    padding:0 12px;display:flex;align-items:center;justify-content:space-between;
    background:#090909;color:#fff;font:500 6px var(--mono);letter-spacing:.12em
}
.hotel-reception-top b{font-weight:500;color:rgba(255,255,255,.48)}
.hotel-reception-top i{
    display:inline-block;width:5px;height:5px;margin-left:5px;border-radius:50%;
    background:#55c66a;box-shadow:0 0 12px rgba(85,198,106,.8)
}
.hotel-key-wall{
    min-height:0;padding:10px;display:grid;grid-template-columns:1fr 1fr;gap:7px
}
.hotel-key{
    position:relative;min-height:0!important;padding:13px;
    display:grid;grid-template-columns:38px 1fr;align-items:end;
    border:1px solid rgba(9,9,9,.2);background:#e8e2d8;text-align:left;cursor:pointer
}
.hotel-key::after{
    content:"";position:absolute;right:14px;top:14px;width:18px;height:36px;
    border:2px solid #090909;border-radius:999px 999px 4px 4px;opacity:.16
}
.hotel-key span{font:500 6px var(--mono);color:var(--hotel-red)}
.hotel-key strong{font-size:clamp(16px,1.25vw,20px)}
.hotel-key i{
    position:absolute;right:18px;bottom:15px;width:7px;height:7px;border-radius:50%;
    border:1px solid #090909
}
.hotel-key.active,.hotel-key:hover{background:#090909;color:#fff}
.hotel-key.active::after,.hotel-key:hover::after{border-color:#fff;opacity:.7}
.hotel-key.active i{background:var(--hotel-red);border-color:var(--hotel-red)}
.hotel-booking-card{
    padding:13px 15px;
    display:grid;
    grid-template-columns:1fr auto;
    grid-template-rows:auto auto 1fr;
    gap:4px 14px;
    background:var(--hotel-paper);
    border-top:1px solid rgba(9,9,9,.2)
}
.hotel-booking-card small{
    grid-column:1/-1;font:500 5px var(--mono);letter-spacing:.12em;color:var(--hotel-red)
}
.hotel-booking-card>strong{font-size:25px;letter-spacing:-.05em}
.hotel-booking-card p{margin:0;font-size:9px}
.hotel-booking-card button{
    grid-column:2;grid-row:2/4;
    min-width:150px;border:0;background:#090909;color:#fff;
    font:600 6px var(--mono);letter-spacing:.08em;cursor:pointer
}
.hotel-booking-card button span{color:var(--hotel-red);margin-left:15px}
.hotel-hero-bottom{
    position:absolute;left:var(--hotel-pad);right:var(--hotel-pad);bottom:14px;
    padding-top:9px;display:flex;justify-content:space-between;gap:15px;
    border-top:1px solid var(--hotel-line);font:500 6px var(--mono);letter-spacing:.09em
}
.hotel-hero-bottom strong{color:var(--hotel-red)}

/* 02 journey */
.hotel-journey{background:#e3ddd3}
.hotel-journey-grid{
    height:calc(100% - 28px);
    display:grid;
    grid-template-columns:.72fr 1.28fr;
    grid-template-rows:1fr auto;
    gap:18px clamp(25px,4vw,60px);
    align-items:center
}
.hotel-journey-copy h2{
    max-width:9ch;font-size:clamp(53px,5.6vw,90px);line-height:.83
}
.hotel-journey-copy p{max-width:42ch;margin-top:16px}
.hotel-route{
    position:relative;height:min(56dvh,520px);
    padding:42px;display:grid;grid-template-columns:repeat(5,1fr);align-items:center;
    border:1px solid rgba(9,9,9,.24);
    background:
        linear-gradient(90deg,rgba(9,9,9,.04) 1px,transparent 1px),
        linear-gradient(rgba(9,9,9,.04) 1px,transparent 1px),
        #eee9e1;
    background-size:20% 100%,100% 25%,auto
}
.hotel-route button{
    position:relative;z-index:4;min-height:86px!important;
    padding:10px;display:grid;align-content:space-between;
    border:1px solid rgba(9,9,9,.22);background:var(--hotel-paper);cursor:pointer
}
.hotel-route button span{font:500 6px var(--mono);color:var(--hotel-red)}
.hotel-route button strong{font-size:12px}
.hotel-route button i{font-size:18px;font-style:normal;justify-self:end}
.hotel-route button.active{background:#090909;color:#fff;transform:translateY(-12px)}
.hotel-route-line{
    position:absolute;left:9%;right:9%;top:50%;height:1px;background:rgba(9,9,9,.25)
}
.hotel-route-traveler{
    position:absolute;z-index:6;left:9%;top:50%;transform:translate(-50%,-50%);
    width:24px;height:24px;display:grid;place-items:center;border-radius:50%;
    background:var(--hotel-red);color:#fff;font-size:7px;transition:left .35s ease
}
.hotel-route-readout{
    grid-column:1/-1;min-height:58px;padding:10px 13px;
    display:grid;grid-template-columns:170px 1fr auto;align-items:center;gap:18px;
    border-top:1px solid var(--hotel-line)
}
.hotel-route-readout small{font:500 6px var(--mono);letter-spacing:.1em}
.hotel-route-readout strong{font-size:22px}
.hotel-route-readout p{margin:0;font-size:10px}
.hotel-route-readout b{font:500 6px var(--mono);color:var(--hotel-red)}

/* 03 direct */
.hotel-direct{background:#090909;color:#fff}
.hotel-direct-grid{
    height:calc(100% - 62px);
    display:grid;grid-template-columns:.78fr 1.22fr;gap:clamp(30px,5vw,80px);align-items:center
}
.hotel-direct-copy>span{font:500 6px var(--mono);letter-spacing:.13em;color:var(--hotel-red)}
.hotel-direct-copy h2{
    max-width:10ch;margin-top:10px;font-size:clamp(54px,5.7vw,92px);line-height:.82;color:#fff
}
.hotel-direct-copy p{max-width:43ch;margin-top:17px;color:rgba(255,255,255,.44)}
.hotel-channel-board{
    position:relative;height:min(62dvh,560px);
    display:grid;grid-template-columns:1fr 70px 1fr;
    grid-template-rows:minmax(0,1fr) 92px;gap:10px;
    padding:12px;border:1px solid rgba(255,255,255,.16);
    background:rgba(255,255,255,.035)
}
.hotel-channel{
    padding:18px;display:flex;flex-direction:column;justify-content:center;
    border:1px solid rgba(255,255,255,.14)
}
.hotel-channel small{font:500 5px var(--mono);letter-spacing:.13em;color:var(--hotel-red)}
.hotel-channel strong{font-size:clamp(34px,3.7vw,58px);letter-spacing:-.07em}
.hotel-channel span{margin-top:6px;font:500 6px var(--mono);color:rgba(255,255,255,.4)}
.hotel-channel-own{background:#fff;color:#090909}
.hotel-channel-own span{color:#777}
.hotel-channel-arrow{display:grid;place-items:center;position:relative}
.hotel-channel-arrow i{position:absolute;top:12%;bottom:12%;width:1px;background:rgba(255,255,255,.14)}
.hotel-channel-arrow b{
    z-index:2;width:38px;height:38px;display:grid;place-items:center;border-radius:50%;
    background:var(--hotel-red);color:#fff
}
.hotel-channel-engine{
    grid-column:1/-1;padding:12px 15px;display:grid;align-content:center;
    background:rgba(183,36,36,.12);border:1px solid rgba(183,36,36,.4);position:relative
}
.hotel-channel-engine span{font:500 5px var(--mono);letter-spacing:.13em;color:var(--hotel-red)}
.hotel-channel-engine strong{margin-top:6px;font-size:17px}
.hotel-channel-engine i{
    position:absolute;right:14px;top:50%;transform:translateY(-50%);
    width:10px;height:10px;border-radius:50%;background:#59c46b;box-shadow:0 0 14px #59c46b
}
.hotel-direct-bottom{
    position:absolute;left:var(--hotel-pad);right:var(--hotel-pad);bottom:14px;
    padding-top:9px;display:flex;justify-content:space-between;
    border-top:1px solid rgba(255,255,255,.15);
    font:500 6px var(--mono);letter-spacing:.1em;color:rgba(255,255,255,.45)
}

/* 04 room */
.hotel-room-grid{
    height:calc(100% - 28px);
    display:grid;grid-template-columns:.78fr 1.22fr;gap:clamp(30px,5vw,80px);align-items:center
}
.hotel-room-copy h2{max-width:10ch;font-size:clamp(52px,5.5vw,88px);line-height:.83}
.hotel-room-copy p{max-width:45ch;margin:16px 0}
.hotel-room-tabs{display:flex;gap:5px}
.hotel-room-tabs button{
    min-height:36px!important;padding:0 11px;border:1px solid var(--hotel-line);
    background:transparent;font:600 6px var(--mono);cursor:pointer
}
.hotel-room-tabs button.active{background:#090909;color:#fff}
.hotel-room-stage{
    position:relative;height:min(67dvh,610px);
    overflow:hidden;border:1px solid rgba(9,9,9,.25);
    background:#d6cfc5
}
.hotel-room-window{
    position:absolute;left:7%;right:7%;top:6%;height:47%;
    overflow:hidden;border:10px solid #b9b1a5;background:#dfd3bf
}
.hotel-sun{
    position:absolute;right:17%;top:17%;width:45px;height:45px;border-radius:50%;
    background:#fff3d5;box-shadow:0 0 55px rgba(255,235,185,.75)
}
.hotel-sea{
    position:absolute;left:0;right:0;bottom:0;height:42%;
    background:linear-gradient(#b4c3c2,#8fa7a6)
}
.hotel-curtain{
    position:absolute;top:0;bottom:0;width:19%;background:#eee8df;box-shadow:0 0 18px rgba(0,0,0,.08)
}
.hotel-curtain.c1{left:0}.hotel-curtain.c2{right:0}
.hotel-bed{position:absolute;left:17%;right:17%;bottom:9%;height:40%}
.hotel-headboard{
    position:absolute;left:10%;right:10%;top:0;height:48%;
    background:#85796a;border-radius:20px 20px 0 0
}
.hotel-mattress{
    position:absolute;left:0;right:0;bottom:0;height:48%;
    border-radius:8px;background:#f3efe7;box-shadow:0 12px 28px rgba(0,0,0,.14)
}
.hotel-pillow{position:absolute;z-index:2;top:27%;width:28%;height:22%;border-radius:50%;background:#faf8f3}
.hotel-pillow.p1{left:19%}.hotel-pillow.p2{right:19%}
.hotel-room-caption{
    position:absolute;left:14px;bottom:14px;width:45%;padding:10px;background:#090909;color:#fff
}
.hotel-room-caption small{font:500 5px var(--mono);color:var(--hotel-red)}
.hotel-room-caption strong{display:block;margin-top:5px;font-size:11px;line-height:1.35}

/* 05 calendar */
.hotel-calendar{background:#e7e1d7}
.hotel-calendar-grid{
    height:calc(100% - 28px);
    display:grid;grid-template-columns:.7fr 1.3fr;gap:clamp(28px,5vw,75px);align-items:center
}
.hotel-calendar-copy h2{max-width:8.7ch;font-size:clamp(54px,5.7vw,92px);line-height:.82}
.hotel-calendar-copy p{max-width:42ch;margin:17px 0}
.hotel-trust-tags{display:flex;flex-wrap:wrap;gap:5px}
.hotel-trust-tags span{
    padding:7px 8px;border:1px solid var(--hotel-line);font:500 5px var(--mono)
}
.hotel-date-engine{
    height:min(67dvh,610px);display:grid;grid-template-rows:45px 30px minmax(0,1fr) 78px;
    border:1px solid rgba(9,9,9,.25);background:#f4f1eb
}
.hotel-date-head{
    padding:0 13px;display:flex;align-items:center;justify-content:space-between;
    background:#090909;color:#fff;font:500 6px var(--mono);letter-spacing:.1em
}
.hotel-date-head b{font-weight:500;color:var(--hotel-red)}
.hotel-week,.hotel-days{display:grid;grid-template-columns:repeat(7,1fr)}
.hotel-week span{display:grid;place-items:center;font:500 5px var(--mono);color:#888}
.hotel-days{padding:7px;gap:5px;grid-template-rows:repeat(2,1fr)}
.hotel-days button{
    min-height:0!important;padding:8px;display:flex;flex-direction:column;justify-content:space-between;
    border:1px solid var(--hotel-line);background:transparent;text-align:left;cursor:pointer
}
.hotel-days button span{font-size:18px}
.hotel-days button small{font:500 5px var(--mono);color:#777}
.hotel-days button.selected{background:#090909;color:#fff;border-color:#090909}
.hotel-days button.selected small{color:var(--hotel-red)}
.hotel-date-summary{
    padding:9px 12px;display:grid;grid-template-columns:1fr 1fr 160px;gap:8px;
    border-top:1px solid var(--hotel-line)
}
.hotel-date-summary>span{display:grid;align-content:center}
.hotel-date-summary small{font:500 5px var(--mono);color:#888}
.hotel-date-summary strong{font-size:15px}
.hotel-date-summary button{border:0;background:var(--hotel-red);color:#fff;font:600 6px var(--mono);cursor:pointer}

/* 06 mobile */
.hotel-mobile-grid{
    height:calc(100% - 28px);
    display:grid;grid-template-columns:.78fr 1.22fr;gap:clamp(30px,5vw,80px);align-items:center
}
.hotel-mobile-copy h2{max-width:9ch;font-size:clamp(52px,5.6vw,90px);line-height:.83}
.hotel-mobile-copy p{max-width:42ch;margin:16px 0}
.hotel-thumb-steps{display:grid;border-top:1px solid var(--hotel-line)}
.hotel-thumb-steps span{
    min-height:37px;display:flex;align-items:center;border-bottom:1px solid var(--hotel-line);
    font:600 6px var(--mono);letter-spacing:.08em;opacity:.35
}
.hotel-thumb-steps span.active{opacity:1;padding-left:8px;color:var(--hotel-red)}
.hotel-phone-stage{position:relative;height:min(68dvh,620px);display:grid;place-items:center}
.hotel-phone{
    position:relative;height:92%;aspect-ratio:.49;border:9px solid #090909;border-radius:42px;
    background:#090909;box-shadow:0 26px 70px rgba(9,9,9,.18)
}
.hotel-phone-notch{
    position:absolute;z-index:3;left:50%;top:7px;transform:translateX(-50%);
    width:36%;height:17px;border-radius:999px;background:#090909
}
.hotel-phone-screen{
    position:absolute;inset:3px;border-radius:31px;overflow:hidden;background:#f1efe8;padding:13px;
    display:grid;grid-template-rows:1fr auto auto 46px;gap:7px
}
.hotel-phone-hero{
    padding:20px 12px;display:flex;flex-direction:column;justify-content:flex-end;
    background:linear-gradient(160deg,#c9b79f,#7e8c89);color:#fff
}
.hotel-phone-hero small{font:500 5px var(--mono)}
.hotel-phone-hero strong{font-size:25px;line-height:.9;letter-spacing:-.05em}
.hotel-phone-card,.hotel-phone-room{
    padding:9px;border:1px solid rgba(9,9,9,.14);display:grid;gap:3px
}
.hotel-phone-card span,.hotel-phone-room span{font:500 5px var(--mono);color:#777}
.hotel-phone-card b,.hotel-phone-room strong{font-size:12px}
.hotel-phone-screen>button{border:0;background:#090909;color:#fff;font:600 7px var(--mono)}
.hotel-thumb-zone{
    position:absolute;right:7%;bottom:8%;width:150px;height:150px;border-radius:50%;
    border:1px dashed rgba(183,36,36,.45);display:grid;place-items:center;color:var(--hotel-red)
}
.hotel-thumb-zone span{font:500 5px var(--mono)}
.hotel-thumb-zone i{position:absolute;width:65%;height:65%;border-radius:50%;background:rgba(183,36,36,.06)}

/* 07 map */
.hotel-map{background:#e1dbd1}
.hotel-map-grid{
    height:calc(100% - 28px);
    display:grid;grid-template-columns:.68fr 1.32fr;gap:clamp(28px,5vw,70px);align-items:center
}
.hotel-map-copy h2{max-width:8.8ch;font-size:clamp(54px,5.7vw,92px);line-height:.82}
.hotel-map-copy p{max-width:40ch;margin-top:16px}
.hotel-experience-map{
    position:relative;height:min(68dvh,620px);overflow:hidden;
    border:1px solid rgba(9,9,9,.25);
    background:
        radial-gradient(circle at 50% 50%,rgba(183,36,36,.05),transparent 27%),
        linear-gradient(90deg,rgba(9,9,9,.04) 1px,transparent 1px),
        linear-gradient(rgba(9,9,9,.04) 1px,transparent 1px),
        #f0ece5;
    background-size:auto,12.5% 100%,100% 20%,auto
}
.hotel-map-center{
    position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
    width:110px;height:110px;display:grid;place-content:center;text-align:center;border-radius:50%;
    background:#090909;color:#fff;box-shadow:0 0 0 16px rgba(9,9,9,.05)
}
.hotel-map-center span{font-size:18px;font-weight:700}
.hotel-map-center strong{font:500 4px var(--mono);color:var(--hotel-red)}
.hotel-experience-map button{
    position:absolute;left:var(--x);top:var(--y);transform:translate(-50%,-50%);
    min-width:105px;min-height:40px!important;padding:0 9px;
    border:1px solid var(--hotel-line);background:#f7f4ee;font:600 6px var(--mono);cursor:pointer
}
.hotel-experience-map button b{color:var(--hotel-red);margin-right:6px}
.hotel-experience-map button.active{background:#090909;color:#fff}
.hotel-map-readout{
    position:absolute;left:12px;bottom:12px;width:230px;padding:11px;background:#090909;color:#fff
}
.hotel-map-readout small{font:500 5px var(--mono);color:var(--hotel-red)}
.hotel-map-readout strong{display:block;margin-top:5px;font-size:11px}

/* 08 language */
.hotel-language-grid{
    height:calc(100% - 28px);
    display:grid;grid-template-columns:.76fr 1.24fr;gap:clamp(30px,5vw,80px);align-items:center
}
.hotel-language-copy h2{max-width:8ch;font-size:clamp(56px,6vw,96px);line-height:.82}
.hotel-language-copy p{max-width:43ch;margin-top:17px}
.hotel-passport{
    position:relative;height:min(66dvh,600px);padding:24px;
    display:flex;flex-direction:column;justify-content:center;
    border:1px solid rgba(9,9,9,.25);
    background:#dfd7cb;box-shadow:12px 16px 0 rgba(9,9,9,.06)
}
.hotel-passport::before{
    content:"";position:absolute;inset:12px;border:1px solid rgba(9,9,9,.09);pointer-events:none
}
.hotel-passport-top{
    position:absolute;left:24px;right:24px;top:20px;
    display:flex;justify-content:space-between;font:500 6px var(--mono);letter-spacing:.12em
}
.hotel-passport-top b{color:var(--hotel-red)}
.hotel-passport>strong{
    max-width:8ch;font-size:clamp(60px,7vw,112px);line-height:.86;letter-spacing:-.07em
}
.hotel-market-options{display:flex;gap:5px;margin-top:24px}
.hotel-market-options button{
    min-width:46px;min-height:35px!important;border:1px solid var(--hotel-line);
    background:transparent;font:600 6px var(--mono);cursor:pointer
}
.hotel-market-options button.active{background:#090909;color:#fff}
.hotel-market-search{
    margin-top:12px;padding:11px 12px;display:grid;grid-template-columns:30px 1fr;gap:4px;
    border:1px solid rgba(9,9,9,.18);background:#f1ede6
}
.hotel-market-search small{grid-column:1/-1;font:500 5px var(--mono);color:#888}
.hotel-market-search span{font-size:17px}
.hotel-market-search strong{font-size:13px}
.hotel-market-tech{
    position:absolute;left:24px;right:24px;bottom:20px;padding-top:8px;border-top:1px solid var(--hotel-line);
    font:500 5px var(--mono);letter-spacing:.08em
}

/* 09 SEO */
.hotel-seo{background:#e7e1d8}
.hotel-seo-grid{
    height:calc(100% - 28px);
    display:grid;grid-template-columns:.75fr 1.25fr;gap:clamp(30px,5vw,80px);align-items:center
}
.hotel-seo-copy>span{font:500 6px var(--mono);letter-spacing:.13em;color:var(--hotel-red)}
.hotel-seo-copy h2{max-width:9.7ch;margin-top:10px;font-size:clamp(51px,5.4vw,86px);line-height:.83}
.hotel-seo-copy p{max-width:42ch;margin-top:16px}
.hotel-search-lab{
    height:min(66dvh,600px);padding:18px;display:grid;grid-template-rows:48px auto auto 1fr;
    gap:10px;border:1px solid rgba(9,9,9,.25);background:#f1eee8
}
.hotel-search-query{
    padding:0 13px;display:grid;grid-template-columns:26px 1fr 8px;align-items:center;
    border:1px solid rgba(9,9,9,.18);border-radius:999px
}
.hotel-search-query span{font-size:17px}
.hotel-search-query strong{font-size:12px;font-weight:500}
.hotel-search-query i{width:7px;height:7px;border-radius:50%;background:#4fbb64}
.hotel-search-result{padding:13px;border:1px solid var(--hotel-line);background:#fff}
.hotel-search-result small{font:500 5px var(--mono);color:#777}
.hotel-search-result strong{display:block;margin:5px 0;font-size:17px;color:#294d89}
.hotel-search-result p{margin:0;font-size:9px}
.hotel-seo-tags{display:flex;flex-wrap:wrap;gap:5px}
.hotel-seo-tags button{
    min-height:31px!important;padding:0 8px;border:1px solid var(--hotel-line);
    background:transparent;font:600 5px var(--mono);cursor:pointer
}
.hotel-seo-tags button.active{background:#090909;color:#fff}
.hotel-seo-structure{align-self:end;display:grid;grid-template-columns:repeat(5,1fr);gap:5px}
.hotel-seo-structure span{
    min-height:50px;padding:8px;display:grid;place-items:center;text-align:center;
    border:1px solid var(--hotel-line);font:500 5px var(--mono)
}

/* 10 stack */
.hotel-stack{background:#090909;color:#fff}
.hotel-stack-grid{
    height:calc(100% - 28px);
    display:grid;grid-template-columns:.72fr 1.28fr;gap:clamp(30px,5vw,75px);align-items:center
}
.hotel-stack-copy h2{max-width:8ch;font-size:clamp(56px,6vw,96px);line-height:.82;color:#fff}
.hotel-stack-copy p{max-width:42ch;margin-top:17px;color:rgba(255,255,255,.44)}
.hotel-system-rack{
    position:relative;height:min(67dvh,610px);padding:12px;
    display:grid;grid-template-rows:repeat(5,1fr);gap:6px;
    border:1px solid rgba(255,255,255,.15);background:#121212
}
.hotel-system-rack>button{
    min-height:0!important;padding:0 13px;
    display:grid;grid-template-columns:35px 1fr auto;align-items:center;
    border:1px solid rgba(255,255,255,.12);background:#171717;color:#fff;text-align:left;cursor:pointer
}
.hotel-system-rack>button span{font:500 6px var(--mono);color:var(--hotel-red)}
.hotel-system-rack>button strong{font-size:15px}
.hotel-system-rack>button i{font:500 5px var(--mono);font-style:normal;color:#5dcc72}
.hotel-system-rack>button.active{background:#fff;color:#090909}
.hotel-system-readout{
    position:absolute;right:18px;bottom:18px;width:240px;padding:11px;
    background:var(--hotel-red);color:#fff;box-shadow:0 12px 30px rgba(183,36,36,.24)
}
.hotel-system-readout small{font:500 5px var(--mono)}
.hotel-system-readout strong{display:block;margin:5px 0;font-size:14px}
.hotel-system-readout p{margin:0;font-size:8px;color:rgba(255,255,255,.72)}

/* 11 FAQ */
.hotel-faq{background:#ded7cd}
.hotel-faq-grid{
    height:calc(100% - 28px);
    display:grid;grid-template-columns:.72fr 1.28fr;gap:clamp(30px,5vw,80px);align-items:center
}
.hotel-faq-copy>span{font:500 6px var(--mono);letter-spacing:.13em;color:var(--hotel-red)}
.hotel-faq-copy h2{max-width:9ch;margin-top:10px;font-size:clamp(52px,5.6vw,90px);line-height:.83}
.hotel-faq-copy p{max-width:42ch;margin-top:16px}
.hotel-faq-card{
    max-width:290px;margin-top:20px;padding:11px;display:grid;grid-template-columns:1fr auto;
    border:1px solid var(--hotel-line);background:#eee9e1
}
.hotel-faq-card span{grid-column:1/-1;font:500 5px var(--mono);color:var(--hotel-red)}
.hotel-faq-card strong{font-size:15px}.hotel-faq-card b{font-size:17px;color:var(--hotel-red)}
.hotel-faq-list{
    max-height:68dvh;overflow:auto;overscroll-behavior:contain;border-top:1px solid var(--hotel-line)
}
.hotel-faq-item{border-bottom:1px solid var(--hotel-line)}
.hotel-faq-item summary{
    min-height:60px;padding:0 8px;display:grid;grid-template-columns:34px 1fr 25px;align-items:center;
    list-style:none;cursor:pointer
}
.hotel-faq-item summary::-webkit-details-marker{display:none}
.hotel-faq-item summary span{font:500 6px var(--mono);color:var(--hotel-red)}
.hotel-faq-item summary strong{font-size:15px;letter-spacing:-.025em}
.hotel-faq-item summary i{font-size:18px;font-style:normal;transition:.2s}
.hotel-faq-item[open] summary i{transform:rotate(45deg);color:var(--hotel-red)}
.hotel-faq-item p{margin:0;padding:0 42px 18px;max-width:75ch;font-size:10px}

/* 12 CTA */
.hotel-cta{background:#090909;color:#fff}
.hotel-cta-grid{
    height:calc(100% - 63px);
    display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(35px,6vw,90px);align-items:center
}
.hotel-door{
    position:relative;width:min(42vw,540px);height:min(62dvh,560px);justify-self:center
}
.hotel-door-frame{
    position:absolute;left:50%;top:2%;transform:translateX(-50%);
    width:54%;height:86%;padding:13px;border:2px solid rgba(255,255,255,.55)
}
.hotel-door-panel{
    position:relative;width:100%;height:100%;padding:17px;
    display:flex;flex-direction:column;justify-content:space-between;
    background:#171717;border:1px solid rgba(255,255,255,.15)
}
.hotel-door-panel span{font:500 6px var(--mono);letter-spacing:.12em;color:var(--hotel-red)}
.hotel-door-panel strong{align-self:center;font-size:100px;line-height:.8;font-weight:400}
.hotel-door-panel i{
    width:8px;height:8px;border-radius:50%;background:#d0b991;align-self:flex-end;box-shadow:0 0 12px rgba(208,185,145,.6)
}
.hotel-door-light{
    position:absolute;left:12%;right:12%;bottom:-8%;height:15%;
    background:linear-gradient(180deg,rgba(255,234,184,.22),transparent);filter:blur(8px)
}
.hotel-do-not-disturb{
    position:absolute;right:4%;top:16%;width:135px;padding:12px;
    background:var(--hotel-red);color:#fff;transform:rotate(6deg);box-shadow:0 12px 28px rgba(0,0,0,.25)
}
.hotel-do-not-disturb::before{
    content:"";position:absolute;left:50%;top:-17px;transform:translateX(-50%);
    width:30px;height:30px;border-radius:50%;background:#090909
}
.hotel-do-not-disturb small{font:500 5px var(--mono)}
.hotel-do-not-disturb strong{display:block;margin-top:6px;font-size:13px;line-height:1.1}
.hotel-cta-copy>small{font:500 6px var(--mono);letter-spacing:.13em;color:var(--hotel-red)}
.hotel-cta-copy h2{max-width:8.7ch;margin-top:10px;font-size:clamp(64px,6.8vw,108px);line-height:.8;color:#fff}
.hotel-cta-copy p{max-width:42ch;margin:18px 0;color:rgba(255,255,255,.45)}
.hotel-cta-button{
    min-height:48px;padding:0 14px;display:inline-flex;align-items:center;gap:45px;
    background:#fff;color:#090909;text-decoration:none;font:700 7px var(--mono);letter-spacing:.1em
}
.hotel-cta-button span{color:var(--hotel-red);font-size:17px}
.hotel-cta-bottom{
    position:absolute;left:var(--hotel-pad);right:var(--hotel-pad);bottom:14px;
    padding-top:10px;display:flex;justify-content:space-between;border-top:1px solid rgba(255,255,255,.14);
    font:500 6px var(--mono);letter-spacing:.1em;color:rgba(255,255,255,.4)
}

/* short desktop */
@media(min-width:1001px) and (max-height:820px){
    .hotel-section{padding-top:calc(var(--header-h) + 8px);padding-bottom:10px}
    .hotel-hero-copy h1,.hotel-journey-copy h2,.hotel-direct-copy h2,.hotel-room-copy h2,
    .hotel-calendar-copy h2,.hotel-mobile-copy h2,.hotel-map-copy h2,.hotel-language-copy h2,
    .hotel-seo-copy h2,.hotel-stack-copy h2,.hotel-faq-copy h2,.hotel-cta-copy h2{
        font-size:clamp(42px,4.8vw,72px)
    }
    .hotel-reception,.hotel-route,.hotel-channel-board,.hotel-room-stage,.hotel-date-engine,
    .hotel-phone-stage,.hotel-experience-map,.hotel-passport,.hotel-search-lab,.hotel-system-rack{
        height:57dvh;min-height:350px
    }
}

/* mobile */
@media(max-width:1000px){
    html{scroll-snap-type:y mandatory!important}
    body.hotel-page{cursor:auto!important}
    .pointer-lens,.cursor-dot,.cursor-circle{display:none!important}
    .hotel-screen-index{display:none}

    .hotel-section{
        height:100dvh;min-height:100dvh;max-height:100dvh;
        padding:80px 14px 12px;scroll-snap-align:start;scroll-snap-stop:always
    }
    .hotel-kicker{font-size:5px}

    /* 01 */
    .hotel-hero-grid{
        height:calc(100% - 52px);grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr);gap:8px
    }
    .hotel-hero-copy h1{font-size:clamp(40px,11.5vw,61px);line-height:.86;margin-top:6px}
    .hotel-hero-copy p{font-size:9px;margin:8px 0}
    .hotel-hero-meta{display:none}
    .hotel-reception{height:100%;min-height:0;grid-template-rows:28px minmax(0,1fr) 85px}
    .hotel-key-wall{padding:6px;gap:4px}
    .hotel-key{padding:7px;grid-template-columns:26px 1fr}
    .hotel-key strong{font-size:9px}
    .hotel-booking-card{padding:8px}
    .hotel-booking-card>strong{font-size:18px}
    .hotel-booking-card button{min-width:105px;font-size:5px}
    .hotel-hero-bottom{font-size:4px;bottom:7px}

    /* 02 */
    .hotel-journey-grid{
        height:calc(100% - 22px);grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr) 48px;gap:6px
    }
    .hotel-journey-copy h2{font-size:clamp(35px,9.8vw,50px)}
    .hotel-journey-copy p{display:none}
    .hotel-route{height:100%;padding:10px;grid-template-columns:1fr;grid-template-rows:repeat(5,1fr);gap:4px}
    .hotel-route button{min-height:0!important;grid-template-columns:24px 1fr 25px;align-items:center}
    .hotel-route button.active{transform:translateX(7px)}
    .hotel-route-line{left:21px;right:auto;top:9%;bottom:9%;width:1px;height:auto}
    .hotel-route-traveler{left:21px;top:9%;transition:top .35s ease}
    .hotel-route-readout{min-height:48px;grid-template-columns:90px 1fr auto;padding:6px}
    .hotel-route-readout p{display:none}.hotel-route-readout strong{font-size:13px}

    /* 03 */
    .hotel-direct-grid{
        height:calc(100% - 52px);grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr);gap:7px
    }
    .hotel-direct-copy h2{font-size:clamp(34px,9.4vw,48px)}
    .hotel-direct-copy p{display:none}
    .hotel-channel-board{height:100%;grid-template-columns:1fr;grid-template-rows:1fr 35px 1fr 70px}
    .hotel-channel-arrow i{left:12%;right:12%;top:50%;bottom:auto;width:auto;height:1px}
    .hotel-channel-engine{grid-column:1}
    .hotel-direct-bottom{font-size:4px;bottom:7px}

    /* 04 */
    .hotel-room-grid{
        height:calc(100% - 22px);grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr);gap:6px
    }
    .hotel-room-copy h2{font-size:clamp(34px,9.5vw,49px)}
    .hotel-room-copy p{display:none}
    .hotel-room-tabs{margin-top:6px}
    .hotel-room-stage{height:100%}
    .hotel-room-caption{width:63%}

    /* 05 */
    .hotel-calendar-grid{
        height:calc(100% - 22px);grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr);gap:6px
    }
    .hotel-calendar-copy h2{font-size:clamp(34px,9.5vw,49px)}
    .hotel-calendar-copy p{display:none}
    .hotel-trust-tags{margin-top:6px;overflow-x:auto;flex-wrap:nowrap}
    .hotel-trust-tags span{flex:0 0 auto}
    .hotel-date-engine{height:100%;grid-template-rows:34px 24px minmax(0,1fr) 62px}
    .hotel-days{gap:3px;padding:4px}
    .hotel-days button{padding:5px}.hotel-days button span{font-size:13px}
    .hotel-date-summary{grid-template-columns:1fr 1fr 110px;padding:5px}

    /* 06 */
    .hotel-mobile-grid{
        height:calc(100% - 22px);grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr);gap:5px
    }
    .hotel-mobile-copy h2{font-size:clamp(34px,9.5vw,49px)}
    .hotel-mobile-copy p{display:none}
    .hotel-thumb-steps{grid-template-columns:repeat(4,1fr);margin-top:5px}
    .hotel-thumb-steps span{min-height:28px;justify-content:center;font-size:5px;border-right:1px solid var(--hotel-line)}
    .hotel-phone-stage{height:100%}
    .hotel-phone{height:94%}
    .hotel-thumb-zone{width:100px;height:100px;right:0}

    /* 07 */
    .hotel-map-grid{
        height:calc(100% - 22px);grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr);gap:6px
    }
    .hotel-map-copy h2{font-size:clamp(34px,9.5vw,49px)}
    .hotel-map-copy p{display:none}
    .hotel-experience-map{height:100%}
    .hotel-map-center{width:82px;height:82px}
    .hotel-experience-map button{min-width:82px;min-height:32px!important;font-size:5px}
    .hotel-map-readout{width:170px;padding:8px}

    /* 08 */
    .hotel-language-grid{
        height:calc(100% - 22px);grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr);gap:6px
    }
    .hotel-language-copy h2{font-size:clamp(34px,9.5vw,49px)}
    .hotel-language-copy p{display:none}
    .hotel-passport{height:100%;padding:15px}
    .hotel-passport>strong{font-size:clamp(54px,16vw,90px)}
    .hotel-passport-top{left:15px;right:15px;top:13px}
    .hotel-market-tech{left:15px;right:15px;bottom:12px;font-size:4px}

    /* 09 */
    .hotel-seo-grid{
        height:calc(100% - 22px);grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr);gap:6px
    }
    .hotel-seo-copy h2{font-size:clamp(33px,9.3vw,48px);margin-top:5px}
    .hotel-seo-copy p{display:none}
    .hotel-search-lab{height:100%;padding:8px;grid-template-rows:40px auto auto 1fr}
    .hotel-search-result strong{font-size:13px}
    .hotel-search-result p{font-size:7px}
    .hotel-seo-structure span{min-height:38px;font-size:4px}

    /* 10 */
    .hotel-stack-grid{
        height:calc(100% - 22px);grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr);gap:6px
    }
    .hotel-stack-copy h2{font-size:clamp(34px,9.5vw,49px)}
    .hotel-stack-copy p{display:none}
    .hotel-system-rack{height:100%;padding:7px}
    .hotel-system-rack>button{padding:0 8px;grid-template-columns:25px 1fr auto}
    .hotel-system-rack>button strong{font-size:10px}
    .hotel-system-readout{right:10px;bottom:10px;width:180px;padding:8px}

    /* 11 */
    .hotel-faq-grid{
        height:calc(100% - 22px);grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr);gap:6px
    }
    .hotel-faq-copy h2{font-size:clamp(34px,9.5vw,49px);margin-top:5px}
    .hotel-faq-copy p,.hotel-faq-card{display:none}
    .hotel-faq-list{height:100%;max-height:none}
    .hotel-faq-item summary{min-height:45px;grid-template-columns:25px 1fr 20px;padding:0 4px}
    .hotel-faq-item summary strong{font-size:10px}
    .hotel-faq-item p{padding:0 29px 10px;font-size:8px}

    /* 12 */
    .hotel-cta-grid{
        height:calc(100% - 53px);grid-template-columns:1fr;grid-template-rows:minmax(0,.85fr) auto;gap:5px
    }
    .hotel-door{width:min(65vw,310px);height:100%;max-height:330px}
    .hotel-do-not-disturb{width:100px;padding:8px}
    .hotel-do-not-disturb strong{font-size:9px}
    .hotel-cta-copy h2{font-size:clamp(41px,11.5vw,61px)}
    .hotel-cta-copy p{font-size:8px;margin:7px 0}
    .hotel-cta-button{min-height:40px;padding:0 10px}
    .hotel-cta-bottom{font-size:4px;bottom:7px}
}

@media(max-width:1000px) and (max-height:720px){
    .hotel-section{padding-top:69px}
    .hotel-hero-copy h1,.hotel-journey-copy h2,.hotel-direct-copy h2,.hotel-room-copy h2,
    .hotel-calendar-copy h2,.hotel-mobile-copy h2,.hotel-map-copy h2,.hotel-language-copy h2,
    .hotel-seo-copy h2,.hotel-stack-copy h2,.hotel-faq-copy h2,.hotel-cta-copy h2{
        font-size:clamp(29px,8.2vw,41px)
    }
    .hotel-hero-copy p{display:none}
}
