/* 7Sense · Experiencia de Contacto
   Todo vive bajo #svc-root. El reset usa :where() (especificidad 0)
   para no ganarle nunca a las clases propias ni escaparse al tema. */

:where(#svc-root) :where(*,
*::before,
*::after) {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
	font: inherit;
	color: inherit;
	line-height: inherit;
	letter-spacing: inherit;
	text-transform: none;
	list-style: none;
	outline: none;
	box-shadow: none;
	border-radius: 0;
	min-width: 0;
}

.svc-was-hidden { display: none !important; }

#svc-root {
	--ink: #07070a;
	--ink-2: #0d0d12;
	--ink-3: #14141b;
	--gold: #c9a227;
	--gold-2: #f0dba4;
	--gold-3: #f7ecc8;
	--bone: #faf8f4;
	--muted: rgba(250, 248, 244, .78);
	--line: rgba(240, 220, 160, .34);
	--serif: "Cormorant Garamond", "Didot", "Playfair Display", Georgia, "Times New Roman", serif;
	--sans: "Jost", "Titillium Web", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;

	position: relative;
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	background: var(--ink);
	color: var(--bone);
	font-family: var(--sans);
	font-size: 16px;
	line-height: 1.6;
	letter-spacing: .01em;
	overflow: clip;
	contain: layout style;
}

#svc-root ::selection { background: rgba(201, 162, 39, .32); color: #fff; }

/* El formulario real (Contact Form 7) vive aquí,
funcional pero invisible. */
#svc-formhost {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip-path: inset(50%);
	opacity: 0;
	pointer-events: none;
}
#svc-formhost.svc-formhost--visible {
	position: static;
	width: auto;
	height: auto;
	overflow: visible;
	clip-path: none;
	opacity: 1;
	pointer-events: auto;
	max-width: 620px;
	margin: 0 auto;
	padding: 48px 24px 96px;
}

/* ---------- tipografía ---------- */
#svc-root .svc-eyebrow {
	font-family: var(--sans);
	font-size: 11px;
	letter-spacing: .38em;
	text-transform: uppercase;
	color: var(--gold-2);
}
#svc-root .svc-display {
	font-family: var(--serif);
	font-weight: 300;
	font-size: clamp(2.4rem, 6.2vw, 5.2rem);
	line-height: 1.02;
	letter-spacing: -.015em;
}
#svc-root .svc-lede {
	font-family: var(--serif);
	font-size: clamp(1.15rem, 2.2vw, 1.55rem);
	line-height: 1.5;
	color: var(--muted);
}
#svc-root .svc-em { color: var(--gold-2); font-style: italic; }

/* ---------- textura de fondo ---------- */
#svc-root .svc-grain {
	position: absolute;
	inset: 0;
	pointer-events: none;
	opacity: .5;
	background-image:
		radial-gradient(900px 600px at 78% -5%, rgba(201, 162, 39, .16), transparent 62%),
		radial-gradient(700px 520px at 6% 105%, rgba(201, 162, 39, .10), transparent 60%);
	z-index: 0;
}

/* ---------- barra de progreso (oro) ---------- */
#svc-root .svc-rail {
	position: fixed;
	top: 22vh;
	right: 22px;
	width: 2px;
	height: 56vh;
	background: rgba(244, 241, 234, .10);
	z-index: 40;
	opacity: 0;
	transition: opacity .5s ease;
	pointer-events: none;
}
#svc-root .svc-rail.is-on { opacity: 1; }
#svc-root .svc-rail__fill {
	position: absolute;
	inset: 0 0 auto 0;
	height: 0%;
	background: linear-gradient(180deg, var(--gold-3), var(--gold));
	box-shadow: 0 0 14px rgba(201, 162, 39, .75);
}
#svc-root .svc-rail__dot {
	position: absolute;
	left: 50%;
	width: 7px;
	height: 7px;
	margin-left: -3.5px;
	margin-top: -3.5px;
	border-radius: 50%;
	background: var(--gold-3);
	box-shadow: 0 0 12px rgba(232, 208, 139, .9);
}

