/* Large opening map. All geography and interactions use the existing SVG. */
.directory-pro .supara-main { padding-top:24px!important; }
.directory-pro .directory-heading { margin-bottom:20px; }
.directory-pro .directory-heading p,.directory-pro .directory-heading-note { display:none; }
.directory-pro .directory-heading h1 { font-size:1.625rem; margin:0; }
.directory-pro .page-kicker { margin-bottom:4px; }
.directory-map-hero { position:relative; margin-bottom:30px; border:1px solid #dde3ef; border-radius:16px; background:#fbfcff; box-shadow:0 10px 32px #25345d08; scroll-margin-top:20px; overflow:hidden; }
.map-hero-toolbar { display:flex; justify-content:space-between; align-items:center; gap:20px; padding:25px 30px 16px; position:relative; z-index:2; }
.map-eyebrow { display:block; color:#7367bb; font-size:.75rem; letter-spacing:.13em; font-weight:650; margin-bottom:6px; }
.map-hero-toolbar h2 { font-size:1.25rem; color:#323d55; font-weight:650; letter-spacing:-.025em; margin:0; }
.map-hero-actions { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.map-action { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:42px; padding:9px 14px; background:#fff; border:1px solid #dfe3ee; border-radius:8px; font:500 .875rem var(--bs-body-font-family); color:#5a657d; cursor:pointer; text-decoration:none; }
.map-action:hover,.map-action.is-active { color:#6554cd; background:#f2efff; border-color:#c9c0ed; }
.map-action:focus-visible { outline:3px solid #bcb2f4; outline-offset:3px; }
.map-action:disabled { color:#8390a6; background:#f5f7fb; border-color:#e6eaf1; cursor:default; }
.map-action-primary { color:white; background:#7367e9; border-color:#7367e9; box-shadow:0 3px 8px #7367e926; }
.map-action-primary:hover { background:#6558d9; color:#fff; }
.map-current { position:relative; z-index:2; display:flex; align-items:center; gap:8px; padding:0 30px; font-size:.875rem; color:#65558f; }
.map-location-dot { width:7px; height:7px; flex-shrink:0; background:#8975d2; border-radius:50%; box-shadow:0 0 0 4px #efeafa; }
.map-current #mapSelection { font-weight:600; }
.map-current-hint { color:#717e93; margin-left:8px; padding-left:15px; border-left:1px solid #d8deea; }
.directory-pro .directory-map-hero .supara-map-shell { padding:0 24px 20px; border:0; background:radial-gradient(ellipse at 50% 35%,#ffffff 0%,#f2f5fc 75%,#edf1f9 100%); }
.directory-map-hero .puma-turkiye-haritasi { position:relative; width:100%; max-width:1180px; margin:0 auto; perspective:1600px; }
.directory-map-hero .puma-turkiye-haritasi::before { content:""; position:absolute; pointer-events:none; width:76%; height:46%; left:12%; top:30%; background:#62549625; filter:blur(32px); border-radius:50%; transform:rotateX(35deg) translateY(36px); }
.directory-pro .directory-map-hero #puma-turkiye-haritasi { position:relative; display:block; width:100%; height:clamp(310px,35vw,480px); max-height:none; padding:14px 0 0; margin:0; overflow:visible; transform:rotateX(20deg); transform-origin:50% 48%; filter:drop-shadow(0 14px 10px #54417f18); }
.directory-map-hero .map-depth { pointer-events:none; }
.directory-pro .directory-map-hero #puma-turkiye-haritasi g[data-plakakodu] path { fill:url(#province-inactive); stroke:#f9faff; stroke-width:1.15; stroke-linejoin:round; transition:fill .18s,transform .18s,filter .18s; }
.directory-pro .directory-map-hero #puma-turkiye-haritasi g.supara-has-point path { fill:url(#province-active); }
.directory-pro .directory-map-hero #puma-turkiye-haritasi g.supara-has-point:hover path,.directory-pro .directory-map-hero #puma-turkiye-haritasi g.supara-has-point:focus-visible path { fill:url(#province-selected); transform:translateY(var(--map-lift,-3px)); filter:drop-shadow(0 3px 2px #35255355); stroke:#fff; }
.directory-pro .directory-map-hero #puma-turkiye-haritasi g.is-selected path { fill:url(#province-selected); stroke:#f6f3ff; stroke-width:1.6; }
.directory-pro .directory-map-hero #puma-turkiye-haritasi.is-istanbul { height:clamp(310px,35vw,480px); max-height:none; overflow:hidden; padding:20px 0; }
.directory-pro .directory-map-hero #puma-turkiye-haritasi.is-istanbul g[data-plakakodu] { visibility:hidden; }
.directory-pro .directory-map-hero #puma-turkiye-haritasi.is-istanbul g[data-yaka] { visibility:visible; }
.directory-pro .directory-map-hero #puma-turkiye-haritasi.is-istanbul g[data-yaka=avrupa] path { fill:url(#province-active); stroke:#faf9ff; stroke-width:1.5; }
.directory-pro .directory-map-hero #puma-turkiye-haritasi.is-istanbul g[data-yaka=anadolu] path { fill:#52b6c7; stroke:#edfcff; stroke-width:1.5; }
.directory-pro .directory-map-hero #puma-turkiye-haritasi.is-istanbul g.is-side-muted path { fill:#d9dfec; stroke:#f5f7fc; }
.directory-pro .directory-map-hero .supara-map-legend-premium { position:relative; gap:12px 26px; padding:5px 0 0; color:#657187; font-size:.875rem; }
.directory-pro .directory-map-hero .supara-map-legend-premium i { height:9px; width:9px; border-radius:3px; background:#cbd3e0; border-color:#bec6d3; }
.directory-pro .directory-map-hero .supara-map-legend-premium i.is-active { background:#8d80e8; border-color:#7c6dd8; }
.directory-pro .supara-map-card { position:static; }
@media(min-width:1600px) { .directory-pro .directory-map-hero #puma-turkiye-haritasi { height:510px; } }
@media(max-width:960px) { .map-hero-toolbar { align-items:flex-start; padding:22px 22px 15px; } .map-hero-actions { justify-content:flex-end; } .map-current { padding-inline:22px; } .directory-pro .directory-map-hero #puma-turkiye-haritasi { height:clamp(250px,42vw,400px); } }
@media(max-width:700px) { .map-hero-toolbar { flex-direction:column; gap:16px; } .map-hero-toolbar h2 { font-size:1.125rem; } .map-hero-actions { width:100%; justify-content:flex-start; gap:6px; } .map-action { padding:9px 11px; font-size:.875rem; } .map-action-primary { margin-left:auto; } .map-current { align-items:flex-start; flex-wrap:wrap; gap:8px; } .map-location-dot { margin-top:7px; } .map-current-hint { font-size:.8125rem; } .directory-pro .directory-map-hero .supara-map-shell { padding:5px 10px 18px; } .directory-pro .directory-map-hero #puma-turkiye-haritasi { height:clamp(205px,53vw,340px); transform:rotateX(15deg); } .directory-pro .directory-map-hero #puma-turkiye-haritasi.is-istanbul { height:290px; } .directory-pro .directory-map-hero .supara-map-legend-premium { font-size:.75rem; gap:8px 14px; } .directory-map-hero { margin-bottom:22px; border-radius:12px; } }
@media(max-width:380px) { .map-hero-toolbar { padding:18px 16px 14px; } .map-current { padding-inline:16px; } .map-action { padding:8px; font-size:.8125rem; } .map-action .icon-base { display:none; } .map-current-hint { flex-basis:100%; margin-left:15px; padding:0; border:0; } }
@media(prefers-reduced-motion:reduce) { .directory-pro .directory-map-hero #puma-turkiye-haritasi g[data-plakakodu] path { transition:none; } }

/* Density remains visible while selecting and focusing provinces. The focus
   indicator follows the province boundary instead of its rectangular SVG box. */
.directory-pro .directory-map-hero #puma-turkiye-haritasi g[data-plakakodu],
.directory-pro .directory-map-hero #puma-turkiye-haritasi g[data-plakakodu] path { outline:none!important; }
.directory-pro .directory-map-hero #puma-turkiye-haritasi g[data-density] path,
.directory-pro .directory-map-hero #puma-turkiye-haritasi.is-istanbul g[data-yaka][data-density] path { fill:var(--province-fill); }
.directory-pro .directory-map-hero #puma-turkiye-haritasi g[data-density].is-selected path { stroke:#f9f7ff; stroke-width:2; filter:drop-shadow(0 2px 2px #44347566); }
.directory-pro .directory-map-hero #puma-turkiye-haritasi g[data-density]:hover path { filter:brightness(.94) drop-shadow(0 3px 2px #35255355); }
.directory-pro .directory-map-hero #puma-turkiye-haritasi g[data-density]:focus-visible path { stroke:#302454; stroke-width:3; filter:drop-shadow(0 0 3px #ffffff); }
.directory-pro .directory-map-hero #puma-turkiye-haritasi.is-istanbul g[data-yaka].is-side-muted path { opacity:.48; }
.directory-pro .directory-map-hero .supara-map-legend-premium i { border:none; }
.map-side-summary { flex-basis:100%; justify-content:center; color:#58667f; }

/* Permanent names sit above the geography and use a light halo, without boxes. */
.directory-pro .directory-map-hero #map-city-labels .province-name { display:block; fill:#30344c; stroke:#fffffff2; paint-order:stroke fill; stroke-linejoin:round; font-family:var(--bs-body-font-family); font-size:inherit; font-weight:650; text-anchor:middle; dominant-baseline:central; pointer-events:auto; cursor:pointer; }
.directory-pro .directory-map-hero #map-city-labels .province-name:hover { fill:#4d2c98; }
.province-label-line { stroke:#675887; opacity:.65; pointer-events:none; }

/* The map fits its frame; only the page scrolls. Its frame keeps the same
   proportions when the SVG switches between Turkey and Istanbul. */
.directory-pro .directory-map-hero { min-width:0; max-width:100%; }
.directory-pro .directory-map-hero .map-viewport { position:relative; width:100%; max-width:100%; min-width:0; aspect-ratio:1007.478 / 527.323; overflow:hidden; overflow:clip; }
.directory-pro .directory-map-hero .map-viewport .puma-turkiye-haritasi { position:absolute; inset:0; width:100%; height:100%; min-width:0; max-width:none; padding:10px 12px 20px; margin:0; box-sizing:border-box; }
.directory-pro .directory-map-hero .map-viewport #puma-turkiye-haritasi,
.directory-pro .directory-map-hero .map-viewport #puma-turkiye-haritasi.is-istanbul { display:block; width:100%; height:100%; min-width:0; max-width:100%; max-height:100%; padding:0; margin:0; overflow:visible; transform:rotateX(16deg); transform-origin:center; }
@media(max-width:700px) {
 .directory-pro .directory-map-hero .supara-map-shell { padding:0 6px 16px; }
 .directory-pro .directory-map-hero .map-viewport .puma-turkiye-haritasi { padding:6px 2px 10px; }
 .directory-pro .directory-map-hero .map-viewport #puma-turkiye-haritasi { transform:rotateX(8deg); filter:drop-shadow(0 5px 4px #54417f18); }
 .map-hero-toolbar { padding:18px 16px 14px; gap:14px; }
 .map-hero-actions { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; width:100%; }
 .map-hero-actions .map-action { width:100%; min-width:0; min-height:44px; margin:0; padding:8px 6px; white-space:normal; font-size:.8125rem; line-height:1.4; text-align:center; }
 .map-hero-actions .map-action .icon-base { display:none; }
 .map-current { padding-inline:16px; }
 .directory-pro .directory-map-hero .supara-map-legend-premium { gap:8px 12px; padding-inline:8px; }
}
@media(max-width:400px) {
 .directory-pro .directory-map-hero .supara-map-legend-premium { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }
 .directory-pro .directory-map-hero .supara-map-legend-premium>span { justify-content:center; }
 .directory-pro .directory-map-hero .map-side-summary { grid-column:1/-1; }
}

@media(max-width:560px) {
 .directory-pro .site-links { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(0,.8fr) minmax(0,1fr); gap:4px; }
 .directory-pro .site-links .nav-link,.directory-pro .site-links .btn { justify-content:center; min-width:0; margin:0; padding:10px 6px; font-size:.875rem; white-space:normal; text-align:center; }
 .directory-pro .site-links .icon-base { display:none; }
}
