/* Presentation only. Existing estimator, map, navigation and FAQ scripts own state. */
:root {
  color-scheme:dark;
  --bg-color:#0b1113;--bg-surface:#111b1e;--text-main:#f1f4f3;
  --text-muted:#abb9bc;--accent:#009c98;--accent-light:#79ddd5;
  --glass-border:#304145;--font-primary:Unbounded,Manrope,sans-serif;
  --font-secondary:Manrope,Arial,sans-serif;
}
body {background:var(--bg-color);font-family:var(--font-secondary);line-height:1.65;-webkit-font-smoothing:antialiased;display:flex;flex-direction:column}
/* Move only the explanatory, non-interactive text below the tools visually. */
body>main {display:flex;flex-direction:column}
:is(body,body>main)>nav {order:1}
:is(body,body>main)>.page-header {order:2}
:is(body,body>main)>.section-padding:has(#tattooEstimatorV5) {order:3}
:is(body,body>main)>section.container:has(.seo-text) {order:4}
:is(body,body>main)>.section-padding:has([data-i18n-faq="faqTitle"]) {order:5}
body>footer {order:6}
.falling-ink-container {display:none}
h1,h2 {font-family:var(--font-primary);font-weight:500;letter-spacing:-.035em;line-height:1.15;text-transform:none;text-wrap:balance}
h3,h4 {font-family:var(--font-secondary);text-transform:none;letter-spacing:-.02em}
.container {max-width:1480px;padding-inline:clamp(24px,5.2vw,88px)}
header,header.scrolled,header.always-scrolled {background:var(--bg-color);border-bottom:1px solid var(--glass-border);backdrop-filter:none;box-shadow:none}
header .logo {font-family:var(--font-secondary);font-weight:600;letter-spacing:.02em}
header nav a {font-size:14px;text-transform:none;font-weight:600}
.breadcrumb-nav {font-size:13px}
:is(body,body>main)>nav.container[aria-label="breadcrumb"] {padding-top:0!important}
.page-header {background:transparent;text-align:left;padding-block:48px!important}
.page-header>.container {display:grid;grid-template-columns:1.1fr 1fr;gap:64px;align-items:center}
.page-header .page-title {font-size:clamp(38px,4.2vw,64px);margin:0;max-width:16ch;color:var(--text-main)}
.page-title .text-accent {color:inherit}
.page-header .page-subtitle {font-family:var(--font-secondary);font-size:18px;line-height:1.7;color:var(--text-muted);max-width:60ch;margin:0}
section.container:has(.seo-text) {max-width:1480px!important;padding:0 clamp(24px,5.2vw,88px) 40px!important}
.seo-text {display:grid;grid-template-columns:1.1fr 1fr;gap:16px 64px;font-size:14px!important}
.seo-text p {margin:0!important}
.seo-text p:first-child {grid-row:span 2}
.calc-container {max-width:1480px;display:grid;grid-template-columns:minmax(0,1fr);gap:64px;margin-top:0}
.te-turquoise {--te-accent:var(--accent-light);--te-muted:var(--text-muted);--te-muted2:var(--text-muted);--te-shadow:none;min-width:0}
.te-turquoise .te-card {padding:40px;border-radius:12px;border:1px solid var(--glass-border);box-shadow:none}
.te-head {gap:24px;margin-bottom:24px;align-items:flex-start}
.te-title {font-family:var(--font-primary);font-size:clamp(24px,2.4vw,34px);font-weight:500;letter-spacing:-.025em;line-height:1.3}
.te-sub {font-size:14px;line-height:1.6;max-width:65ch;margin-top:12px}
.te-badge {background:var(--bg-color);border-color:var(--glass-border);color:var(--accent-light);padding:12px 16px;font-size:16px;font-variant-numeric:tabular-nums;white-space:nowrap}
.te-progress {background:var(--glass-border);height:4px;margin:24px 0 32px}
.te-grid {grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px 32px}
.te-field {min-width:0}
.te-grid>.te-field:first-child,.te-grid>.te-field:last-child {grid-column:1/-1}
.te-field label {font-size:14px;letter-spacing:0;text-transform:none;color:var(--text-main);margin-bottom:10px}
.te-field input[type="text"],.te-field select {background:var(--bg-color);border:1px solid var(--glass-border);padding:14px 16px;font-size:15px;min-height:50px;box-shadow:none}
.te-field select:disabled {opacity:.55;cursor:not-allowed}
.te-field input[type="text"]:focus,.te-field select:focus {border-color:var(--accent-light);box-shadow:none;outline:2px solid var(--accent-light);outline-offset:3px}
.te-sliders {background:transparent;border:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:32px}
.te-slider-top {font-size:15px;margin-bottom:14px}
.te-slider-val {font-variant-numeric:tabular-nums}
input[type="range"] {min-height:28px;cursor:pointer}
input[type="range"]::-webkit-slider-thumb {width:22px;height:22px;margin-top:-8px}
.te-presets {margin-top:12px;gap:10px}
.te-chip {font:600 14px/1.4 var(--font-secondary);background:transparent;border:1px solid var(--glass-border);padding:12px 16px;min-height:44px;border-radius:4px}
.te-chip:hover {background:#172326;border-color:var(--accent-light)}
.te-hint {font-size:13px;line-height:1.6;margin-top:10px;color:var(--text-muted)}
.te-checks {background:transparent;border:0;padding:0;gap:14px}
.te-check {min-height:36px}
.te-check input {width:20px;height:20px;flex-shrink:0}
.te-result {background:var(--bg-color);border-color:var(--glass-border);border-radius:8px;margin-top:32px;padding:28px;gap:16px}
.te-result-title {font-size:17px;font-weight:600;letter-spacing:0;text-transform:none}
.te-price {font-family:var(--font-primary);font-size:clamp(28px,3.2vw,44px);font-weight:500;letter-spacing:-.025em;line-height:1.3;color:var(--text-main);font-variant-numeric:tabular-nums}
.te-small,.te-result-sub {color:var(--text-muted);font-size:14px;line-height:1.65}
.te-actions {margin-top:24px}
.te-actions .te-btn,.btn {font:600 14px/1.5 var(--font-secondary);padding:16px 22px;border-radius:4px;min-height:52px;letter-spacing:0;text-transform:none;box-shadow:none;white-space:normal}
.te-actions .te-social-link {background:var(--accent)!important;color:var(--bg-color)!important;border-color:var(--accent)!important}
.te-actions #btnContact {color:var(--text-main)!important;border-color:var(--accent-light)!important;background:transparent}
.te-actions .te-btn:hover {filter:brightness(1.12);transform:none;box-shadow:none}
.te-notice {background:transparent;border-color:var(--glass-border);box-shadow:none;margin-top:24px}
.te-notice-text {color:var(--text-muted);font-size:13px;line-height:1.65}
.map-panel#advancedPainMap {padding:40px!important;margin-top:0!important;background:transparent!important;border:0!important;border-top:1px solid var(--glass-border)!important;border-radius:0!important;min-width:0}
#advancedPainMap h2 {font-size:clamp(28px,3vw,42px)!important;max-width:22ch;margin-bottom:16px!important}
#advancedPainMap .map-layout {width:100%;gap:48px!important}
#advancedPainMap .map-visuals {background:var(--bg-surface)!important;padding:24px!important;min-width:0}
#painMapSvg {filter:none!important}
#painMapSvg .svg-zone:not(.hovered):not(.active) {fill:#263b40;stroke:#567179}
#advancedPainMap #activeZoneDetails {background:var(--bg-surface)!important;border-color:var(--glass-border)!important;padding:28px!important}
#zTitle {text-transform:none!important;font-size:24px!important}
#advancedPainMap button {font-family:var(--font-secondary)!important;min-height:44px}
#btnAction {background:var(--accent);color:var(--bg-color);border-color:var(--accent);font-size:14px}
#advancedPainMap [data-i18n-map="disclaimer"] {color:var(--text-muted)!important;text-transform:none!important;font-size:13px!important;line-height:1.7}
.section-padding:has([data-i18n-faq="faqTitle"])>.container {max-width:1480px!important}
[data-i18n-faq="faqTitle"] {text-align:left!important;font-size:clamp(28px,3vw,42px)!important;max-width:22ch}
.faq-item {border:0;border-bottom:1px solid var(--glass-border);border-radius:0;background:transparent;box-shadow:none}
.faq-question {font-family:var(--font-secondary);font-size:16px;padding:24px 0;text-transform:none;color:var(--text-main)}
.faq-answer {font-family:var(--font-secondary);color:var(--text-muted);line-height:1.75}
footer {background:var(--bg-surface);border-top:1px solid var(--glass-border)}
footer h4 {color:var(--text-main);font-size:18px}
footer .logo {font-family:var(--font-secondary)}
::selection {background:var(--accent-light);color:var(--bg-color)}
:focus-visible {outline:3px solid var(--accent-light);outline-offset:4px}
::-webkit-scrollbar {width:10px}::-webkit-scrollbar-track {background:var(--bg-color)}::-webkit-scrollbar-thumb {background:var(--glass-border);border-radius:8px}
@media(max-width:1000px){.page-header>.container,.seo-text {gap:24px 40px}.te-turquoise .te-card,.map-panel#advancedPainMap {padding:28px!important}.calc-container{gap:48px}}
@media(max-width:680px){
 .page-header {padding-block:32px!important}
 .page-header>.container,.seo-text {grid-template-columns:1fr;gap:20px}
 .page-header .page-title {font-size:36px}
 .page-header .page-subtitle {font-size:16px}
 .seo-text p:first-child {grid-row:auto}
 .te-turquoise .te-card {padding:24px 20px}
 .te-grid,.te-sliders {grid-template-columns:1fr;gap:24px}
 .te-sessions {gap:12px}
 .te-title {font-size:24px}
 .te-head-right {width:100%}
 .te-sub,.te-small {font-size:13px}
 .te-actions {flex-direction:column}
 .te-result {padding:22px 16px}
 .te-price {font-size:28px;overflow-wrap:anywhere}
 .map-panel#advancedPainMap {padding:32px 0!important}
 #advancedPainMap .map-layout {grid-template-columns:1fr!important;gap:24px!important}
 #advancedPainMap .map-visuals {padding:20px 12px!important;width:100%}
 #advancedPainMap #activeZoneDetails {padding:24px 20px!important}
 #advancedPainMap .map-info-card {min-width:0;width:100%}
 .faq-question {font-size:15px;padding:22px 0}
 .section-padding {padding-block:40px}
}

.te-actions .te-social-link{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:12px 20px;text-decoration:none;flex:1}
.te-actions .te-social-link:focus-visible{outline:2px solid var(--accent);outline-offset:4px}

.te-actions .te-phone-link{flex-basis:100%;width:fit-content;min-height:44px;display:flex;align-items:center;color:var(--text-color);font-weight:600;font-size:18px;text-underline-offset:4px}
/* Native equivalent of pointer selection on the body map. */
.map-zone-picker{display:grid;gap:8px;margin:24px 0;max-width:34rem}
.map-zone-picker label{color:#f1f4f3;font-weight:600}
.map-zone-picker select{width:100%;min-height:44px;padding:10px 12px;border:1px solid #587177;border-radius:4px;background:#111b1e;color:#f1f4f3;font:400 16px/1.5 Manrope,Arial,sans-serif}
.map-zone-picker select:focus-visible{outline:2px solid #79ddd5;outline-offset:3px}