/* ---------- apertura ---------- */
#svc-root .svc-hero {
	position: relative;
	min-height: 100svh;
	display: grid;
	place-items: center;
	text-align: center;
	padding: 14vh 24px 10vh;
	z-index: 1;
}
#svc-root .svc-hero__inner { max-width: 760px; }
#svc-root .svc-hero .svc-eyebrow { margin-bottom: 26px; }
#svc-root .svc-hero .svc-lede { margin: 26px auto 0; max-width: 46ch; }
#svc-root .svc-hero__mark {
	width: 88px;
	margin: 0 auto 30px;
	opacity: .9;
}
#svc-root .svc-hero__mark svg { width: 100%; height: auto; display: block; }
#svc-root .svc-cue {
	margin-top: 54px;
	display: inline-flex;
	flex-direction: column;
	align-items: center;
	gap: 12px;
	font-size: 10px;
	letter-spacing: .34em;
	text-transform: uppercase;
	color: var(--muted);
}
#svc-root .svc-cue__line {
	width: 1px;
	height: 58px;
	background: linear-gradient(180deg, var(--gold), transparent);
	animation: svc-drip 2.4s ease-in-out infinite;
	transform-origin: top;
}
@keyframes svc-drip {
	0%, 100% { transform: scaleY(.35); opacity: .45; }
	50% { transform: scaleY(1); opacity: 1; }
}

/* ---------- cuestionario ---------- */
#svc-root .svc-quiz { position: relative; z-index: 1; }
#svc-root .svc-stage {
	position: sticky;
	top: 0;
	height: 100svh;
	display: grid;
	place-items: center;
	padding: 0 24px;
	overflow: hidden;
}
#svc-root .svc-stage__inner { position: relative; width: 100%; max-width: 780px; }

#svc-root .svc-q {
	position: absolute;
	inset: auto 0 auto 0;
	top: 50%;
	transform: translateY(-50%);
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	will-change: transform, opacity;
}
#svc-root .svc-q.is-live { visibility: visible; pointer-events: auto; }
#svc-root .svc-q__num {
	font-family: var(--serif);
	font-size: 13px;
	letter-spacing: .3em;
	color: var(--gold);
	margin-bottom: 18px;
}
#svc-root .svc-q__title {
	font-family: var(--serif);
	font-weight: 300;
	font-size: clamp(1.9rem, 4.6vw, 3.3rem);
	line-height: 1.12;
	letter-spacing: -.01em;
}
#svc-root .svc-q__help {
	margin-top: 14px;
	font-size: 14.5px;
	color: var(--muted);
	max-width: 52ch;
}
#svc-root .svc-q__body { margin-top: 34px; }

/* campo de texto */
#svc-root .svc-field {
	position: relative;
	display: block;
	max-width: 620px;
}
#svc-root .svc-field input,
#svc-root .svc-field textarea {
	display: block;
	width: 100%;
	padding: 14px 4px;
	font-family: var(--serif);
	font-size: clamp(1.25rem, 3vw, 1.9rem);
	color: var(--bone);
	background: transparent;
	border-bottom: 1px solid rgba(244, 241, 234, .22);
	transition: border-color .35s ease;
}
#svc-root .svc-field textarea { font-size: clamp(1.05rem, 2.2vw, 1.35rem); line-height: 1.55; resize: none; min-height: 120px; }
#svc-root .svc-field input::placeholder,
#svc-root .svc-field textarea::placeholder { color: rgba(244, 241, 234, .26); }
#svc-root .svc-field input:focus,
#svc-root .svc-field textarea:focus { border-color: var(--gold); }
#svc-root .svc-field__ink {
	position: absolute;
	left: 0;
	bottom: 0;
	height: 1px;
	width: 0;
	background: linear-gradient(90deg, var(--gold), var(--gold-3));
	box-shadow: 0 0 10px rgba(201, 162, 39, .7);
	transition: width .5s cubic-bezier(.22, 1, .36, 1);
}
#svc-root .svc-field.is-filled .svc-field__ink { width: 100%; }
#svc-root .svc-field.is-error input,
#svc-root .svc-field.is-error textarea { border-color: #c2553f; }

