:root{color-scheme:dark;
--bg:#0b0b0f;
--surface:#16161d;
--raised:#1e1e28;
--text:#e8e8e8;
--muted:#9e9e9e;
--accent:#e02a4f;
--pink:#ff4d6d;
--border:#2a2a35;
--gold:#ffc107;
font-family:Arial,'Microsoft JhengHei','PingFang TC',sans-serif;
color:var(--text);
background:var(--bg);
font-synthesis:none}
*{box-sizing:border-box}
body{margin:0;
font-size:14px;
line-height:1.5}
button,input,select,textarea{font:inherit}
button,a,input,select,summary,textarea{-webkit-tap-highlight-color:transparent}
a{color:inherit;
text-decoration:none}
a:hover{color:var(--pink)}
button{cursor:pointer;
color:inherit;
background:none;
border:0}
button:disabled{cursor:default;
opacity:.45}
input,select,textarea{color:var(--text);
background:var(--raised);
border:1px solid var(--border);
border-radius:6px;
padding:10px 12px;
min-width:0;
max-width:100%}
select{width:100%;
cursor:pointer}
input::placeholder,textarea::placeholder{color:#a0a0ac}
input[type=range]{width:100%;
padding:0;
accent-color:var(--pink)}
input[type=radio],input[type=checkbox]{accent-color:var(--accent)}
textarea{min-height:90px;
resize:vertical}
h1,h2,h3,p,figure{margin:0}
h1{font-size:28px;
line-height:1.4;
font-weight:700}
h2{font-size:22px;
line-height:1.5;
font-weight:600}
h3{font-size:16px;
font-weight:600}
p{margin:8px 0}
ul,ol{padding:0;
margin:0;
list-style:none}
figure{overflow:hidden}
img{display:block;
width:100%;
height:auto}
hr{border:0;
border-top:1px solid var(--border);
margin:20px 0}
fieldset{border:0;
padding:0;
margin:0;
min-width:0}
legend{width:100%;
padding:0;
margin-bottom:7px}
time,small,.muted{color:var(--muted)}
small{font-size:12px}
summary{cursor:pointer}
details>p{color:var(--muted)}
:focus-visible{outline:2px solid var(--pink);
outline-offset:4px}
::selection{background:#6f1830;
color:white}
[hidden]{display:none!important}
.sr-only{position:absolute!important;
width:1px;
height:1px;
padding:0;
margin:-1px;
overflow:hidden;
clip:rect(0,0,0,0);
white-space:nowrap;
border:0}
.skip-link{position:fixed;
top:10px;
left:16px;
transform:translateY(-200%);
z-index:20;
background:var(--accent);
color:white;
padding:10px 20px;
border-radius:6px}
.skip-link:focus{transform:none}
.icon{width:20px;
height:20px;
fill:currentColor;
flex:none;
vertical-align:middle}
.icon-button{width:36px;
height:36px;
display:inline-flex;
align-items:center;
justify-content:center;
border-radius:50%}
.icon-button:hover{background:var(--raised)}
.container{width:100%;
max-width:1400px;
margin:auto;
padding-left:16px;
padding-right:16px}
#app{min-height:100dvh;
display:flex;
flex-direction:column}
main.container{padding-top:24px;
padding-bottom:64px;
flex:1;
min-height:65dvh}
.narrow-page{max-width:1100px}
.page-heading{margin-bottom:24px}
.page-heading p{color:var(--muted);
font-size:14px}
.page-heading h1 small{font-size:14px}
.section-space{margin-bottom:40px}
.section-heading{display:flex;
gap:16px;
justify-content:space-between;
align-items:center;
margin-bottom:16px}
.section-heading h2{display:flex;
align-items:center;
gap:8px;
min-width:0}
.section-heading h2>.icon{color:var(--pink);
width:24px;
height:24px}
.section-heading small{font-weight:400;
margin-left:4px}
.more-link{color:var(--pink);
font-size:13px;
white-space:nowrap}
.more-link .icon{width:14px;
height:14px}
.button{display:inline-flex;
align-items:center;
justify-content:center;
gap:7px;
padding:9px 16px;
border:1px solid var(--border);
border-radius:6px;
line-height:1.3;
min-height:36px}
.primary{background:var(--accent);
border-color:var(--accent);
color:#fff}
.primary:hover{background:#c91940;
color:#fff}
.text-button{padding:2px 6px;
font-size:12px;
color:var(--muted)}
.text-button:hover{color:var(--pink)}
.pill{background:var(--raised);
border:1px solid var(--border);
border-radius:999px;
display:inline-flex;
gap:4px;
align-items:center;
padding:5px 12px}
.pill .icon{width:15px;
height:15px}
.tag{display:inline-block;
border-radius:3px;
font-size:12px;
padding:1px 6px;
background:var(--raised);
color:#c4c4ca}
.green-tag{background:#193b25;
color:#8ed39a;
border:1px solid #275537;
font-size:12px;
padding:1px 6px;
border-radius:3px}
.tag-list{display:flex;
flex-wrap:wrap;
gap:6px}
.panel{background:var(--surface);
border:1px solid var(--border);
border-radius:8px;
padding:20px}
.panel h2{margin-bottom:12px}
.site-header{position:sticky;
top:0;
z-index:5;
background:#0b0b0ff2;
backdrop-filter:blur(12px);
border-bottom:1px solid var(--border)}
.header-inner{max-width:1400px;
margin:auto;
padding:0 16px}
.header-top{height:56px;
display:flex;
align-items:center;
justify-content:space-between}
.brand{display:inline-flex;
align-items:center;
gap:10px;
color:#fff;
white-space:nowrap}
.brand strong{font-family:Arial,sans-serif;
font-weight:900;
font-size:30px;
line-height:1;
letter-spacing:-2px;
font-style:italic}
.brand strong span{color:var(--pink)}
.brand small{font-size:11px;
letter-spacing:2px;
color:var(--muted)}
.header-actions{display:flex;
align-items:center;
gap:12px}
.main-nav{padding:12px 0}
.main-nav ul{display:flex;
gap:8px;
align-items:center;
white-space:nowrap;
overflow:auto;
scrollbar-width:none}
.main-nav a,.main-nav button{display:block;
padding:6px 16px;
border:1px solid var(--border);
border-radius:22px;
background:var(--raised);
color:var(--muted);
font-size:16px;
line-height:24px}
.main-nav a.active{background:var(--accent);
border-color:var(--accent);
color:#fff}
.main-nav a:hover,.main-nav button:hover{color:#fff}
.nav-contact{padding-left:12px;
border-left:1px solid var(--border);
margin-left:4px}
.hero{position:relative;
border:1px solid var(--border);
border-radius:8px;
aspect-ratio:3/1;
background:var(--surface)}
.hero img{height:100%;
object-fit:cover}
.hero>a{display:block;
height:100%}
.hero-prev,.hero-next{position:absolute;
top:calc(50% - 22px);
width:44px;
height:44px;
color:var(--pink);
font-size:28px}
.hero-prev{left:8px}
.hero-next{right:8px}
.hero-dots{position:absolute;
bottom:10px;
left:50%;
transform:translateX(-50%);
background:#0b0b0fcc;
border-radius:20px;
display:flex;
padding:2px}
.hero-dots button{width:28px;
height:26px;
position:relative}
.hero-dots button:after{content:'';
display:block;
width:7px;
height:7px;
border-radius:50%;
background:#666;
margin:auto}
.hero-dots button.active:after{background:#eee}
.announcement{height:44px;
display:flex;
align-items:center;
gap:12px;
background:var(--surface);
border:1px solid #49202a;
border-radius:30px;
padding:5px 9px;
margin-bottom:16px;
overflow:hidden}
.announcement>span{display:flex;
gap:5px;
align-items:center;
padding:5px 12px;
background:var(--accent);
color:white;
font-size:12px;
border-radius:20px;
white-space:nowrap}
.announcement .icon{width:15px;
height:15px}
.announcement>a{overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap;
color:var(--muted);
flex:1;
font-size:13px}
.announcement time{font-size:11px;
white-space:nowrap}
.announcement button{color:var(--pink);
letter-spacing:3px}
.booking-strip{display:flex;
align-items:center;
gap:14px;
background:#1e0f15;
border:1px solid #5b2232;
border-radius:8px;
padding:12px 20px;
margin-bottom:24px;
min-height:74px}
.booking-icon{display:flex;
align-items:center;
justify-content:center;
width:44px;
height:44px;
border-radius:8px;
background:var(--accent)}
.booking-icon .icon{width:27px;
height:27px}
.booking-strip h2{font-size:16px}
.booking-strip p{font-size:12px;
color:var(--muted);
margin:0}
.booking-strip>.button{margin-left:auto;
border-radius:25px;
font-size:13px}
.quick-filter{display:grid;
grid-template-columns:repeat(4,minmax(0,1fr)) 142px;
gap:8px}
.quick-filter input,.quick-filter select,.quick-filter .button{height:44px;
font-size:13px}
.quick-filter select{background:var(--raised)}
.mobile-filter-summary{display:none}
.region-panel{background:var(--surface);
border:1px solid var(--border);
border-radius:8px;
padding:16px}
.city-chips{display:flex;
gap:12px;
align-items:center;
flex-wrap:wrap;
padding-bottom:20px}
.city-chips a{display:block;
font-size:13px;
white-space:nowrap}
.city-chips small{margin-left:4px}
.city-chips .pill{padding:7px 12px}
.region-links{display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:6px 8px}
.region-links>li{display:flex;
align-items:center;
gap:12px;
background:#1e1e2880;
border:1px solid #24242f;
border-radius:6px;
padding:4px 8px;
min-width:0;
overflow:auto;
scrollbar-width:none}
.region-links a{font-size:12px;
white-space:nowrap;
color:var(--muted)}
.region-links a span{font-size:10px;
color:#9999a6;
margin-right:3px}
.region-links .city-label{background:#3a2030;
border-radius:4px;
color:#e8c8d3;
min-width:70px;
padding:2px 10px;
text-align:center}
.activity-preview{border:1px solid var(--border);
background:var(--surface);
border-radius:8px;
overflow:hidden}
.activity-preview>.section-heading{background:var(--raised);
padding:9px 14px;
margin:0}
.activity-preview h2{font-size:13px}
.activity-preview h2>.icon{width:16px;
height:16px}
.activity-preview .more-link{font-size:11px}
.activity-preview>ul{display:grid;
grid-template-columns:repeat(2,minmax(0,1fr))}
.activity-preview li{padding:10px 14px;
border-right:1px solid var(--border);
border-bottom:1px solid var(--border)}
.activity-preview li a{display:flex;
gap:10px;
position:relative;
font-size:12px;
min-width:0}
.activity-preview img{width:32px;
height:32px;
object-fit:cover;
border-radius:50%;
flex:none}
.activity-preview li a>div{min-width:0;
padding-right:35px}
.activity-preview p{font-size:11px;
line-height:1.6;
color:var(--muted);
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap;
margin:3px 0 0}
.activity-preview time{position:absolute;
right:0;
font-size:10px}
.person-grid{display:grid;
grid-template-columns:repeat(6,minmax(0,1fr));
gap:16px}
.columns-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.columns-5{grid-template-columns:repeat(5,minmax(0,1fr))}
.person-card{background:var(--surface);
border-radius:8px;
overflow:hidden;
height:100%}
.person-card>a{display:block;
height:100%}
.person-card figure{position:relative;
aspect-ratio:3/4;
background:var(--raised)}
.person-card img{height:100%;
object-fit:cover;
transition:transform .2s}
.person-card:hover img{transform:scale(1.025)}
.card-copy{padding:10px 12px 12px}
.card-copy h3{font-size:16px;
line-height:1.4;
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap}
.measurements{font-size:12px;
color:var(--muted);
margin:4px 0}
.card-bottom{display:flex;
justify-content:space-between;
align-items:center;
gap:4px;
margin-top:8px}
.card-bottom>span{color:var(--muted);
font-size:12px;
white-space:nowrap}
.card-bottom .icon{width:12px;
height:12px;
color:var(--pink)}
.card-bottom strong{font-size:20px;
color:var(--pink);
font-weight:700;
white-space:nowrap}
.rating{font-size:12px;
margin:0}
.rating>span:first-child,.rating:not(p){color:var(--gold)}
.rank{background:#09090c;
border-radius:5px;
display:inline-flex;
align-items:center;
justify-content:center;
min-width:28px;
height:28px;
font-size:18px;
line-height:1;
font-weight:700;
flex:none}
.person-card .rank{position:absolute;
left:7px;
top:7px}
.rank-1{color:#211b00;
background:var(--gold)}
.rank-2{color:#20232b;
background:#c6cbd0}
.rank-3{color:#fff;
background:#9b6530}
.card-badge{position:absolute;
top:9px;
left:9px;
padding:2px 8px;
border-radius:3px;
background:#087f94;
font-size:14px;
color:#fff;
font-weight:bold}
.card-badge.vip{background:var(--gold);
color:#282300}
.card-media .card-badge--stacked{top:34px}
.card-media .rank--stacked{top:36px}
.shelf{position:relative}
.shelf-controls{display:flex;
justify-content:center;
gap:6px;
align-items:center;
height:28px}
.shelf-dot{width:8px;
height:7px;
background:#444451;
border-radius:8px}
.shelf-dot.active{width:20px;
background:var(--accent)}
.shelf-controls button{position:absolute;
top:49%;
right:-12px;
background:var(--surface);
color:var(--pink);
border-radius:50%;
width:36px;
height:36px;
font-size:24px}
.shelf-controls button:first-child{left:-12px;
right:auto}
/* Related-profile carousel: horizontal swipe when more than five cards. */
.shelf-viewport{position:relative}
.shelf-scroll{display:flex;
gap:12px;
overflow-x:auto;
scroll-snap-type:x mandatory;
scrollbar-width:none;
-ms-overflow-style:none;
overscroll-behavior-x:contain;
-webkit-overflow-scrolling:touch}
.shelf-scroll::-webkit-scrollbar{display:none}
.shelf-scroll>li{flex:0 0 calc((100% - 48px)/5);
min-width:0;
scroll-snap-align:start}
.shelf-controls[hidden]{display:none}
.article-category-tag{margin-left:8px}
@media(max-width:1023px){.shelf-scroll>li{flex-basis:calc((100% - 24px)/2.3)}}
.rank-links{display:flex;
gap:24px;
margin:-12px 0 40px;
font-size:13px;
color:var(--pink);
flex-wrap:wrap}
.nation-grid{display:grid;
grid-template-columns:repeat(4,minmax(0,1fr));
gap:20px}
.nation-grid.compact{grid-template-columns:repeat(7,minmax(0,1fr));
gap:16px}
.nation-grid figure{position:relative;
background:var(--raised);
border-radius:8px;
aspect-ratio:3/4}
.nation-grid img{height:100%;
object-fit:cover;
opacity:.28}
.nation-grid figcaption{position:absolute;
bottom:0;
padding:20px;
width:100%;
background:linear-gradient(transparent,#09090cee)}
.nation-grid figcaption h2{font-size:22px}
.nation-grid figcaption p{font-size:14px;
color:#b9b9c2}
.nation-grid figcaption strong{font-size:13px}
.nation-grid figcaption .icon{width:14px;
height:14px}
.nation-grid.compact figcaption{padding:12px}
.nation-grid.compact figcaption h3{font-size:15px}
.nation-grid.compact figcaption p{font-size:12px;
white-space:nowrap;
margin:4px 0}
.country-mark{position:absolute;
top:10px;
left:10px;
background:#e8e8e8;
color:#171720;
font-size:11px;
font-weight:bold;
padding:0 4px;
border-radius:2px}
.guide-panel{background:var(--surface);
border:1px solid var(--border);
border-radius:8px;
overflow:hidden}
.guide-panel>.section-heading{background:var(--raised);
padding:10px 16px;
margin:0}
.guide-panel>.section-heading h2{font-size:14px}
.guide-panel .icon{width:17px;
height:17px;
color:var(--pink)}
.guide-columns{display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:20px;
padding:20px 16px}
.guide-columns h3{font-size:14px}
.guide-columns p{font-size:12px}
.guide-columns ol{counter-reset:guide}
.guide-columns li{font-size:12px;
color:var(--muted);
margin:12px 0;
display:flex;
gap:10px;
counter-increment:guide}
.guide-columns li:before{content:counter(guide);
font-size:11px}
.guide-columns li a{display:-webkit-box;
-webkit-line-clamp:2;
-webkit-box-orient:vertical;
overflow:hidden}
.breadcrumb{font-size:12px;
color:var(--muted);
margin-bottom:20px}
.breadcrumb ol{display:flex;
flex-wrap:wrap;
gap:7px}
.breadcrumb li+li:before{content:'›';
padding-right:7px}
.listing-layout{display:grid;
grid-template-columns:280px minmax(0,1fr) 300px;
gap:24px;
align-items:start}
.filters{background:var(--surface);
border:1px solid var(--border);
border-radius:8px;
padding:16px;
position:sticky;
top:135px}
.filter-form{display:grid;
gap:16px}
.filter-form>header{display:flex;
justify-content:space-between;
align-items:center}
.filter-form>header strong{font-size:14px}
.filter-form>header small{font-weight:400}
.filter-form>input{width:100%;
font-size:12px;
padding:7px 9px}
.filter-form select{font-size:12px;
padding:7px 9px}
.filter-form legend{font-size:12px;
color:#c4c4ca;
display:flex;
justify-content:space-between;
align-items:center}
.filter-form legend small{font-size:10px}
.filter-form output{color:var(--muted);
font-size:11px}
.range-labels{display:flex;
justify-content:space-between;
font-size:10px;
color:var(--muted)}
.filter-chips{display:flex;
flex-wrap:wrap;
gap:5px}
.filter-chips label{position:relative;
cursor:pointer;
flex:1 0 27%}
.filter-chips input{position:absolute;
opacity:0;
width:100%;
height:100%;
margin:0;
top:0;
left:0;
cursor:pointer}
.filter-chips span{display:block;
background:var(--raised);
border:1px solid var(--border);
border-radius:4px;
text-align:center;
padding:3px 5px;
font-size:11px;
color:#b5b5bf;
white-space:nowrap}
.filter-chips input:checked+span{border-color:var(--accent);
color:var(--pink);
background:#341822}
.filter-chips input:focus-visible+span{outline:2px solid var(--pink);
outline-offset:2px}
.filter-form details{border-top:1px solid var(--border);
padding-top:12px}
.filter-form summary{color:var(--muted);
font-size:13px}
.filter-form details label{display:block;
font-size:12px;
margin-top:12px}
.filter-submit{width:100%;
font-size:12px}
.results-toolbar{display:flex;
align-items:center;
gap:10px;
margin-bottom:16px;
min-height:40px}
.sort-tabs{display:flex;
gap:6px;
align-items:center}
.sort-tabs>a,.sort-tabs>button{padding:4px 10px;
color:var(--muted);
border:1px solid transparent;
border-radius:20px;
font-size:12px;
white-space:nowrap}
.sort-tabs>.active{color:var(--pink);
border-color:#772338;
background:#31131e}
.result-count{margin-left:auto;
font-size:11px;
color:var(--muted)}
.filter-open{display:none}
.listing-results .person-grid{gap:16px}
.listing-results .card-copy{padding:9px 10px}
.listing-results .card-copy h3{font-size:14px}
.listing-results .card-bottom strong{font-size:17px}
.listing-results .measurements{font-size:11px}
.listing-results .card-bottom>span{font-size:11px}
.listing-aside{display:grid;
gap:20px}
.listing-aside .panel{padding:12px}
.listing-aside .section-heading{gap:5px;
margin-bottom:10px}
.listing-aside h2{font-size:12px;
margin:0;
gap:4px}
.listing-aside h2 .icon{width:16px;
height:16px;
color:var(--gold)}
.listing-aside .section-heading .more-link{font-size:9px}
.listing-aside .section-heading .more-link .icon{display:none}
.mini-ranking li{position:relative;
margin:10px 0}
.mini-ranking a{display:flex;
gap:8px;
align-items:start;
min-height:55px;
padding-left:24px}
.mini-ranking .rank{position:absolute;
left:0;
top:0;
min-width:20px;
height:23px;
font-size:14px}
.mini-ranking img{width:42px;
height:56px;
object-fit:cover;
border-radius:4px}
.mini-ranking strong{font-size:12px}
.mini-ranking p{font-size:10px;
color:var(--muted);
margin:3px 0}
.mini-ranking b{position:absolute;
bottom:0;
right:0;
font-size:11px;
color:var(--pink)}
.mini-ranking li:first-child a{padding-left:0;
display:grid;
grid-template-columns:1fr}
.mini-ranking li:first-child img{width:100%;
height:130px}
.listing-aside .activity-preview>ul{display:block}
.listing-aside .activity-preview .section-heading small{display:none}
.listing-aside .activity-preview{margin:0}
.listing-aside .activity-preview li{padding:10px 8px}
.pagination{display:flex;
gap:7px;
justify-content:center;
flex-wrap:wrap;
margin:30px 0}
.pagination a{border:1px solid var(--border);
border-radius:5px;
padding:5px 12px;
color:var(--muted)}
.pagination a[aria-current]{color:var(--pink);
border-color:var(--accent);
background:#30141e}
.pagination-gap{display:inline-flex;
align-items:center;
padding:5px 4px;
color:var(--muted)}
.city-overview{margin-bottom:20px}
.city-overview h2{font-size:16px}
.city-overview dl{display:grid;
grid-template-columns:repeat(4,1fr);
gap:16px;
margin:0}
.city-overview dt{font-size:12px;
color:var(--muted)}
.city-overview dd{margin:6px 0 0;
font-size:14px}
.service-tabs,.tabs,.category-tabs{display:flex;
gap:20px;
flex-wrap:wrap;
margin:20px 0;
border-bottom:1px solid var(--border);
padding-bottom:12px;
color:var(--muted)}
.tabs a,.category-tabs a{padding:5px 10px}
.tabs a.active,.service-tabs a.active,.category-tabs a.active{color:var(--pink);
border-bottom:2px solid var(--accent)}
.listing-after{margin-top:50px}
.listing-after>section>p,#about-ranking>p{color:var(--muted)}
.rank-columns{display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:32px;
margin-bottom:32px}
.rank-columns.single{grid-template-columns:minmax(0,1fr);
max-width:900px;
margin-left:auto;
margin-right:auto}
.rank-podium{display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:12px;
margin-bottom:14px}
.rank-podium .person-card{border-top:2px solid var(--gold)}
.rank-podium>li:nth-child(2) .person-card{border-color:#b9bec6}
.rank-podium>li:nth-child(3) .person-card{border-color:#9b6530}
.rank-columns h2{font-size:18px}
.rank-podium .card-bottom{flex-wrap:wrap}
.ranking-rows>li{display:flex;
align-items:center;
gap:12px;
border-bottom:1px solid #17171f;
padding:9px 0}
.ranking-rows a{display:flex;
gap:12px;
align-items:start;
position:relative;
flex:1;
min-width:0;
min-height:86px}
.ranking-rows img{width:64px;
height:86px;
object-fit:cover;
border-radius:5px}
.ranking-rows h3{font-size:14px;
padding-right:35px}
.ranking-rows p{font-size:12px;
color:var(--muted);
margin:6px 0}
.ranking-rows small{font-size:11px}
.ranking-rows small .icon{width:12px;
height:12px;
color:var(--pink)}
.ranking-rows strong{position:absolute;
right:0;
bottom:0;
color:var(--pink);
font-size:18px}
.new-label{position:absolute;
right:0;
top:0;
color:var(--pink);
font-size:11px}
.faq h2{font-size:20px;
margin-bottom:16px}
.faq details{margin-bottom:18px}
.faq summary{font-weight:600;
font-size:14px;
list-style:none}
.faq summary:after{content:'−';
float:right;
color:var(--muted)}
.faq details:not([open]) summary:after{content:'+'}
.faq p{font-size:14px}
.person-top{display:grid;
grid-template-columns:1fr 1.07fr;
gap:32px;
margin-bottom:24px;
align-items:start}
.gallery{padding-top:28px}
.gallery .gallery-image{padding:0;
display:block;
width:100%;
border-radius:8px;
overflow:hidden}
.gallery .gallery-image img{aspect-ratio:3/4;
object-fit:cover}
.gallery-thumbs{display:flex;
gap:10px;
margin-top:12px}
.gallery-thumbs button{width:56px;
padding:0;
border:2px solid transparent;
border-radius:5px;
position:relative;
overflow:hidden}
.gallery-thumbs button[aria-pressed=true]{border-color:var(--pink)}
.gallery-thumbs span{position:absolute;
bottom:0;
left:0;
right:0;
background:#0b0b0fcc;
font-size:10px}
.detail-heading h1{font-size:28px;
margin-bottom:8px}
.detail-heading h1 small{font-size:16px;
color:var(--muted);
font-weight:400}
.detail-heading>p{font-size:12px;
color:var(--muted);
margin-bottom:18px}
.profile-panel{padding:20px}
.profile-price{color:var(--muted);
margin:0 0 20px}
.profile-price>strong{font-size:32px;
color:var(--pink)}
.profile-price>small{float:right;
margin-top:12px;
font-size:10px}
.plans{margin-bottom:24px}
.plans legend{font-size:13px;
color:var(--muted)}
.plans label{display:block;
position:relative;
cursor:pointer}
.plans input{position:absolute;
opacity:0;
left:0;
width:100%;
height:100%;
margin:0}
.plans label>span{display:block;
padding:12px;
background:var(--raised);
border:1px solid var(--border)}
.plans label:first-of-type>span{border-radius:6px 6px 0 0}
.plans label:last-of-type>span{border-radius:0 0 6px 6px}
.plans input:checked+span{border-color:#94354d;
background:#281820}
.plans input:focus-visible+span{outline:2px solid var(--pink)}
.plans b{font-weight:400;
display:block}
.plans small{display:block;
margin-top:4px}
.plans small strong{color:var(--pink)}
.profile-panel h2{font-size:13px;
font-weight:400;
border-top:1px solid var(--border);
padding-top:18px;
color:var(--muted)}
.profile-panel h2 .icon{width:14px;
height:14px}
.person-specs{display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:10px 18px;
margin:10px 0}
.person-specs>div{display:flex;
justify-content:space-between;
gap:10px}
.person-specs dt{font-size:12px;
color:var(--muted)}
.person-specs dd{margin:0;
font-size:14px;
font-weight:600}
.profile-panel>p.muted{font-size:12px}
.book-button{width:100%;
margin-top:18px}
.detail-columns{display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:24px;
align-items:start}
.person-detail>.panel{border:0}
.detail-columns h2,.person-detail>.panel h2{font-size:20px}
.addon-list{margin:0;
border:1px solid var(--border);
border-radius:6px;
background:var(--raised)}
.addon-list>div{display:flex;
justify-content:space-between;
padding:12px;
border-bottom:1px solid var(--border)}
.addon-list>div:last-child{border:0}
.addon-list dd{margin:0;
color:var(--pink)}
.person-detail .faq{margin-bottom:0}
.person-detail p{color:var(--muted)}
.reviews .sort-tabs{border-top:1px solid var(--border);
padding-top:12px}
.review-sort{margin-left:auto}
.review-sort select{font-size:12px;
padding:5px 10px;
border-radius:20px}
.review-list>li{display:flex;
gap:12px;
margin-top:24px;
font-size:13px}
.review-list time,.review-list a{color:var(--muted);
font-size:11px}
.avatar{width:30px;
height:30px;
border-radius:50%;
border:1px solid var(--border);
display:inline-flex;
align-items:center;
justify-content:center;
font-size:12px;
color:var(--muted);
background:var(--raised);
flex:none}
.article-grid{display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:16px;
margin-top:16px}
.article-card{border:1px solid var(--border);
border-radius:8px;
overflow:hidden;
background:var(--surface);
height:100%}
.article-card img{aspect-ratio:16/9;
object-fit:cover}
.article-card a>div{padding:16px}
.article-card h3{font-size:16px;
line-height:1.5}
.article-card p{font-size:13px;
color:var(--muted);
display:-webkit-box;
-webkit-line-clamp:2;
-webkit-box-orient:vertical;
overflow:hidden;
margin:10px 0 24px}
.article-card time{font-size:12px}
.article-category>header{display:flex;
justify-content:space-between;
border-bottom:1px solid var(--border);
align-items:center;
padding-bottom:10px}
.article-category h2{font-size:20px}
.article-category>p{font-size:13px;
color:var(--muted)}
.article-category li{display:flex;
justify-content:space-between;
gap:20px;
padding:12px 0;
border-bottom:1px solid #1c1c24;
font-size:13px}
.article-category time{font-size:11px;
white-space:nowrap}
.article-list{display:grid;
gap:16px}
.article-list article>a{display:flex;
gap:20px;
align-items:center;
border:1px solid var(--border);
border-radius:8px;
padding:20px;
background:var(--surface)}
.article-list img{width:160px;
aspect-ratio:16/9;
object-fit:cover;
border-radius:5px}
.article-list h2{font-size:18px}
.article-list p{color:var(--muted);
font-size:13px}
.article-list time{font-size:12px}
.article-number{font-size:22px;
font-weight:bold;
color:var(--pink)}
.article-list article>a>.icon{margin-left:auto;
flex:none;
color:var(--muted)}
.article-detail{max-width:900px;
margin:auto}
.article-detail h1{font-size:30px;
line-height:1.5;
margin:14px 0}
.article-cover{border-radius:8px;
margin-bottom:30px}
.article-cover img{aspect-ratio:16/9;
object-fit:cover}
.article-lead{font-size:17px;
color:var(--muted);
line-height:1.9}
.article-toc{margin:32px 0}
.article-toc h2{font-size:18px}
.article-toc ol{list-style:decimal;
padding-left:22px;
display:grid;
gap:8px;
color:var(--muted)}
.article-detail>section{margin:36px 0;
scroll-margin-top:140px}
.article-detail>section>p{font-size:16px;
line-height:1.9;
color:#b8b8c0;
margin:18px 0}
.table-scroll{overflow:auto}
table{border-collapse:collapse;
width:100%;
font-size:14px}
caption{text-align:left;
color:var(--muted);
padding-bottom:10px}
th,td{padding:12px;
border:1px solid var(--border);
text-align:left}
th{background:var(--raised)}
.article-callout{background:var(--surface);
padding:24px;
border-left:3px solid var(--accent);
margin:40px 0}
.article-callout p{color:var(--muted);
margin:12px 0 20px}
.activity-page{max-width:960px}
.activity-controls{display:flex;
gap:12px;
align-items:center;
margin-bottom:24px}
.activity-controls fieldset{display:flex;
flex-wrap:nowrap}
.activity-controls .filter-chips span{padding:8px 18px;
border-radius:20px}
.activity-controls select{min-width:100px}
.activity-controls .select-field{margin-left:auto}
.activity-feed{display:grid;
gap:16px}
.activity-feed article{border:1px solid var(--border);
border-radius:8px;
background:var(--surface);
padding:20px}
.activity-feed article>header{display:flex;
gap:12px;
align-items:center;
font-size:13px}
.activity-feed header a{display:flex;
gap:12px;
align-items:center}
.activity-feed header img{width:44px;
height:44px;
border-radius:50%;
object-fit:cover}
.activity-feed header time{margin-left:auto;
font-size:11px}
.activity-feed article>p{color:#c0c0c8;
margin:16px 0}
.activity-feed article>footer{display:flex;
align-items:center;
gap:8px;
font-size:12px;
color:var(--muted)}
.activity-feed article>footer>span:last-child{margin-left:auto}
.load-more{display:flex;
justify-content:center;
margin:24px auto}
.form-status:empty{display:none}
.form-status{padding:12px;
border:1px solid #5b3040;
border-radius:6px;
color:#e9bcc9;
font-size:13px}
.policy-container{max-width:850px}
.policy-page h1{margin-bottom:16px;
font-size:28px}
.policy-page section{margin:28px 0}
.policy-page h2{font-size:21px}
.policy-page p{color:var(--muted);
line-height:1.9}
.empty-state{padding:100px 20px;
text-align:center}
.empty-state p{color:var(--muted);
margin:12px 0 24px}
.error-code{font-size:72px;
color:var(--pink)!important;
font-weight:700;
margin:0!important}
.site-footer{border-top:1px solid var(--border);
background:var(--surface);
margin-top:auto}
.footer-main{display:grid;
grid-template-columns:minmax(0,1fr) minmax(0,1.5fr) minmax(0,max-content);
gap:32px;
padding-top:32px;
padding-bottom:32px;
align-items:center}
.footer-main>*{min-width:0}
.footer-main .brand{min-width:0;
max-width:100%;
overflow:hidden}
.footer-main .brand{display:flex;
flex-direction:column;
align-items:flex-start;
gap:8px}
.footer-main .brand strong,.footer-main .brand small{min-width:0;
max-width:100%;
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap}
.footer-main p{overflow-wrap:anywhere;
color:var(--muted);
font-size:13px;
margin:20px 0 0}
.footer-main nav,.footer-main nav ul{min-width:0}
.footer-main nav ul{display:flex;
gap:14px 24px;
flex-wrap:wrap;
max-width:330px;
color:var(--muted)}
.footer-contact{text-align:right}
.footer-contact .button{font-size:14px;
margin-left:8px}
.footer-contact p{font-size:12px;
margin-top:10px}
.footer-bottom{display:flex;
justify-content:space-between;
gap:20px;
align-items:center;
border-top:1px solid var(--border);
font-size:12px;
padding-top:16px;
padding-bottom:16px;
color:var(--muted)}
.footer-bottom p{margin:0}
.footer-bottom nav{display:flex;
gap:16px;
align-items:center;
flex-wrap:wrap}
.age-label{border:1px solid #c6c6cb;
border-radius:3px;
padding:0 5px;
color:#ddd;
margin-right:8px}
dialog{background:var(--surface);
color:var(--text);
border:1px solid var(--border);
border-radius:12px;
padding:0;
width:min(520px,calc(100% - 32px));
max-height:calc(100dvh - 32px);
box-shadow:0 20px 80px #0008}
dialog::backdrop{background:#000a;
backdrop-filter:blur(3px)}
.dialog-header{display:flex;
justify-content:space-between;
align-items:center;
padding:14px 20px;
border-bottom:1px solid var(--border);
background:var(--raised);
position:sticky;
top:0;
z-index:1}
.dialog-header h2{font-size:18px}
.dialog-content{padding:24px;
display:grid;
gap:14px}
.dialog-content p{margin:0}
.dialog-content label{display:grid;
gap:7px}
.filter-dialog .dialog-content{padding:20px}
.filter-dialog .filter-form{gap:18px}
.filter-dialog .filter-chips label{flex:0 0 30%}
.image-dialog{width:min(700px,calc(100% - 32px));
background:#111118}
.image-dialog>button{position:fixed;
margin:10px;
background:#0b0b0fee}
.image-dialog img{height:80dvh;
object-fit:contain}
.dialog-feedback{font-size:12px;
color:var(--pink)}

@media(min-width:1280px){.listing-layout{grid-template-columns:280px minmax(0,1fr) 300px}
.listing-results .card-bottom{flex-wrap:wrap}
.listing-results .card-bottom strong{margin-left:auto}
}

@media(min-width:1500px){.listing-layout{grid-template-columns:260px minmax(0,1fr) 280px}
}

@media(max-width:1279px){.listing-layout{grid-template-columns:240px minmax(0,1fr)}
.listing-aside{display:none}
.quick-filter{grid-template-columns:repeat(4,minmax(0,1fr)) 130px}
.region-links{grid-template-columns:1fr}
.nation-grid.compact{grid-template-columns:repeat(4,minmax(0,1fr))}
.guide-columns{grid-template-columns:repeat(2,minmax(0,1fr))}
.person-grid{gap:12px}
.card-bottom strong{font-size:17px}
.card-copy{padding:9px}
.card-copy h3{font-size:14px}
.footer-main{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.footer-contact{grid-column:2;
grid-row:1}
.footer-main>nav{grid-column:1/-1}
.footer-main nav ul{max-width:none}
.listing-results .card-bottom{flex-wrap:wrap}
.rank-podium .card-bottom strong{font-size:16px}
.rank-podium .card-copy{padding:8px}
.ranking-rows strong{font-size:16px}
}

@media(max-width:1023px){.person-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.listing-results .person-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.listing-layout{grid-template-columns:220px minmax(0,1fr);
gap:16px}
.card-bottom strong{font-size:20px}
.rank-columns{gap:20px}
.rank-podium{gap:8px}
.rank-podium .measurements{font-size:10px}
.rank-podium .card-copy h3{font-size:12px}
.rank-podium .rating{font-size:10px}
.nation-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.person-top{gap:24px}
.gallery{padding-top:24px}
.person-specs{gap:10px}
.person-specs>div{gap:4px}
.person-specs dd{font-size:12px}
.quick-filter{grid-template-columns:repeat(2,minmax(0,1fr))}
.quick-filter>.button{grid-column:1/-1}
.quick-filter>.select-field:nth-last-of-type(1){display:block}
.footer-bottom{flex-direction:column;
align-items:start}
}

@media(max-width:767px){body{font-size:13px}
.container,.header-inner{padding-left:16px;
padding-right:16px}
main.container{padding-top:16px;
padding-bottom:40px}
h1{font-size:23px}
h2{font-size:18px}
.site-header{position:sticky}
.header-top{height:48px}
.brand strong{font-size:25px}
.brand small{font-size:9px}
.header-actions{gap:5px}
.header-actions .icon-button{width:32px;
height:32px}
.main-nav{padding:6px 0 10px}
.main-nav ul{gap:6px;
margin-right:-16px;
padding-right:16px}
.main-nav a,.main-nav button{font-size:12px;
line-height:18px;
padding:4px 12px}
.nav-contact{padding-left:7px}
.hero{margin-top:-16px;
margin-left:-16px;
margin-right:-16px;
aspect-ratio:1.32/1;
border:0;
border-radius:0}
.hero img{object-fit:cover}
.hero-dots{bottom:8px}
.section-space{margin-bottom:32px}
.section-heading{gap:10px;
margin-bottom:12px}
.section-heading h2{font-size:18px;
gap:6px}
.section-heading h2 .icon{width:20px;
height:20px}
.section-heading small{display:none}
.more-link{font-size:11px}
.announcement{padding:5px 6px;
height:36px;
margin-bottom:12px;
gap:8px}
.announcement>span{font-size:10px;
padding:3px 8px}
.announcement>a{font-size:11px}
.announcement time{display:none}
.booking-strip{padding:8px 12px;
min-height:48px;
margin-bottom:20px;
background:var(--accent);
justify-content:center;
gap:8px}
.booking-icon{width:25px;
height:25px;
background:none}
.booking-icon .icon{width:20px;
height:20px}
.booking-strip h2{font-size:14px}
.booking-strip p{font-size:10px;
color:#fff}
.booking-strip>.button{font-size:11px;
padding:4px 8px;
min-height:30px;
position:absolute;
opacity:0;
inset:0;
width:100%;
height:100%;
border-radius:6px}
.booking-strip{position:relative}
.quick-filter{display:none}
.mobile-filter-summary{display:block;
background:var(--surface);
border:1px solid var(--border);
padding:12px;
border-radius:8px}
.mobile-filter-summary>strong{font-size:12px}
.mobile-filter-summary p{font-size:11px;
color:var(--muted);
margin:3px 0 9px}
.mobile-filter-summary .button{padding:6px 9px;
min-height:30px;
font-size:11px}
.mobile-filter-summary .icon{width:13px;
height:13px}
.region-panel{padding:12px}
.city-chips{gap:8px 10px;
padding-bottom:12px}
.city-chips li{flex:1 0 13%;
text-align:center}
.city-chips a{font-size:11px;
padding:3px 0!important}
.city-chips small{display:none}
.city-chips .pill{background:var(--raised);
border:0}
.region-links{gap:6px}
.region-links>li{gap:10px;
padding:4px 5px}
.region-links a{font-size:10px}
.region-links a span{font-size:9px}
.region-links .city-label{min-width:42px;
padding:2px 6px}
.region-links>li a:nth-child(n+5){display:none}
.activity-preview>ul{grid-template-columns:1fr}
.activity-preview li{padding:12px}
.activity-preview>.section-heading{padding:9px 12px}
.activity-preview h2{font-size:12px}
.activity-preview li a>div{padding-right:30px}
.person-grid,.listing-results .person-grid,.columns-4,.columns-5{grid-template-columns:repeat(2,minmax(0,1fr));
gap:12px}
.card-copy{padding:9px 10px 10px}
.card-copy h3{font-size:14px}
.measurements{font-size:11px}
.card-bottom{gap:2px;
flex-wrap:wrap;
margin-top:7px}
.card-bottom strong{font-size:18px;
margin-left:auto}
.card-bottom>span{font-size:11px}
.rating{font-size:10px}
.rank{min-width:26px;
height:28px;
font-size:17px}
.shelf-controls button{position:static;
width:30px;
height:28px;
background:none;
font-size:20px}
.shelf-controls{margin-top:5px}
.rank-links{gap:14px;
font-size:11px;
margin-top:-14px;
margin-bottom:30px}
.nation-grid,.nation-grid.compact{grid-template-columns:repeat(2,minmax(0,1fr));
gap:10px}
.nation-grid.compact figure{aspect-ratio:1.65/1}
.nation-grid.compact figcaption{padding:10px}
.nation-grid.compact figcaption h3{font-size:13px}
.nation-grid.compact figcaption p{font-size:10px;
margin:2px 0}
.nation-grid.compact figcaption strong{font-size:11px}
.country-mark{font-size:9px;
left:8px;
top:8px}
.nation-grid figcaption{padding:14px}
.nation-grid figcaption h2{font-size:18px}
.nation-grid figcaption p{font-size:12px}
.guide-columns{grid-template-columns:1fr;
gap:24px;
padding:16px}
.guide-panel>.section-heading h2{font-size:13px}
.guide-columns section{border-bottom:1px solid var(--border);
padding-bottom:16px}
.guide-columns section:last-child{border:0;
padding:0}
.listing-layout{display:block}
.filters{display:none}
.listing-results .measurements{font-size:11px}
.listing-results .card-copy h3{font-size:14px}
.listing-results .card-bottom strong{font-size:18px}
.filter-open{display:inline-flex;
font-size:12px;
padding:5px 9px;
min-height:30px;
gap:4px}
.filter-open .icon{width:15px;
height:15px}
.results-toolbar{gap:6px;
flex-wrap:wrap}
.sort-tabs{gap:2px}
.sort-tabs>a,.sort-tabs>button{font-size:11px;
padding:4px 8px}
.result-count{font-size:10px}
.breadcrumb{font-size:10px;
margin-bottom:16px}
.page-heading{margin-bottom:20px}
.page-heading h1{font-size:23px}
.page-heading p{font-size:12px}
.city-overview{padding:14px}
.city-overview dl{grid-template-columns:repeat(2,1fr);
gap:16px}
.city-overview h2{font-size:14px}
.city-overview dd{font-size:12px}
.service-tabs,.tabs,.category-tabs{font-size:12px;
gap:12px}
.listing-after{margin-top:32px}
.rank-columns{grid-template-columns:1fr;
gap:28px}
.rank-columns h2{font-size:16px}
.rank-podium{gap:8px}
.rank-podium .card-copy h3{font-size:11px}
.rank-podium .measurements{font-size:9px;
white-space:nowrap}
.rank-podium .card-copy{padding:6px}
.rank-podium .card-bottom strong{font-size:15px;
margin-left:0}
.rank-podium .card-bottom>span{font-size:10px}
.rank-podium .rating{font-size:9px}
.rank-podium .person-card .rank{min-width:21px;
height:24px;
font-size:15px;
top:4px;
left:4px}
.ranking-rows .rank{min-width:24px;
height:24px;
font-size:14px}
.ranking-rows>li{gap:9px}
.ranking-rows h3{font-size:13px}
.ranking-rows p{font-size:11px}
.ranking-rows strong{font-size:16px}
.faq h2{font-size:18px}
.faq p,.faq summary{font-size:13px}
.person-top{grid-template-columns:1fr;
gap:20px}
.gallery{padding:0}
.gallery .gallery-image img{aspect-ratio:3/4;
max-height:650px;
object-fit:contain;
background:var(--raised)}
.gallery-thumbs{justify-content:center}
.detail-heading h1{font-size:24px}
.detail-heading h1 small{font-size:13px}
.profile-panel{padding:16px}
.person-specs dd{font-size:14px}
.detail-columns{grid-template-columns:1fr;
gap:16px}
.detail-columns .panel{padding:16px}
.person-detail>.panel{padding:16px}
.profile-price>strong{font-size:30px}
.review-list>li{font-size:12px}
.review-sort select{max-width:90px}
.article-grid{grid-template-columns:1fr}
.article-card img{aspect-ratio:16/9}
.article-category h2{font-size:18px}
.article-category li{gap:12px;
font-size:12px}
.article-category time{font-size:10px}
.article-list article>a{gap:12px;
padding:12px;
flex-wrap:wrap;
position:relative}
.article-number{font-size:18px;
width:20px}
.article-list img{width:calc(100% - 40px);
aspect-ratio:16/9}
.article-list article>a>.icon{display:none}
.article-list h2{font-size:16px}
.article-list p{font-size:12px}
.article-detail h1{font-size:24px}
.article-detail>section>p{font-size:14px}
.article-toc{padding:18px}
.article-lead{font-size:15px}
.article-detail h2{font-size:20px}
.article-cover{margin-bottom:20px}
.article-toc li{font-size:13px}
.activity-controls{gap:6px;
flex-wrap:wrap}
.activity-controls .filter-chips span{padding:6px 10px}
.activity-controls select{min-width:75px;
padding:6px 8px;
font-size:12px}
.activity-controls .button{padding:6px 10px;
font-size:12px}
.activity-feed article{padding:14px}
.activity-feed header{gap:7px!important}
.activity-feed header a{gap:8px}
.activity-feed header strong{font-size:12px}
.activity-feed header time{font-size:10px;
white-space:nowrap}
.activity-feed header img{width:32px;
height:32px}
.activity-feed header .rating{font-size:10px}
.activity-feed article>p{font-size:13px}
.policy-page h1{font-size:25px}
.policy-page h2{font-size:19px}
.policy-page p{font-size:13px}
.footer-main{display:flex;
flex-direction:column;
align-items:start;
gap:20px;
padding-top:26px;
padding-bottom:26px}
.footer-main p{font-size:12px;
margin-top:14px}
.footer-main>nav{order:3}
.footer-main nav ul{gap:12px 18px;
font-size:12px;
max-width:330px}
.footer-contact{text-align:left}
.footer-contact .button{margin:0 8px 0 0;
font-size:12px;
padding:8px 12px}
.footer-contact p{font-size:11px}
.footer-bottom{font-size:10px;
padding-top:14px;
padding-bottom:20px;
gap:12px}
.footer-bottom small{font-size:10px}
.footer-bottom nav{gap:12px}
.dialog-content{padding:20px}
.filter-dialog{width:100%;
max-width:none;
max-height:88dvh;
position:fixed;
bottom:0;
top:auto;
margin:0;
border-radius:14px 14px 0 0}
.dialog-header h2{font-size:17px}
.dialog-content input:not([type=radio],[type=checkbox],[type=range]),.dialog-content textarea{font-size:16px}
.filter-dialog input{font-size:14px}
.empty-state{padding:70px 10px}
}

@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;
transition:none!important;
scroll-behavior:auto!important}
}

/* Match the reference's hydrated mobile layout and native dialog controls. */
.mobile-ranking,.mobile-city,.mobile-sort{display:none}
.filters{max-height:calc(100dvh - 150px);
overflow-y:auto;
scrollbar-width:thin}
.booking-form{gap:24px}
.booking-form .filter-chips{gap:8px}
.booking-form .filter-chips label{flex:0 0 auto;
display:block}
.booking-form .filter-chips span{font-size:14px;
padding:5px 13px;
border-radius:20px}
.booking-form legend{margin-bottom:12px}
.booking-districts{max-height:180px;
overflow:auto}
.booking-form .booking-date{margin-top:14px}
.booking-submit{position:sticky;
bottom:-24px;
background:var(--surface);
padding:14px 0 0;
border-top:1px solid var(--border)}
.booking-submit>.button{width:100%}
.booking-submit>p{font-size:12px;
text-align:center;
margin-top:10px}
.booking-form>label>select{font-size:14px}
[data-save][aria-pressed=true],[data-like][aria-pressed=true]{color:var(--pink);
border-color:var(--accent)}

@media(max-width:767px){
.header-top{height:56px}
.main-nav{padding:10px 0 12px}
.main-nav a,.main-nav button{font-size:14px;
line-height:18px;
padding:5px 12px}
.main-nav ul{gap:7px}
.main-nav{height:50px}
.header-inner .brand small{display:none}
main.container{padding-top:24px}
.hero{margin-top:0;
margin-bottom:40px;
aspect-ratio:4/3}
.announcement{height:44px;
margin-bottom:16px}
.announcement>span{font-size:12px;
padding:5px 10px}
.announcement>a{font-size:14px}
.booking-strip{min-height:52px;
padding:10px 14px;
margin-bottom:24px;
color:#fff}
.booking-strip h2{color:#fff;
font-size:16px}
.booking-strip>div:nth-child(2){display:flex;
gap:10px;
align-items:center}
.booking-strip p{font-size:12px}
.quick-filter{display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:8px;
background:var(--surface);
border:1px solid var(--border);
border-radius:10px;
padding:12px}
.quick-filter>.button{grid-column:1/-1}
.quick-filter input,.quick-filter select,.quick-filter .button{font-size:14px;
height:44px}
.mobile-filter-summary{display:none}
.mobile-ranking{display:block;
margin-bottom:24px}
.mobile-ranking .section-heading h2{font-size:16px}
.mobile-ranking .more-link{font-size:12px}
.mobile-ranking>ol{display:flex;
gap:10px;
overflow-x:auto;
scrollbar-width:none;
margin-right:-16px;
padding-right:16px}
.mobile-ranking>ol>li{flex:0 0 104px}
.mobile-ranking .person-card{border:1px solid var(--border)}
.mobile-ranking .person-card figure{aspect-ratio:1.1/1}
.mobile-ranking .card-copy{padding:6px}
.mobile-ranking .measurements,.mobile-ranking .rating,.mobile-ranking .card-bottom>span{display:none}
.mobile-ranking .card-copy h3{font-size:12px}
.mobile-ranking .card-bottom{margin-top:3px}
.mobile-ranking .card-bottom strong{font-size:14px;
margin-left:0}
.mobile-ranking .rank{min-width:28px;
height:30px}
.mobile-city,.mobile-sort{display:block;
max-width:100px}
.mobile-city select,.mobile-sort select{font-size:13px;
padding:6px 9px;
background:var(--bg)}
.mobile-sort{margin-left:auto}
.listing-results>.results-toolbar>.sort-tabs,.listing-results>.results-toolbar>.result-count{display:none}
.results-toolbar{margin-bottom:20px}
.listing-results .filter-open{background:#16161d;
border-color:var(--border);
padding:6px 10px;
font-size:14px}
.listing-results .filter-open .icon{color:var(--pink)}
#booking-dialog{max-height:calc(100dvh - 48px);
width:100%;
margin:48px 0 0;
max-width:none;
position:fixed;
top:0;
border:0;
border-radius:14px 14px 0 0}
.booking-form{padding:20px 24px}
.booking-submit{bottom:-20px}
.booking-form>p{font-size:12px}
.filter-dialog{max-height:65dvh}

}


/* Container-relative sizing: the complete capsule scales with its photo. */
.person-card .card-media{position:relative;
container-type:inline-size}

.person-card .card-media>a{display:block}

.person-card>a.card-details{height:auto}

.card-voice{position:absolute;
left:6.15%;
bottom:3.69cqw;
display:flex;
align-items:center;
font-size:1cqw;
gap:3.28em;
width:34.02em;
height:12.3em;
padding:0 3.28em;
border:0;
border-radius:6.15em;
background:rgba(42,64,86,.3);
color:#fff;
cursor:pointer;
isolation:isolate;
transition:background .18s}

.card-voice:before{content:"";
position:absolute;
inset:min(-7px,-2.87em) 0;
z-index:-1}

.card-voice:hover{background:rgba(42,64,86,.65)}

.card-voice:focus-visible{outline:2px solid #fff;
outline-offset:3px}

.card-voice .icon{display:block;
width:9.02em;
height:9.02em}

.card-voice .voice-pause{display:none}

.voice-progress{position:absolute;
inset:0;
overflow:hidden;
border-radius:inherit;
z-index:-1;
pointer-events:none}

.voice-progress>span{display:block;
width:var(--voice-progress,0%);
height:100%;
background:rgba(255,255,255,.5)}

.card-voice[aria-pressed=true] .voice-play{display:none}

.card-voice[aria-pressed=true] .voice-pause{display:block}

.voice-wave{display:flex;
align-items:center;
justify-content:space-between;
flex:1;
height:9.02em}

.voice-wave>span{width:1.64em;
height:var(--bar-height);
border-radius:1.64em;
background:currentColor;
transform-origin:center}

.card-voice[aria-pressed=true] .voice-wave>span{animation:voice-wave .8s ease-in-out infinite alternate;
animation-delay:var(--bar-delay)}

@keyframes voice-wave{from{transform:scaleY(.35)}
to{transform:scaleY(1)}
}

@media(prefers-reduced-motion:reduce){.card-voice[aria-pressed=true] .voice-wave>span{animation:none}
.card-voice{transition:none}
}


.home-catalog{scroll-margin-top:130px}
.home-catalog .listing-layout{grid-template-columns:240px minmax(0,1fr)}

@media(max-width:767px){.home-catalog .listing-layout{grid-template-columns:minmax(0,1fr)}
}


.header-contact{display:flex;
align-items:center;
justify-content:center;
gap:8px;
padding:8px 14px;
min-height:40px;
border:0;
border-radius:24px;
background:var(--accent);
color:#fff;
font-size:13px;
white-space:nowrap;
flex-shrink:0}
.header-contact .icon{width:22px;
height:22px}
.header-top{gap:12px}


/* Keep the site title, navigation and contact action on one desktop row. */
@media(min-width:768px){
 .site-header .header-inner{display:grid;
grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);
align-items:center;
column-gap:12px;
min-height:76px}

 .site-header .header-top{display:contents}

 .site-header .header-top>.brand{grid-column:1;
grid-row:1;
justify-self:start;
width:100%;
min-width:0;
max-width:100%;
overflow:hidden}
.site-header .brand strong,.site-header .brand small{min-width:0;
max-width:100%;
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap}
.site-header .brand small{display:none}

 .site-header .header-contact,.site-header .header-actions{grid-column:3;
grid-row:1;
justify-self:end;
min-width:0;
max-width:100%;
gap:8px}

 .site-header .header-actions .button{white-space:nowrap;
padding-left:12px;
padding-right:12px}

 .site-header .main-nav{grid-column:2;
grid-row:1;
min-width:0;
max-width:100%;
padding:0}

 .site-header .main-nav ul{justify-content:center;
margin:0;
padding:0;
overflow:visible}

}

@media(min-width:768px) and (max-width:1100px){
 .site-header .header-inner{grid-template-columns:minmax(0,1fr) minmax(0,1fr);
row-gap:4px;
padding-top:8px;
padding-bottom:8px}

 .site-header .header-top{display:contents}

 .site-header .header-top>.brand{grid-column:1;
grid-row:1}

 .site-header .header-contact,.site-header .header-actions{grid-column:2;
grid-row:1}

 .site-header .main-nav{grid-column:1/-1;
grid-row:2}

 .site-header .main-nav ul{justify-content:center;
overflow-x:auto}
}

@media(max-width:767px){
 .site-header .main-nav ul{display:grid;
grid-template-columns:repeat(4,minmax(0,1fr));
gap:7px;
margin:0;
padding:0;
overflow:visible}

 .site-header .main-nav a{text-align:center;
padding-inline:4px}

}


.detail-voice-media{position:relative;
container-type:inline-size}

/* Detail photo is larger than a card;
 keep its voice control more compact. */
.detail-voice-media .card-voice{left:3.15%;
font-size:.65cqw}


@media(min-width:768px){.detail-voice-media .card-voice{font-size:.5cqw}
}
