/* Shared public/cart/MultiBox country picker. Themes come from shared tokens. */
.hosting-location-section { margin: 20px 0; }
.hosting-location-picker { color: var(--btp-label-neutral-text); text-align: left; }
.hosting-location-flag { width: 16px; height: 12px; margin-right: 6px; border-radius: 0; vertical-align: -2px; }
.hosting-location-picker .is-fast { --hosting-latency-color: #66bb6a; }
.hosting-location-picker .is-ok { --hosting-latency-color: #f5b041; }
.hosting-location-picker .is-slow { --hosting-latency-color: #ef6f61; }
.hosting-location-grid { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(240px, 1fr); gap: 24px; align-items: center; }
.hosting-location-map { position: relative; border-radius: 14px; overflow: hidden; background: var(--btp-label-info-bg); }
/* The compact map grows to the height of the region list beside it; 18 / 7 stays its minimum. */
.hosting-location-grid > .hosting-location-map { display: flex; flex-direction: column; align-self: stretch; }
.hosting-location-grid > .hosting-location-map > .hosting-location-map-canvas { flex: 1 0 auto; }
.hosting-location-world { position: absolute; inset: 0; width: 100%; height: 100%; }
.hosting-location-map-error { position: absolute; top: 50%; left: 50%; width: 90%; margin: 0; transform: translate(-50%, -50%); color: var(--btp-label-neutral-text); text-align: center; }
.hosting-location-map-canvas { position: relative; width: 100%; aspect-ratio: 18 / 7; overflow: hidden; isolation: isolate; }
.hosting-location-markers { position: absolute; z-index: 2; inset: 0; pointer-events: none; }
.hosting-location-markers[hidden], .hosting-location-visitor[hidden] { display: none; }
/* Markers are a pointer shortcut; region cards remain the keyboard and screen-reader control. */
.hosting-location-marker.is-clickable { pointer-events: auto; cursor: pointer; }
.hosting-location-marker.is-clickable::before { position: absolute; inset: -10px; content: ''; border-radius: 50%; }
.hosting-location-marker { position: absolute; width: 10px; height: 10px; border: 2px solid var(--btp-label-neutral-bg); border-radius: 50%; background: var(--btp-label-info-text); transform: translate(-50%, -50%); }
.hosting-location-marker.is-selected { box-shadow: 0 0 0 5px var(--btp-label-info-bg), 0 0 0 7px var(--btp-label-info-text); }
.hosting-location-marker-label { display: none; }
.hosting-location-marker-label, .hosting-location-visitor-label { translate: var(--hosting-caption-x, 0px) var(--hosting-caption-y, 0px); }
.hosting-location-visitor { position: absolute; z-index: 2; display: flex; align-items: center; justify-content: center; width: 22px; height: 22px; border: 2px solid #f39c12; border-radius: 50%; background: #16213e; color: #f39c12; font-size: 11px; transform: translate(-50%, -50%); pointer-events: none; }
.hosting-location-visitor-label { position: absolute; top: 26px; left: 50%; width: max-content; max-width: 210px; padding: 8px 10px; border: 1px solid #f39c12; border-radius: 8px; background: #16213e; color: #fff; font-size: 12px; font-weight: 600; line-height: 1.4; text-align: center; transform: translateX(-50%); }
.hosting-location-visitor-label small { display: block; margin-top: 3px; color: #ffe0a3; font-size: 11px; font-weight: 400; }
.hosting-location-visitor.is-south .hosting-location-visitor-label { top: auto; bottom: 26px; }
.hosting-location-countries { display: grid; gap: 10px; max-height: 370px; overflow: auto; padding: 3px; }
.hosting-location-country { position: relative; display: block; margin: 0; padding: 12px; border: 1px solid var(--btp-label-neutral-border); border-radius: 12px; background: var(--btp-label-neutral-bg); cursor: pointer; font-weight: normal; }
.hosting-location-country:focus-within { outline: 2px solid var(--btp-label-info-text); outline-offset: 2px; }
.hosting-location-country.is-selected { border-color: var(--btp-label-info-text); background: var(--btp-label-info-bg); }
.hosting-location-country input { margin: 0 8px 0 0; }
.hosting-location-country-header { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.hosting-location-country-header strong { flex: 1; }
.hosting-location-country small { display: block; margin-top: 5px; }
.hosting-location-country.is-unavailable { cursor: default; }
.hosting-location-country.is-unavailable strong { opacity: .7; }
.hosting-location-latency { display: flex; gap: 12px; align-items: center; margin-top: 12px; }
.hosting-location-latency[hidden] { display: none; }
.hosting-location-picker .hosting-location-latency-button { display: inline-flex; flex: 0 0 auto; align-items: center; justify-content: center; gap: 7px; margin: 0; padding: 8px 12px; appearance: none; border: 1px solid var(--btp-label-neutral-border); border-radius: 8px; background: var(--btp-label-neutral-bg); color: var(--btp-label-info-text); box-shadow: none; font-size: 13px; font-weight: 600; line-height: 1.4; white-space: nowrap; text-shadow: none; transform: none; }
.hosting-location-picker .hosting-location-latency-button:hover:not(:disabled) { border-color: var(--btp-label-info-text); background: var(--btp-label-info-bg); color: var(--btp-label-info-text); box-shadow: none; transform: none; }
.hosting-location-picker .hosting-location-latency-button:focus-visible { outline: 2px solid var(--btp-label-info-text) !important; outline-offset: 2px; }
.hosting-location-picker .hosting-location-latency-button:disabled { opacity: .6; cursor: progress; }
.hosting-location-picker .hosting-location-latency-button > i { flex: 0 0 1em; width: 1em; text-align: center; }
.hosting-location-picker .hosting-location-latency-button[aria-busy="true"] > i { animation-duration: .8s; }
.hosting-location-pricing-option.is-measuring .hosting-location-pricing-dot, .hosting-location-country.is-measuring .hosting-location-signal { animation: hosting-location-measuring-pulse .9s ease-in-out infinite; }
@keyframes hosting-location-measuring-pulse { 0%, 100% { opacity: .35; } 50% { opacity: 1; } }
.hosting-location-status:empty { display: none; }
.hosting-location-status { margin-top: 12px; }
.hosting-location-status.is-error { color: var(--btp-label-danger-text); }
.hosting-location-budget { padding: 12px; margin: 12px 0; border: 1px solid var(--btp-label-neutral-border); border-radius: 10px; color: var(--btp-label-neutral-text); background: var(--btp-label-info-bg); }
.hosting-location-budget p:last-child { margin-bottom: 0; }
.hosting-location-budget[data-invalid="true"] { border-color: var(--btp-label-danger-border); color: var(--btp-label-danger-text); background: var(--btp-label-danger-bg); }
.hosting-location-summary { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.hosting-location-summary dt { font-weight: normal; }
.hosting-location-summary dd { font-weight: 600; margin: 0; }

/* A region is a pricing control on plans, not a separate discovery section. */
#offres-minecraft, #offres-bungeecord, #minecraft-free-trial, #game-detail-plans, #games-catalog { scroll-margin-top: 88px; }
.hosting-location-section[data-presentation="pricing"] { margin: 0 0 20px; container-type: inline-size; }
.hosting-location-pricing-control { display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto; grid-template-areas: "title options tools map"; align-items: center; gap: 10px 18px; padding: 10px 12px 10px 18px; border: 1px solid var(--btp-label-neutral-border); border-radius: 14px; background: linear-gradient(135deg, rgba(92, 205, 222, .1), rgba(92, 205, 222, 0) 55%), var(--btp-label-neutral-bg); }
.hosting-location-pricing-title { grid-area: title; display: inline-flex; align-items: center; gap: 9px; font-size: 13px; font-weight: 700; white-space: nowrap; }
.hosting-location-pricing-title .fa { color: var(--btp-label-info-text); font-size: 17px; }
.hosting-location-pricing-options { grid-area: options; display: flex; flex-wrap: wrap; gap: 8px; min-width: 0; }
.hosting-location-pricing-loading { padding: 9px 0; font-size: 13px; opacity: .7; }
.hosting-location-pricing-option { display: inline-flex; flex: 0 1 auto; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px; min-height: 38px; margin: 0; padding: 7px 15px; border: 1px solid var(--btp-label-neutral-border); border-radius: 999px; background: transparent; color: inherit; font-size: 13px; font-weight: 600; line-height: 1.2; cursor: pointer; transition: border-color .2s ease, background-color .2s ease, box-shadow .2s ease; }
.hosting-location-pricing-option:hover:not(:disabled) { border-color: #5ccdde; }
.hosting-location-pricing-option:focus-visible { outline: 2px solid #5ccdde !important; outline-offset: 2px; }
.hosting-location-pricing-option[aria-pressed="true"] { border-color: #5ccdde; background: var(--btp-label-info-bg); color: var(--btp-label-info-text); box-shadow: 0 0 0 3px rgba(92, 205, 222, .16); cursor: default; }
.hosting-location-pricing-option:disabled { cursor: default; }
.hosting-location-pricing-option:disabled:not([aria-pressed="true"]) { opacity: .55; }
.hosting-location-pricing-dot { flex: 0 0 8px; width: 8px; height: 8px; border-radius: 50%; background: #4caf50; box-shadow: 0 0 0 3px rgba(76, 175, 80, .2); }
.hosting-location-pricing-option.is-unavailable .hosting-location-pricing-dot { background: #8a9bb0; box-shadow: none; }
.hosting-location-pricing-state { font-size: 11px; font-weight: 600; opacity: .75; }
.hosting-location-pricing-map { grid-area: map; display: inline-flex; align-items: center; gap: 6px; padding: 8px 4px; color: var(--btp-label-info-text); font-size: 13px; font-weight: 600; white-space: nowrap; text-decoration: none; }
.hosting-location-pricing-map:hover, .hosting-location-pricing-map:focus { color: var(--btp-label-info-text); text-decoration: underline; text-underline-offset: 3px; }
.hosting-location-pricing .hosting-location-status { margin: 10px 0 0; font-size: 13px; text-align: left; }
.hosting-location-pricing .hosting-location-status.is-notice { padding: 10px 14px; border: 1px solid var(--btp-label-warning-border); border-radius: 10px; background: var(--btp-label-warning-bg); color: var(--btp-label-warning-text); }
/* Ordering is closed in a preview region: drop the brand colour, never the opacity, so white labels stay crisp. */
.hosting-location-order-disabled, .hosting-location-order-disabled:hover, .hosting-location-order-disabled:focus { opacity: 1 !important; filter: saturate(.12) !important; box-shadow: none !important; transform: none !important; cursor: not-allowed; }
.offer-actions:has(> .hosting-location-order-disabled) { filter: saturate(.12); box-shadow: none; transform: none; }
a.hosting-location-order-disabled { pointer-events: none; }
@container (width < 600px) {
    .hosting-location-pricing-control { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "title map" "options options" "tools tools"; padding: 12px; }
    .hosting-location-pricing-options { flex-direction: column; }
    .hosting-location-pricing-option { justify-content: flex-start; width: 100%; border-radius: 10px; text-align: left; }
    .hosting-location-pricing-state { margin-left: auto; }
}

/* The discovery page follows the public hero and alternating sections. Commerce keeps its compact picker. */
.hosting-locations-page .site-section { padding-top: 64px; padding-bottom: 64px; }
.hosting-locations-page .hosting-locations-hero { padding: 125px 0 80px; }
.hosting-locations-hero-row { display: flex; flex-wrap: wrap; align-items: center; }
.hosting-locations-kicker { display: flex; align-items: center; gap: 8px; margin: 0 0 14px; color: #5ccdde; font-size: .85em; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; }
.hosting-locations-page .hosting-locations-hero h1 { max-width: 650px; margin: 0 0 20px; font-size: 3em; line-height: 1.15; text-align: left; }
.hosting-locations-page .hosting-locations-hero .hero-subtitle { max-width: 620px; margin: 0; font-size: 1.15em; line-height: 1.7; text-align: left; }
.hosting-locations-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.hosting-locations-page .cta-btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 48px; padding: 12px 24px; }
.hosting-locations-page .cta-btn.hosting-locations-cta-outline { border: 2px solid rgba(255, 255, 255, .35); background: transparent; box-shadow: none; color: #fff; }
.hosting-locations-page .cta-btn.hosting-locations-cta-outline:hover, .hosting-locations-page .cta-btn.hosting-locations-cta-outline:focus { border-color: rgba(255, 255, 255, .55); background: rgba(255, 255, 255, .12); color: #fff; }
.hosting-locations-page .cta-btn:focus-visible { outline: 3px solid #5ccdde; outline-offset: 3px; }
.hosting-locations-hero-visual { display: flex; align-items: center; justify-content: center; }
.hosting-locations-hero-image { display: block; width: 100%; max-width: 560px; height: auto; }
.hosting-locations-section-title { margin: 0 0 12px; color: var(--btp-label-neutral-text); font-size: 2em; font-weight: 600; line-height: 1.3; text-align: center; }
.hosting-locations-page .action-choice-section .hosting-locations-section-title { color: #fff; }
.hosting-locations-section-lead { position: relative; z-index: 1; max-width: 640px; margin: 0 auto 36px; color: rgba(255, 255, 255, .75); font-size: 16px; line-height: 1.7; text-align: center; }
.hosting-locations-explorer { scroll-margin-top: 65px; }
.hosting-locations-explorer .hosting-location-section { position: relative; z-index: 1; margin: 0; }
.hosting-locations-benefits-row { display: flex; flex-wrap: wrap; align-items: center; }
.hosting-locations-benefits .hosting-locations-kicker { color: var(--btp-label-info-text); }
.hosting-locations-benefits-title { margin: 0 0 16px; color: var(--btp-label-neutral-text); font-size: 2em; font-weight: 600; line-height: 1.25; }
.hosting-locations-benefits-lead { margin: 0 0 24px; color: var(--btp-label-neutral-text); font-size: 16px; line-height: 1.7; opacity: .85; }
.hosting-locations-checklist { display: grid; gap: 12px; margin: 0 0 32px; padding: 0; list-style: none; color: var(--btp-label-neutral-text); font-weight: 600; }
.hosting-locations-checklist li { display: flex; align-items: flex-start; gap: 10px; }
.hosting-locations-checklist .fa { flex: 0 0 auto; margin-top: 3px; color: #4caf50; font-size: 17px; }
.hosting-locations-benefit-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin: 0; padding: 0; list-style: none; }
.hosting-locations-benefit { padding: 24px; border: 1px solid var(--btp-label-neutral-border); border-radius: 18px; background: var(--btp-label-neutral-bg); color: var(--btp-label-neutral-text); box-shadow: 0 10px 30px rgba(15, 23, 42, .06); transition: border-color .3s ease, transform .3s ease; }
.hosting-locations-benefit:hover { border-color: rgba(92, 205, 222, .6); transform: translateY(-3px); }
.hosting-locations-benefit-icon { display: inline-flex; align-items: center; justify-content: center; width: 48px; height: 48px; margin-bottom: 16px; border-radius: 14px; background: var(--btp-label-info-bg); color: var(--btp-label-info-text); font-size: 20px; }
.hosting-locations-benefit h3 { margin: 0 0 8px; color: inherit; font-size: 17px; font-weight: 700; line-height: 1.35; }
.hosting-locations-benefit p { margin: 0; font-size: 14px; line-height: 1.65; opacity: .85; }
.hosting-locations-page .hosting-locations-steps { padding-bottom: 34px; }
.hosting-locations-steps .hosting-locations-section-title { margin-bottom: 40px; }
.hosting-locations-step-list { padding: 0; margin-bottom: 0; list-style: none; }
.hosting-locations-steps .key-feature-content { text-align: center; }
.hosting-locations-steps .key-feature-content h3::after { left: 50%; transform: translateX(-50%); }
.hosting-locations-step-number { color: #3ba5b5; }
/* The last section reserves space for the overlapping public footer curve. */
.hosting-locations-page .hosting-locations-plans { padding-bottom: 120px; }
.hosting-locations-plans .action-card-icon i { font-size: 56px; }
.hosting-locations-plans .action-card-description, .hosting-locations-plans .action-card-cta { text-align: center; }
.hosting-location-showcase .hosting-location-grid { display: grid; grid-template-columns: minmax(0, 1.75fr) minmax(260px, 1fr); gap: 24px; align-items: stretch; }
.hosting-location-showcase .hosting-location-map { display: flex; flex-direction: column; justify-content: flex-start; }
.hosting-location-showcase .hosting-location-map-canvas { flex: 1 0 auto; min-height: 200px; margin: 0; }
.hosting-location-showcase .hosting-location-map { border: 1px solid rgba(92, 205, 222, .24); border-radius: 22px; background: radial-gradient(ellipse at 50% 25%, rgba(92, 205, 222, .17), transparent 65%), linear-gradient(125deg, #16213e, #0f1726); box-shadow: 0 20px 60px rgba(0, 0, 0, .25); }
.hosting-location-showcase .hosting-location-map::before { position: absolute; inset: 0; content: ''; pointer-events: none; background-image: linear-gradient(rgba(92, 205, 222, .055) 1px, transparent 1px), linear-gradient(90deg, rgba(92, 205, 222, .055) 1px, transparent 1px); background-size: 48px 48px; }
.hosting-location-showcase .hosting-location-map-error { color: #e7e9ea; }
.hosting-location-showcase .hosting-location-marker { width: 12px; height: 12px; border: 3px solid #16213e; background: #5ccdde; box-shadow: 0 0 0 6px rgba(92, 205, 222, .18), 0 0 24px rgba(92, 205, 222, .5); }
.hosting-location-showcase .hosting-location-marker.is-selected { box-shadow: 0 0 0 9px rgba(92, 205, 222, .2), 0 0 0 18px rgba(92, 205, 222, .07), 0 0 30px rgba(92, 205, 222, .6); }
.hosting-location-showcase .hosting-location-marker.is-unavailable { background: #acbbcd; box-shadow: 0 0 0 6px rgba(172, 187, 205, .12); }
.hosting-location-showcase .hosting-location-marker-label { display: block; position: absolute; left: 16px; bottom: 13px; width: max-content; max-width: 180px; padding: 7px 11px; border: 1px solid rgba(92, 205, 222, .2); border-radius: 8px; background: #16213e; color: #e2edf7; font-size: 13px; font-weight: 600; }
.hosting-location-showcase .hosting-location-marker.is-east .hosting-location-marker-label { right: 16px; left: auto; }
.hosting-location-showcase .hosting-location-marker.is-selected .hosting-location-marker-label { color: #5ccdde; border-color: rgba(92, 205, 222, .55); }
.hosting-location-showcase .hosting-location-marker-label { transition: border-color .2s ease, color .2s ease, transform .2s ease; }
.hosting-location-showcase .hosting-location-marker-latency { display: block; margin-top: 3px; font-size: 11px; line-height: 1.4; }
.hosting-location-showcase .hosting-location-marker.is-hovered .hosting-location-marker-label { color: #fff; border-color: #5ccdde; transform: translateY(-2px); }
.hosting-location-showcase .hosting-location-marker.is-hovered .hosting-location-marker-label::after { position: absolute; top: 100%; right: 0; left: 0; height: 3px; content: ''; }
.hosting-location-showcase .hosting-location-country.is-hovered:not(.is-unavailable) { border-color: rgba(92, 205, 222, .45); background: rgba(255, 255, 255, .07); }
.hosting-location-showcase .hosting-location-country.is-unavailable.is-hovered { border-color: rgba(172, 187, 205, .4); }
/* Region cards sit on the always-dark explorer section in both themes. */
.hosting-location-showcase .hosting-location-countries { display: grid; gap: 14px; max-height: none; padding: 0; overflow: visible; }
.hosting-location-showcase .hosting-location-country { display: flex; flex-direction: column; gap: 10px; margin: 0; padding: 22px 24px; border: 1px solid rgba(255, 255, 255, .12); border-radius: 18px; background: rgba(255, 255, 255, .04); color: #e7e9ea; transition: border-color .3s ease, background-color .3s ease, box-shadow .3s ease, transform .3s ease; }
.hosting-location-showcase .hosting-location-country:not(.is-unavailable):hover { transform: translateY(-3px); border-color: rgba(92, 205, 222, .45); background: rgba(255, 255, 255, .07); }
/* Keep the lifted card under a pointer resting on its bottom edge, otherwise hover toggles and the card shakes. */
.hosting-location-showcase .hosting-location-country { position: relative; }
.hosting-location-showcase .hosting-location-country:not(.is-unavailable):hover::after { position: absolute; top: 100%; right: 0; left: 0; height: 4px; content: ''; }
.hosting-location-showcase .hosting-location-country.is-selected { border-color: #5ccdde; background: linear-gradient(135deg, rgba(92, 205, 222, .2), rgba(92, 205, 222, .05)); box-shadow: 0 12px 32px rgba(92, 205, 222, .15); }
.hosting-location-showcase .hosting-location-country:focus-within { outline-color: #5ccdde; }
.hosting-location-showcase .hosting-location-country-header { display: grid; grid-template-columns: 16px minmax(0, 1fr) auto; gap: 10px; }
.hosting-location-showcase .hosting-location-country-title { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; min-width: 0; }
.hosting-location-showcase .hosting-location-country-header strong { color: #fff; font-size: 19px; font-weight: 700; }
.hosting-location-showcase .hosting-location-country-title > strong { display: inline-flex; flex: 0 1 auto; align-items: center; gap: 6px; min-width: 0; }
.hosting-location-showcase .hosting-location-country-title .hosting-location-flag { display: block; flex: 0 0 24px; width: 24px; height: 24px; margin-right: 0; object-fit: contain; image-rendering: auto; }
.hosting-location-showcase .hosting-location-country input { width: 16px; height: 16px; margin: 0 4px 0 0; accent-color: #5ccdde; color-scheme: dark; }
.hosting-location-showcase .hosting-location-country small { margin: 0; color: rgba(255, 255, 255, .7); font-size: 13px; line-height: 1.5; }
.hosting-location-showcase .hosting-location-country-latency:empty { display: none; }
.hosting-location-showcase .hosting-location-country.is-unavailable strong { opacity: 1; }
.hosting-location-showcase .hosting-location-status { color: rgba(255, 255, 255, .8); text-align: center; }
.hosting-location-showcase .hosting-location-status.is-error { color: #e74c3c; }
.hosting-location-showcase .hosting-location-map-footer { flex-direction: row; flex-wrap: nowrap; align-items: flex-end; justify-content: space-between; gap: 12px; margin: 0; padding: 12px 14px; border: 0; border-radius: 0; background: transparent; color: rgba(255, 255, 255, .75); }
.hosting-location-showcase .hosting-location-latency-button { margin-left: auto; border-color: rgba(92, 205, 222, .45); background: rgba(92, 205, 222, .1); color: #bfeef5; }
.hosting-location-coming { position: relative; display: flex; align-items: center; gap: 16px; padding: 18px 24px; overflow: hidden; border: 1px dashed rgba(92, 205, 222, .45); border-radius: 18px; background: rgba(92, 205, 222, .04); color: rgba(255, 255, 255, .7); }
.hosting-location-coming::after { position: absolute; inset: 0; content: ''; pointer-events: none; background: linear-gradient(110deg, transparent 30%, rgba(92, 205, 222, .12) 50%, transparent 70%); transform: translateX(-100%); animation: hosting-location-coming 3.6s ease-in-out infinite; }
@keyframes hosting-location-coming { 60%, to { transform: translateX(100%); } }
.hosting-location-coming-icon { position: relative; display: inline-flex; flex: 0 0 42px; align-items: center; justify-content: center; height: 42px; border: 1px dashed rgba(92, 205, 222, .6); border-radius: 50%; color: #5ccdde; font-size: 16px; }
.hosting-location-coming-icon::after { position: absolute; inset: -1px; content: ''; border: 2px solid rgba(92, 205, 222, .5); border-radius: 50%; animation: hosting-location-pulse 2.4s ease-out infinite; }
.hosting-location-coming-body { display: grid; gap: 3px; min-width: 0; }
.hosting-location-coming-body strong { color: #fff; font-size: 16px; font-weight: 700; }
.hosting-location-showcase .hosting-location-coming-body small { margin: 0; color: rgba(255, 255, 255, .7); font-size: 13px; line-height: 1.5; }
/* Network links, radar pulse and legend are decorative: region cards carry the readable state. */
.hosting-location-links { position: absolute; z-index: 1; inset: 0; width: 100%; height: 100%; pointer-events: none; overflow: hidden; }
.hosting-location-links path { fill: none; stroke-linecap: round; vector-effect: non-scaling-stroke; }
.hosting-location-link-track { stroke: rgba(102, 187, 106, .24); stroke-width: 7; }
.hosting-location-link-flow { stroke: #86efac; stroke-width: 2.2; stroke-dasharray: 6 8; animation: hosting-location-link 1.6s linear infinite; }
@keyframes hosting-location-link { to { stroke-dashoffset: -24; } }
.hosting-location-showcase .hosting-location-marker { color: #5ccdde; }
.hosting-location-showcase .hosting-location-marker:not(.is-unavailable)::after { position: absolute; inset: -3px; content: ''; border: 2px solid currentColor; border-radius: 50%; animation: hosting-location-pulse 2.4s ease-out infinite; }
@keyframes hosting-location-pulse { from { opacity: .8; transform: scale(1); } to { opacity: 0; transform: scale(3.4); } }
.hosting-location-showcase .hosting-location-marker:is(.is-fast, .is-ok, .is-slow) { color: var(--hosting-latency-color); background: var(--hosting-latency-color); }
.hosting-location-showcase .hosting-location-marker:is(.is-fast, .is-ok, .is-slow) .hosting-location-marker-latency { color: var(--hosting-latency-color); }
.hosting-location-legend { display: flex; flex: 0 1 auto; flex-wrap: wrap; gap: 6px 14px; min-width: 0; padding: 7px 12px; border: 1px solid rgba(92, 205, 222, .18); border-radius: 10px; background: rgba(15, 23, 38, .8); color: #cfd8e3; font-size: 12px; font-weight: 600; }
.hosting-location-legend-item { display: inline-flex; align-items: center; gap: 6px; }
.hosting-location-legend-dot { width: 8px; height: 8px; border-radius: 50%; background: #5ccdde; }
.hosting-location-legend-item.is-unavailable .hosting-location-legend-dot { background: #acbbcd; }
.hosting-location-legend-item:is(.is-fast, .is-ok, .is-slow) .hosting-location-legend-dot { background: var(--hosting-latency-color); }
.hosting-location-legend-item:is(.is-fast, .is-ok, .is-slow) { display: none; }
.hosting-location-showcase.is-measured .hosting-location-legend-item.is-available, .hosting-location-showcase.is-measured .hosting-location-legend-item.is-unavailable { display: none; }
.hosting-location-showcase.is-measured .hosting-location-legend-item:is(.is-fast, .is-ok, .is-slow) { display: inline-flex; }
.hosting-location-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.hosting-location-chip { padding: 4px 10px; border: 1px solid rgba(92, 205, 222, .25); border-radius: 999px; background: rgba(92, 205, 222, .1); color: #bfeef5; font-size: 12px; font-weight: 600; line-height: 1.4; }
.hosting-location-reading { display: inline-flex; align-items: center; gap: 8px; color: rgba(255, 255, 255, .7); }
.hosting-location-reading[hidden] { display: none; }
.hosting-location-showcase .hosting-location-reading { flex: 0 1 auto; gap: 6px; max-width: 100%; padding: 4px 8px; border: 1px solid currentColor; border-radius: 999px; background: rgba(15, 23, 38, .2); line-height: 1.25; }
.hosting-location-showcase .hosting-location-reading small { color: inherit; font-size: 12px; font-weight: 700; line-height: inherit; font-variant-numeric: tabular-nums; }
.hosting-location-showcase .hosting-location-reading .hosting-location-signal { height: 12px; }
.hosting-location-showcase .hosting-location-reading .hosting-location-signal span { width: 3px; }
.hosting-location-country:is(.is-fast, .is-ok, .is-slow) .hosting-location-reading { color: var(--hosting-latency-color); }
.hosting-location-signal { display: inline-flex; flex: 0 0 auto; align-items: flex-end; gap: 2px; height: 14px; }
.hosting-location-signal span { width: 4px; border-radius: 1px; background: rgba(127, 140, 160, .35); }
.hosting-location-signal span:nth-child(1) { height: 25%; }
.hosting-location-signal span:nth-child(2) { height: 50%; }
.hosting-location-signal span:nth-child(3) { height: 75%; }
.hosting-location-signal span:nth-child(4) { height: 100%; }
.hosting-location-signal[data-level="1"] span:nth-child(-n+1), .hosting-location-signal[data-level="2"] span:nth-child(-n+2),
.hosting-location-signal[data-level="3"] span:nth-child(-n+3), .hosting-location-signal[data-level="4"] span { background: currentColor; }
.hosting-location-best { display: flex; align-items: center; gap: 16px; max-width: 960px; margin: 20px auto 0; padding: 16px 20px; border: 1px solid rgba(76, 175, 80, .45); border-radius: 16px; background: linear-gradient(135deg, rgba(76, 175, 80, .16), rgba(76, 175, 80, .04)); color: rgba(255, 255, 255, .8); }
.hosting-location-best[hidden] { display: none; }
.hosting-location-best-icon { display: inline-flex; flex: 0 0 44px; align-items: center; justify-content: center; height: 44px; border-radius: 50%; background: rgba(76, 175, 80, .2); color: #66bb6a; font-size: 19px; }
.hosting-location-best-body { flex: 1; min-width: 0; line-height: 1.5; }
.hosting-location-best-body > strong { display: block; color: #fff; font-size: 16px; }
.hosting-location-best-body > span > strong { font-weight: 700; }
.hosting-location-auto-selection { margin: 12px 0 0; color: var(--btp-label-info-text); font-size: 13px; line-height: 1.5; text-align: center; }
.hosting-location-auto-selection[hidden] { display: none; }
.hosting-location-showcase .hosting-location-auto-selection { color: #bfeef5; }
.hosting-location-pricing .hosting-location-latency { grid-area: tools; justify-content: flex-end; margin: 0; color: var(--btp-label-neutral-text); }
.hosting-location-pricing-latency { font-size: 11px; font-weight: 400; }
/* Panel list without a map: the compact cards carry the measured latency, with theme-aware contrasted colours. */
.hosting-location-list .is-fast { --hosting-latency-color: var(--btp-label-success-text); }
.hosting-location-list .is-ok { --hosting-latency-color: var(--btp-label-warning-text); }
.hosting-location-list .is-slow { --hosting-latency-color: var(--btp-label-danger-text); }
.hosting-location-list .hosting-location-grid { grid-template-columns: minmax(0, 1fr); }
.hosting-location-list .hosting-location-countries { max-height: min(370px, 55vh); }
.hosting-location-list .hosting-location-country-title { display: flex; flex: 1; flex-wrap: wrap; align-items: center; gap: 6px 10px; min-width: 0; }
.hosting-location-list .hosting-location-country-title > strong { flex: 0 1 auto; min-width: 0; }
.hosting-location-list .hosting-location-reading { gap: 6px; max-width: 100%; padding: 3px 8px; border: 1px solid currentColor; border-radius: 999px; color: var(--btp-label-neutral-text); line-height: 1.25; }
.hosting-location-list .hosting-location-reading small { display: inline; margin: 0; color: inherit; font-size: 12px; font-weight: 700; line-height: inherit; font-variant-numeric: tabular-nums; }
.hosting-location-list .hosting-location-reading .hosting-location-signal { height: 12px; }
.hosting-location-list .hosting-location-reading .hosting-location-signal span { width: 3px; }
.hosting-location-pricing .hosting-location-best { max-width: none; margin-top: 12px; padding: 12px 14px; border-radius: 12px; border-color: var(--btp-label-success-border); background: var(--btp-label-success-bg); color: var(--btp-label-neutral-text); }
.hosting-location-pricing .hosting-location-best-icon { flex-basis: 36px; height: 36px; background: var(--btp-label-success-bg); color: var(--btp-label-success-text); font-size: 16px; }
.hosting-location-pricing .hosting-location-best-body > strong { color: inherit; font-size: 14px; }
@media (prefers-reduced-motion: reduce) {
    .hosting-location-picker .hosting-location-latency-button[aria-busy="true"] > i,
    .hosting-location-pricing-option.is-measuring .hosting-location-pricing-dot,
    .hosting-location-country.is-measuring .hosting-location-signal { animation: none; }
    .hosting-location-link-flow, .hosting-location-coming::after, .hosting-location-coming-icon::after { animation: none; }
    .hosting-location-coming::after, .hosting-location-coming-icon::after { opacity: 0; }
    .hosting-location-showcase .hosting-location-marker:not(.is-unavailable)::after { animation: none; opacity: 0; }
}

/* Hero guarantees only repeat facts published in the offers and terms. */
.hosting-locations-trust { display: flex; flex-wrap: wrap; gap: 10px 22px; margin: 28px 0 0; padding: 0; list-style: none; }
.hosting-locations-trust li { display: inline-flex; align-items: center; gap: 8px; color: rgba(255, 255, 255, .85); font-size: 14px; font-weight: 600; }
.hosting-locations-trust .fa { color: #5ccdde; font-size: 15px; }
.hosting-locations-ping { padding: 22px 24px; margin-bottom: 32px; border: 1px solid var(--btp-label-neutral-border); border-radius: 18px; background: var(--btp-label-neutral-bg); color: var(--btp-label-neutral-text); }
.hosting-locations-ping-title { display: flex; align-items: center; gap: 10px; margin: 0 0 16px; color: inherit; font-size: 17px; font-weight: 700; }
.hosting-locations-ping-title .fa { color: var(--btp-label-info-text); }
.hosting-locations-ping-scale { display: grid; gap: 14px; margin: 0; padding: 0; list-style: none; }
.hosting-locations-ping-level { display: flex; align-items: center; gap: 14px; }
.hosting-locations-ping-level.is-fast { color: #43a047; }
.hosting-locations-ping-level.is-ok { color: #e08e0b; }
.hosting-locations-ping-level.is-slow { color: #e74c3c; }
.hosting-locations-ping-level .hosting-location-signal { height: 18px; }
.hosting-locations-ping-level .hosting-location-signal span { width: 5px; }
.hosting-locations-ping-text { color: var(--btp-label-neutral-text); font-size: 14px; line-height: 1.5; }
.hosting-locations-ping-text strong { display: block; color: inherit; font-size: 15px; }
.hosting-locations-ping-level.is-fast strong { color: #43a047; }
.hosting-locations-ping-level.is-ok strong { color: #e08e0b; }
.hosting-locations-ping-level.is-slow strong { color: #e74c3c; }
/* MultiBox stays on an always-dark section; the illustration is not a real order. */
.hosting-locations-multibox .container { position: relative; z-index: 1; }
.hosting-locations-multibox-row { display: flex; flex-wrap: wrap; align-items: center; }
.hosting-locations-multibox-title { margin: 0 0 16px; color: #fff; font-size: 2em; font-weight: 600; line-height: 1.25; }
.hosting-locations-multibox-lead { margin: 0 0 24px; color: rgba(255, 255, 255, .75); font-size: 16px; line-height: 1.7; }
.hosting-locations-multibox .hosting-locations-checklist { color: #e7e9ea; }
.hosting-locations-multibox-visual { display: grid; gap: 12px; padding: 24px; border: 1px solid rgba(255, 255, 255, .12); border-radius: 22px; background: rgba(255, 255, 255, .04); box-shadow: 0 20px 60px rgba(0, 0, 0, .25); }
.hosting-locations-multibox-visual-head { display: flex; align-items: center; gap: 10px; margin-bottom: 4px; color: #5ccdde; font-size: 15px; font-weight: 700; }
.hosting-locations-multibox-server { display: flex; align-items: center; gap: 14px; padding: 14px 16px; border: 1px solid rgba(255, 255, 255, .1); border-radius: 14px; background: rgba(255, 255, 255, .05); }
.hosting-locations-multibox-server-icon { display: inline-flex; flex: 0 0 40px; align-items: center; justify-content: center; height: 40px; border-radius: 12px; background: rgba(92, 205, 222, .15); color: #5ccdde; font-size: 18px; }
.hosting-locations-multibox-server-name { flex: 1; min-width: 0; color: #fff; font-weight: 600; }
.hosting-locations-multibox-server-region { display: inline-flex; align-items: center; gap: 7px; padding: 6px 12px; border: 1px solid rgba(92, 205, 222, .45); border-radius: 999px; color: #5ccdde; font-size: 13px; font-weight: 600; white-space: nowrap; }
.hosting-locations-faq-section .hosting-locations-section-title { margin-bottom: 32px; }
.hosting-locations-faq { max-width: 860px; margin: 0 auto; }
@media (max-width: 991px) {
    .hosting-locations-hero-row > .col-md-7, .hosting-locations-hero-row > .col-md-5 { width: 100%; }
    .hosting-locations-hero-visual { margin-top: 32px; }
    .hosting-locations-hero-image { max-width: 500px; }
    .hosting-locations-benefits-row > .col-md-5, .hosting-locations-benefits-row > .col-md-7 { width: 100%; }
    .hosting-locations-multibox-row > .col-md-6 { width: 100%; }
    .hosting-locations-multibox-visual { margin-top: 36px; }
}
/* Keep the fixed dialog actions outside one scrollable body when geography is shown. */
.swal2-popup.multibox-create-modal:has(.hosting-location-section, .hosting-location-budget) .swal2-content {
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
}
.swal2-popup.multibox-create-modal:has(.hosting-location-section, .hosting-location-budget) .multibox-picker {
    height: auto;
}
.swal2-popup.multibox-create-modal:has(.hosting-location-section, .hosting-location-budget) .multibox-picker-choices {
    flex: 0 0 auto;
    overflow: visible;
}
.swal2-popup.multibox-create-modal .multibox-picker > button.multibox-catalog-toggle {
    flex-wrap: wrap;
    white-space: normal;
    text-align: left;
}
@media (width < 768px) {
    .hosting-location-grid { grid-template-columns: minmax(0, 1fr); gap: 12px; }
    .hosting-location-map { width: 100%; max-width: 432px; margin-inline: auto; }
    .hosting-location-latency { align-items: stretch; flex-direction: column; }
    .hosting-location-countries { max-height: 300px; }
    .hosting-location-summary { grid-template-columns: 1fr; }
    .hosting-locations-page .site-section { padding-top: 48px; padding-bottom: 48px; }
    .hosting-locations-page .hosting-locations-hero { padding: 105px 0 60px; }
    .hosting-locations-page .hosting-locations-hero h1 { font-size: 2.2em; }
    .hosting-locations-page .hosting-locations-hero .hero-subtitle { font-size: 1em; }
    .hosting-locations-actions .cta-btn { flex: 1 1 100%; }
    .hosting-locations-hero-image { max-width: 420px; }
    .hosting-locations-section-title { font-size: 1.6em; }
    .hosting-locations-section-lead { margin-bottom: 28px; font-size: 15px; }
    .hosting-locations-benefits-title { font-size: 1.6em; }
    .hosting-locations-benefit-grid { grid-template-columns: minmax(0, 1fr); gap: 14px; }
    .hosting-locations-benefit { padding: 20px; }
    .hosting-locations-page .hosting-locations-steps { padding-bottom: 18px; }
    .hosting-locations-page .hosting-locations-plans { padding-bottom: 90px; }
    .hosting-location-showcase .hosting-location-grid { grid-template-columns: minmax(0, 1fr); gap: 16px; }
    .hosting-location-showcase .hosting-location-map { max-width: none; border-radius: 16px; }
    .hosting-location-showcase .hosting-location-marker-label { left: 10px; bottom: 9px; padding: 4px 6px; font-size: 10px; }
    .hosting-location-showcase .hosting-location-countries { max-height: none; }
    .hosting-location-showcase .hosting-location-country { padding: 18px 20px; }
    .hosting-location-coming { gap: 14px; padding: 16px 20px; }
    .hosting-location-legend { padding: 6px 10px; font-size: 11px; }
    .hosting-location-best { flex-wrap: wrap; padding: 16px; }
    .hosting-locations-trust { gap: 10px 16px; }
    .hosting-locations-trust li { flex: 1 1 calc(50% - 16px); font-size: 13px; }
    .hosting-locations-ping { padding: 18px 20px; }
    .hosting-locations-multibox-title { font-size: 1.6em; }
    .hosting-locations-multibox .cta-btn { width: 100%; }
    .hosting-locations-multibox-visual { padding: 16px; }
    .hosting-locations-multibox-server { gap: 10px; padding: 12px; }
    .hosting-locations-multibox-server-region { padding: 5px 9px; font-size: 12px; }
}