/* opciones */
#svc-root .svc-opts { display: flex; flex-wrap: wrap; gap: 10px; max-width: 700px; }
#svc-root .svc-opt {
	position: relative;
	cursor: pointer;
	padding: 12px 20px;
	font-size: 14px;
	letter-spacing: .02em;
	color: var(--bone);
	border: 1px solid rgba(244, 241, 234, .18);
	border-radius: 999px;
	background: rgba(244, 241, 234, .02);
	transition: border-color .3s ease, background .3s ease, color .3s ease, transform .3s ease;
}
#svc-root .svc-opt:hover { border-color: rgba(232, 208, 139, .55); transform: translateY(-1px); }
#svc-root .svc-opt.is-on {
	color: #1b1508;
	border-color: transparent;
	background: linear-gradient(135deg, var(--gold-3), var(--gold));
	box-shadow: 0 8px 26px rgba(201, 162, 39, .28);
}

/* acciones */
#svc-root .svc-actions { margin-top: 32px; display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }
#svc-root .svc-next {
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	gap: 12px;
	padding: 13px 26px;
	font-size: 11px;
	letter-spacing: .26em;
	text-transform: uppercase;
	color: var(--gold-2);
	border: 1px solid var(--line);
	border-radius: 999px;
	transition: color .3s, border-color .3s, background .3s;
}
#svc-root .svc-next:hover { color: #1b1508; background: linear-gradient(135deg, var(--gold-3), var(--gold)); border-color: transparent; }
#svc-root .svc-skip {
	cursor: pointer;
	font-size: 12px;
	letter-spacing: .12em;
	color: rgba(244, 241, 234, .4);
	border-bottom: 1px solid transparent;
	transition: color .3s, border-color .3s;
}
#svc-root .svc-skip:hover { color: var(--bone); border-color: var(--line); }

/* contador de pasos */
#svc-root .svc-steps {
	position: absolute;
	left: 50%;
	bottom: 5vh;
	transform: translateX(-50%);
	display: flex;
	gap: 7px;
	z-index: 3;
}
#svc-root .svc-steps span {
	width: 22px;
	height: 2px;
	background: rgba(244, 241, 234, .16);
	transition: background .4s ease, box-shadow .4s ease;
}
#svc-root .svc-steps span.is-on { background: linear-gradient(90deg, var(--gold-3), var(--gold)); box-shadow: 0 0 10px rgba(201, 162, 39, .6); }

/* ---------- mapa ---------- */
#svc-root .svc-map-sec {
	position: relative;
	z-index: 1;
	padding: 14vh 24px 12vh;
	background: linear-gradient(180deg, var(--ink), var(--ink-2) 40%, var(--ink));
	border-top: 1px solid rgba(232, 208, 139, .10);
}
#svc-root .svc-wrap { width: 100%; max-width: 1180px; margin: 0 auto; }
#svc-root .svc-map-head { max-width: 640px; margin-bottom: 42px; }
#svc-root .svc-map-head .svc-eyebrow { display: block; margin-bottom: 18px; }
#svc-root .svc-map-head h2 { font-family: var(--serif); font-weight: 300; font-size: clamp(2rem, 4.4vw, 3.2rem); line-height: 1.08; }
#svc-root .svc-map-head p { margin-top: 16px; color: var(--muted); font-size: 15.5px; max-width: 48ch; }

#svc-root .svc-map-grid { display: grid; grid-template-columns: 1.55fr 1fr; gap: 26px; align-items: stretch; }
#svc-root .svc-map-shell {
	position: relative;
	min-height: 460px;
	border: 1px solid var(--line);
	overflow: hidden;
	background: var(--ink-3);
}
#svc-map { position: absolute; inset: 0; }
#svc-root .svc-map-shell::after {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	box-shadow: inset 0 0 90px rgba(0, 0, 0, .75);
}
#svc-root .svc-map-veil {
	position: absolute;
	inset: 0;
	z-index: 500;
	display: grid;
	place-items: center;
	cursor: pointer;
	background: rgba(7, 7, 10, .55);
	backdrop-filter: blur(1.5px);
	transition: opacity .5s ease;
	font-size: 11px;
	letter-spacing: .28em;
	text-transform: uppercase;
	color: var(--gold-2);
}
#svc-root .svc-map-veil span { border: 1px solid var(--line); padding: 12px 22px; border-radius: 999px; background: rgba(7, 7, 10, .6); }
#svc-root .svc-map-veil.is-off { opacity: 0; pointer-events: none; }

