/* Existing WAWA site: navigation names, directory browsing and compact controls. */
.directory-controls {scroll-margin-top:24px}
.directory-controls .filter-bar {margin:14px 0 10px}
.directory-controls .region-control {margin:10px 0}
.directory-pagination {display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;margin:20px 0 28px}
.directory-pagination[hidden] {display:none}
.directory-pagination span {color:var(--pale)}
.directory-empty {grid-column:1/-1;padding:20px;border:1px solid var(--line);border-radius:8px}
#pool-status {scroll-margin-top:24px}
.artist-card-count:empty {display:none}
.ranking-filters .filter-bar {margin:0 0 12px}
.ranking-controls {display:grid;grid-template-columns:minmax(140px,.65fr) minmax(220px,1.5fr) minmax(200px,1fr);gap:16px;align-items:end;padding:16px}
.ranking-controls label,.ranking-controls .region-control {display:flex;flex-direction:column;align-items:stretch;gap:6px;margin:0;font-size:14px;min-width:0}
.ranking-controls input,.ranking-controls select {width:100%;margin:0;min-height:44px}
body[data-page=rankings] .page-intro {margin-bottom:20px}
body[data-page=rankings] .notice {margin:12px 0;padding:10px 16px}
body[data-page=rankings] .ranking-summary {padding:12px 16px}
.support-workspace {padding:0;margin-top:22px}
.support-workspace .support-grid {margin-top:16px}
.support-services {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.support-services .info-section {margin:0;padding:20px}
.support-services h2 {font-size:19px}
@media(max-width:760px){
 .ranking-controls {grid-template-columns:1fr;gap:12px}
 .ranking-controls label {margin:0}
 .directory-pagination {gap:8px}
 .directory-pagination .outline-button {padding:10px 12px}
 .support-services {grid-template-columns:1fr;gap:12px}
 .mobile-nav span {font-size:11px;line-height:1.4}
 .mobile-nav a {min-width:0;min-height:48px}
}

/* V12: support canvas ratios and narrow-screen readability. */
.support-grid{align-items:start}
.support-card .support-art{min-height:0;width:100%;aspect-ratio:1/1;gap:8px;overflow-wrap:anywhere}
.support-card:nth-child(2) .support-art{aspect-ratio:4/5}
.support-card:nth-child(3) .support-art{aspect-ratio:16/9}
.support-art h3,.support-art p{margin:0;line-height:1.5}
.support-art>span{font-size:clamp(28px,4vw,56px);line-height:1}
@media(max-width:760px){
 .support-art>span{font-size:40px}
 .support-card:nth-child(3) .support-art{padding:10px;gap:4px}
 .support-card:nth-child(3) .support-art>span{font-size:24px}
 .support-art h3{font-size:18px}
 .support-preview{font-size:14px}
 .region-control{flex-wrap:wrap}
 .region-control select,.toolbar input{max-width:100%;min-width:0}
 .ranking-row small{font-size:11px}
 .artist-card-body>small{font-size:12px}
}

/* V13: balanced slogans, calmer phone hero, six direct destinations. */
.slogan-part{display:inline-block;white-space:nowrap}
@media(max-width:760px){
 h1.mobile-slogan{font-size:clamp(24px,6.4vw,31px);line-height:1.5}
 .mobile-slogan .slogan-part{display:block}
 .mobile-nav{grid-template-columns:repeat(6,minmax(0,1fr))}
 .mobile-nav a{display:flex;flex-direction:column;justify-content:center;align-items:center;min-width:0;min-height:48px}
 .mobile-nav span{font-size:11px;letter-spacing:0;white-space:nowrap;line-height:1.4}
 .immersive-hero{background-image:linear-gradient(180deg,rgba(8,11,16,.8) 0%,rgba(8,11,16,.5) 45%,#080b10 82%),url('wawa-immersive-scene.png')}
 .hero-title h1{font-size:clamp(30px,8vw,35px);line-height:1.45;letter-spacing:0;text-shadow:none;max-width:none}
 .hero-title h1 em{color:#e9c47b}
 .hero-title p{font-size:14px;line-height:1.8;max-width:100%;color:#e7e3d9;text-shadow:none}
 .hero-title .hero-actions{display:flex;flex-wrap:wrap;gap:12px}
 .hero-title .gold-button,.hero-title .outline-button{min-height:44px;display:inline-flex;align-items:center;font-size:14px;padding:10px 16px}
}

/* V14: single-line requested captions, explicit footer lines, closer hero panels. */
.footer-name>span,.footer-slogan>span{display:block}
@media(max-width:760px){
 main,.content-section,.promo,.contact-hero,footer{container-type:inline-size}
 .single-line,h1.mobile-slogan.single-line{white-space:nowrap;letter-spacing:0;font-size:clamp(12px,5cqw,24px);line-height:1.6;max-width:100%}
 #contact-heading.single-line{font-size:clamp(12px,4.5cqw,22px)}
 .promo h2.single-line{font-size:clamp(12px,4.8cqw,22px)}
 .content-section .section-top{flex-wrap:wrap;align-items:center}
 .content-section .section-top>div{min-width:0;max-width:100%}
 .content-section .section-top>a{text-align:left}
 .hero-title{padding-bottom:20px}
 .immersive-hero{gap:16px}
 .hero-ranking{order:0}
 .hero-film{order:0}
 .footer-name>span,.footer-slogan>span{white-space:nowrap;font-size:clamp(12px,4cqw,16px);letter-spacing:0}
}