#svc-root .svc-pin { position: relative; width: 26px; height: 26px; }
#svc-root .svc-pin__core {
	position: absolute;
	inset: 8px;
	border-radius: 50%;
	background: linear-gradient(135deg, var(--gold-3), var(--gold));
	box-shadow: 0 0 14px rgba(232, 208, 139, .9);
}
#svc-root .svc-pin__ring {
	position: absolute;
	inset: 0;
	border-radius: 50%;
	border: 1px solid rgba(232, 208, 139, .8);
	animation: svc-pulse 2.6s ease-out infinite;
}
@keyframes svc-pulse {
	0% { transform: scale(.45); opacity: 1; }
	100% { transform: scale(1.9); opacity: 0; }
}

#svc-root .svc-info { display: flex; flex-direction: column; gap: 14px; }
#svc-root .svc-card {
	border: 1px solid rgba(244, 241, 234, .10);
	background: linear-gradient(180deg, rgba(244, 241, 234, .035), rgba(244, 241, 234, .012));
	padding: 22px 24px;
	transition: border-color .4s ease, transform .4s ease;
}
#svc-root .svc-card:hover { border-color: var(--line); transform: translateY(-2px); }
#svc-root .svc-card h3 { font-size: 10px; letter-spacing: .3em; text-transform: uppercase; color: var(--gold-2); margin-bottom: 12px; }
#svc-root .svc-card p,
#svc-root .svc-card a { font-family: var(--serif); font-size: 19px; line-height: 1.45; color: var(--bone); }
#svc-root .svc-card a { text-decoration: none; border-bottom: 1px solid var(--line); transition: color .3s, border-color .3s; }
#svc-root .svc-card a:hover { color: var(--gold-2); border-color: var(--gold); }
#svc-root .svc-hours { display: grid; gap: 6px; }
#svc-root .svc-hours div { display: flex; justify-content: space-between; gap: 16px; font-family: var(--sans); font-size: 14px; color: var(--muted); }
#svc-root .svc-hours b { font-weight: 400; color: var(--bone); }
#svc-root .svc-go {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin-top: 4px;
	padding: 13px 24px;
	font-family: var(--sans);
	font-size: 11px;
	letter-spacing: .26em;
	text-transform: uppercase;
	color: #1b1508;
	background: linear-gradient(135deg, var(--gold-3), var(--gold));
	border-radius: 999px;
	text-decoration: none;
	border: 0;
	transition: transform .3s ease, box-shadow .3s ease;
}
#svc-root .svc-go:hover { transform: translateY(-2px); box-shadow: 0 12px 30px rgba(201, 162, 39, .3); }
#svc-root .svc-social { display: flex; flex-wrap: wrap; gap: 8px; }
#svc-root .svc-social a {
	font-family: var(--sans);
	font-size: 11px;
	letter-spacing: .18em;
	text-transform: uppercase;
	padding: 9px 15px;
	border: 1px solid rgba(244, 241, 234, .14);
	border-radius: 999px;
	text-decoration: none;
	color: var(--muted);
	transition: color .3s, border-color .3s;
}
#svc-root .svc-social a:hover { color: var(--gold-2); border-color: var(--gold); }

/* ---------- cierre: oro líquido ---------- */
#svc-root .svc-gold { position: relative; z-index: 1; height: 320svh; }
#svc-root .svc-gold__stage {
	position: sticky;
	top: 0;
	height: 100svh;
	display: grid;
	place-items: center;
	overflow: hidden;
	background: radial-gradient(70% 60% at 50% 45%, rgba(201, 162, 39, .10), transparent 70%), var(--ink);
}
#svc-root .svc-gold__inner { position: relative; width: 100%; max-width: 900px; padding: 0 24px; text-align: center; }
#svc-root .svc-logo {
	position: relative;
	width: min(46vw, 270px);
	margin: 0 auto;
	transition: width .7s cubic-bezier(.22, 1, .36, 1), margin .7s ease;
	filter: drop-shadow(0 18px 50px rgba(201, 162, 39, .28));
}
#svc-root .svc-logo svg { width: 100%; height: auto; display: block; overflow: visible; }
#svc-root .svc-logo__outline { fill: none; stroke: rgba(232, 208, 139, .5); stroke-width: 55; stroke-linejoin: round; }
#svc-root .svc-logo__surface { fill: none; stroke: rgba(247, 236, 200, .95); stroke-width: 5; opacity: .9; }
#svc-root .svc-gold__caption { margin-top: 40px; }
#svc-root .svc-gold__caption .svc-eyebrow { display: block; margin-bottom: 16px; }
#svc-root .svc-gold__caption h2 { font-family: var(--serif); font-weight: 300; font-size: clamp(1.7rem, 3.6vw, 2.7rem); line-height: 1.14; }
#svc-root .svc-gold__caption p { margin: 14px auto 0; max-width: 46ch; color: var(--muted); font-size: 15px; }

#svc-root .svc-gold__inner.is-tight .svc-logo { width: min(26vw, 156px); }
#svc-root .svc-gold__inner.is-tight .svc-gold__caption { margin-top: 24px; }
#svc-root .svc-gold__inner.is-tight .svc-gold__caption p:not(.svc-gold__cta) { display: none; }
#svc-root .svc-gold__inner.is-tight.is-sent .svc-gold__caption p { display: block; }
#svc-root .svc-gold__inner.is-sent .svc-logo { width: min(30vw, 190px); }

#svc-root .svc-review {
	margin: 26px auto 0;
	max-width: 840px;
	display: grid;
	grid-template-columns: 1fr 1fr;
	column-gap: 34px;
	gap: 0 34px;
	text-align: left;
	opacity: 0;
	transform: translateY(14px);
	transition: opacity .6s ease, transform .6s ease;
}
#svc-root .svc-review.is-on { opacity: 1; transform: none; }
#svc-root .svc-review__row {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 14px;
	padding: 8px 0;
	border-bottom: 1px solid rgba(244, 241, 234, .08);
	font-size: 14px;
}
#svc-root .svc-review__k { color: rgba(244, 241, 234, .42); letter-spacing: .12em; text-transform: uppercase; font-size: 10.5px; padding-top: 3px; }
#svc-root .svc-review__v { font-family: var(--serif); font-size: 16px; color: var(--bone); text-align: right; }
#svc-root .svc-review__edit { cursor: pointer; font-size: 10px; letter-spacing: .2em; text-transform: uppercase; color: var(--gold); margin-left: 12px; }

#svc-root .svc-send-wrap { margin-top: 26px; opacity: 0; transform: translateY(16px); pointer-events: none; transition: opacity .7s ease, transform .7s ease; }
#svc-root .svc-send-wrap.is-on { opacity: 1; transform: none; pointer-events: auto; }
#svc-root .svc-send {
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	gap: 14px;
	padding: 16px 38px;
	font-size: 11.5px;
	letter-spacing: .3em;
	text-transform: uppercase;
	color: #1b1508;
	background: linear-gradient(135deg, var(--gold-3), var(--gold) 55%, #a8831c);
	border-radius: 999px;
	transition: transform .3s ease, box-shadow .3s ease, filter .3s ease;
}
#svc-root .svc-send:hover { transform: translateY(-2px); box-shadow: 0 16px 44px rgba(201, 162, 39, .38); }
#svc-root .svc-send[disabled] { filter: grayscale(.6) brightness(.8); cursor: wait; }
#svc-root .svc-note { margin-top: 16px; font-size: 12.5px; color: rgba(244, 241, 234, .38); }
#svc-root .svc-note a { color: var(--gold-2); text-decoration: none; border-bottom: 1px solid var(--line); }
#svc-root .svc-msg { margin-top: 18px; font-size: 14px; min-height: 22px; }
#svc-root .svc-msg.is-err { color: #e08b76; }
#svc-root .svc-msg.is-ok { color: var(--gold-2); }

/* gota de oro que cae al completar */
#svc-root .svc-drops { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
#svc-root .svc-drop {
	position: absolute;
	width: 5px;
	height: 5px;
	border-radius: 50% 50% 55% 55%;
	background: linear-gradient(180deg, var(--gold-3), var(--gold));
	box-shadow: 0 0 10px rgba(232, 208, 139, .8);
	opacity: 0;
}

/* ---------- responsive ---------- */
@media (max-width: 980px) {
	#svc-root .svc-map-grid { grid-template-columns: 1fr; }
	#svc-root .svc-map-shell { min-height: 380px; }
	#svc-root .svc-rail { display: none; }
}
@media (max-width: 640px) {
	#svc-root .svc-stage { padding: 0 20px; }
	#svc-root .svc-q__body { margin-top: 26px; }
	#svc-root .svc-opts { gap: 8px; }
	#svc-root .svc-opt { padding: 11px 16px; font-size: 13.5px; }
	#svc-root .svc-map-sec { padding: 11vh 20px 10vh; }
	#svc-root .svc-logo { width: 62vw; }
	#svc-root .svc-gold__inner.is-tight .svc-logo { width: 34vw; }
	#svc-root .svc-review { grid-template-columns: 1fr; }
	#svc-root .svc-review__row { padding: 7px 0; }
	#svc-root .svc-review__v { font-size: 14.5px; }
	#svc-root .svc-gold__caption h2 { font-size: 1.5rem; }
	#svc-root .svc-gold { height: 280svh; }
	#svc-root .svc-review__v { font-size: 15.5px; }
}

/* ---------- accesibilidad ---------- */
@media (prefers-reduced-motion: reduce) {
	#svc-root * { animation: none !important; transition-duration: .01ms !important; }
	#svc-root .svc-cue__line { animation: none; }
}

@keyframes svc-fall {
	0% { transform: translateY(-40px) scale(.6); opacity: 0; }
	18% { opacity: 1; }
	100% { transform: translateY(240px) scale(1.15); opacity: 0; }
}


/* ============================================================
   v1.1 · Contraste, materiales y mapa (guía Apple Design)
   ============================================================ */

/* 1. El tema pinta h1/h2/p/a con sus propios colores y le gana al reset
   de especificidad 0. Estas reglas (1,0,1) devuelven el control sin tocar
   nada fuera de #svc-root ni los elementos internos del mapa. */
#svc-root h1, #svc-root h2, #svc-root h3, #svc-root h4,
#svc-root p, #svc-root span, #svc-root b, #svc-root strong,
#svc-root em, #svc-root i, #svc-root label, #svc-root li,
#svc-root button, #svc-root input, #svc-root textarea {
	color: inherit;
	-webkit-text-fill-color: currentColor;
	text-shadow: none;
	background-image: none;
	-webkit-background-clip: border-box;
	background-clip: border-box;
	text-decoration: none;
}
#svc-root a { color: inherit; -webkit-text-fill-color: currentColor; text-shadow: none; }
#svc-root .leaflet-container,
#svc-root .leaflet-container * { -webkit-text-fill-color: initial; }

/* 2. Jerarquía tipográfica con contraste real sobre negro */
#svc-root .svc-display { color: var(--bone); letter-spacing: -.02em; }
#svc-root .svc-q__title { color: var(--bone); letter-spacing: -.015em; }
#svc-root .svc-map-head h2,
#svc-root .svc-gold__caption h2 { color: var(--bone); letter-spacing: -.015em; }
#svc-root .svc-lede { color: rgba(250, 248, 244, .82); }
#svc-root .svc-q__help { color: rgba(250, 248, 244, .74); font-size: 15.5px; letter-spacing: .005em; }
#svc-root .svc-eyebrow {
	color: #f2e1ae;
	font-size: 12px;
	font-weight: 500;
	letter-spacing: .3em;
}
#svc-root .svc-q__num { color: #f0dba4; font-size: 13.5px; letter-spacing: .26em; }
#svc-root .svc-cue { color: rgba(250, 248, 244, .7); font-size: 10.5px; }
#svc-root .svc-note { color: rgba(250, 248, 244, .6); }
#svc-root .svc-note a { color: #f2e1ae; }
#svc-root .svc-review__k { color: rgba(250, 248, 244, .62); font-size: 11px; }
#svc-root .svc-review__v { color: var(--bone); }
#svc-root .svc-review__edit { color: #f0dba4; }
#svc-root .svc-hours div { color: rgba(250, 248, 244, .76); }
#svc-root .svc-card h3 { color: #f2e1ae; font-size: 11px; letter-spacing: .26em; }
#svc-root .svc-social a { color: rgba(250, 248, 244, .8); border-color: rgba(250, 248, 244, .26); }
#svc-root .svc-field input::placeholder,
#svc-root .svc-field textarea::placeholder { color: rgba(250, 248, 244, .42); }
#svc-root .svc-field input,
#svc-root .svc-field textarea { color: var(--bone); border-bottom-color: rgba(250, 248, 244, .34); }

/* 3. Material: el texto vive sobre una superficie translúcida, no sobre el vacío */
#svc-root .svc-q {
	background: linear-gradient(180deg, rgba(255, 255, 255, .055), rgba(255, 255, 255, .022));
	backdrop-filter: blur(22px) saturate(150%);
	-webkit-backdrop-filter: blur(22px) saturate(150%);
	border: 1px solid rgba(255, 255, 255, .10);
	border-radius: 26px;
	padding: 38px 40px 34px;
	box-shadow: 0 30px 80px rgba(0, 0, 0, .55);
}
#svc-root .svc-card {
	background: linear-gradient(180deg, rgba(255, 255, 255, .07), rgba(255, 255, 255, .025));
	backdrop-filter: blur(18px) saturate(140%);
	-webkit-backdrop-filter: blur(18px) saturate(140%);
	border: 1px solid rgba(255, 255, 255, .12);
	border-radius: 20px;
}
#svc-root .svc-opt {
	border-color: rgba(250, 248, 244, .28);
	background: rgba(255, 255, 255, .05);
	color: var(--bone);
}
#svc-root .svc-opt:hover { background: rgba(255, 255, 255, .1); border-color: rgba(240, 219, 164, .7); }
#svc-root .svc-opt.is-on { color: #17120a; -webkit-text-fill-color: #17120a; background: linear-gradient(135deg, var(--gold-3), var(--gold)); }
#svc-root .svc-next { color: #f2e1ae; border-color: rgba(240, 220, 160, .42); }
#svc-root .svc-next:hover,
#svc-root .svc-next:active { color: #17120a; -webkit-text-fill-color: #17120a; }
#svc-root .svc-send,
#svc-root .svc-go { color: #17120a; -webkit-text-fill-color: #17120a; }
#svc-root .svc-skip { color: rgba(250, 248, 244, .62); }

/* 4. Respuesta inmediata al pulsar (Apple: feedback en pointer-down) */
#svc-root .svc-opt:active,
#svc-root .svc-next:active,
#svc-root .svc-send:active,
#svc-root .svc-go:active,
#svc-root .svc-social a:active { transform: scale(.97); transition: transform 100ms ease-out; }

/* 5. Mapa: superficie continua, cromo flotante, sin API key */
#svc-root .svc-map-shell {
	border-radius: 24px;
	border-color: rgba(255, 255, 255, .12);
	box-shadow: 0 40px 90px rgba(0, 0, 0, .55);
}
#svc-root .svc-map-shell::after { box-shadow: inset 0 0 60px rgba(0, 0, 0, .5); border-radius: 24px; }
#svc-root .leaflet-container { background: #0c0c11; font-family: var(--sans); }
#svc-root .leaflet-tile-pane { filter: contrast(1.06) brightness(1.12) saturate(.85); }
#svc-root .svc-labels { filter: brightness(1.75) contrast(1.1); opacity: .9; }

#svc-root .svc-map-card {
	position: absolute;
	left: 18px;
	bottom: 18px;
	z-index: 600;
	max-width: 300px;
	padding: 16px 18px;
	border-radius: 18px;
	background: rgba(12, 12, 17, .62);
	backdrop-filter: blur(24px) saturate(160%);
	-webkit-backdrop-filter: blur(24px) saturate(160%);
	border: 1px solid rgba(255, 255, 255, .14);
	box-shadow: 0 20px 50px rgba(0, 0, 0, .6);
}
#svc-root .svc-map-card b { display: block; font-size: 11px; letter-spacing: .26em; text-transform: uppercase; color: #f2e1ae; font-weight: 500; }
#svc-root .svc-map-card p { margin-top: 8px; font-family: var(--serif); font-size: 17px; line-height: 1.35; color: var(--bone); }
#svc-root .svc-map-card .svc-go { margin-top: 12px; padding: 10px 18px; font-size: 10.5px; }

#svc-root .svc-zoom {
	position: absolute;
	right: 18px;
	bottom: 46px;
	z-index: 600;
	display: flex;
	flex-direction: column;
	border-radius: 16px;
	overflow: hidden;
	background: rgba(12, 12, 17, .6);
	backdrop-filter: blur(24px) saturate(160%);
	-webkit-backdrop-filter: blur(24px) saturate(160%);
	border: 1px solid rgba(255, 255, 255, .14);
	box-shadow: 0 16px 40px rgba(0, 0, 0, .5);
}
#svc-root .svc-zoom button {
	cursor: pointer;
	width: 42px;
	height: 42px;
	font-size: 19px;
	line-height: 1;
	color: var(--bone);
	transition: background .2s ease;
}
#svc-root .svc-zoom button:first-child { border-bottom: 1px solid rgba(255, 255, 255, .12); }
#svc-root .svc-zoom button:hover { background: rgba(255, 255, 255, .1); }
#svc-root .svc-zoom button:active { background: rgba(255, 255, 255, .18); }

#svc-root .svc-map-veil { background: rgba(7, 7, 10, .42); color: var(--bone); }
#svc-root .svc-map-veil span {
	background: rgba(12, 12, 17, .72);
	backdrop-filter: blur(20px) saturate(150%);
	-webkit-backdrop-filter: blur(20px) saturate(150%);
	border-color: rgba(255, 255, 255, .18);
	color: #f2e1ae;
	font-size: 11.5px;
	transition: transform 120ms ease-out;
}
#svc-root .svc-map-veil:active span { transform: scale(.97); }
#svc-root .leaflet-control-attribution {
	background: rgba(12, 12, 17, .65) !important;
	color: rgba(250, 248, 244, .6) !important;
	font-size: 10px !important;
	padding: 2px 8px !important;
	border-radius: 10px 0 0 0;
}
#svc-root .leaflet-control-attribution a { color: rgba(250, 248, 244, .8) !important; }

#svc-root .svc-pin__core { box-shadow: 0 0 0 4px rgba(12, 12, 17, .55), 0 0 18px rgba(240, 219, 164, .95); }

/* 6. Contraste alto y transparencia reducida del sistema */
@media (prefers-contrast: more) {
	#svc-root { --muted: rgba(255, 255, 255, .95); }
	#svc-root .svc-q,
	#svc-root .svc-card,
	#svc-root .svc-map-card,
	#svc-root .svc-zoom { background: #0a0a0e; backdrop-filter: none; border-color: rgba(255, 255, 255, .5); }
	#svc-root .svc-opt { border-color: rgba(255, 255, 255, .6); background: #101017; }
	#svc-root .svc-q__help, #svc-root .svc-lede { color: #fff; }
}
@media (prefers-reduced-transparency: reduce) {
	#svc-root .svc-q,
	#svc-root .svc-card,
	#svc-root .svc-map-card,
	#svc-root .svc-zoom,
	#svc-root .svc-map-veil span { background: rgba(10, 10, 14, .96); backdrop-filter: none; -webkit-backdrop-filter: none; }
}

@media (max-width: 640px) {
	#svc-root .svc-q { padding: 26px 22px 24px; border-radius: 22px; }
	#svc-root .svc-map-card { left: 12px; right: 12px; bottom: 32px; max-width: none; }
	#svc-root .svc-zoom { display: none; }
}