/* M4RTIAL V110 · sistema visual común y modo oscuro nativo · build 2026-08-02 */

:root {
  color-scheme: light;
  --m4-focus: #f0d47a;
  --m4-dark-bg: #0b0b0a;
  --m4-dark-surface: #131310;
  --m4-dark-surface-2: #191814;
  --m4-dark-surface-3: #211f19;
  --m4-dark-text: #f4f0e7;
  --m4-dark-muted: #b5b0a5;
  --m4-dark-subtle: #8f8a80;
  --m4-dark-line: rgba(255, 255, 255, .12);
  --m4-dark-line-strong: rgba(240, 212, 122, .28);
  --m4-dark-shadow: 0 24px 64px rgba(0, 0, 0, .34);
}

html {
  background: #090908;
  text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
}

body {
  min-width: 0;
}

::selection {
  color: #090908;
  background: #f0d47a;
}

button,
input,
select,
textarea {
  max-width: 100%;
}

input,
select,
textarea {
  font-size: max(16px, 1em);
}

:where(a, button, input, select, textarea, summary):focus-visible {
  outline: 3px solid var(--m4-focus) !important;
  outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto !important;
  }

  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

html[data-theme="dark"] {
  color-scheme: dark;
  --black: #070706;
  --charcoal: #11110f;
  --charcoal-2: #191813;
  --cream: #171611;
  --paper: #0d0d0b;
  --white: #f7f3ea;
  --ink: var(--m4-dark-text);
  --muted: var(--m4-dark-muted);
  --line: var(--m4-dark-line);
  --shadow: var(--m4-dark-shadow);
  --v100-paper: #0d0d0b;
  --v100-cream: #171611;
  --v100-ink: var(--m4-dark-text);
  --v105-paper: #0d0d0b;
  --v105-ink: var(--m4-dark-text);
  --v105-muted: var(--m4-dark-muted);
  --v105-line: var(--m4-dark-line);
  --seo-paper: #0d0d0b;
  --seo-ink: var(--m4-dark-text);
  --seo-muted: var(--m4-dark-muted);
  --seo-line: var(--m4-dark-line);
  background: var(--m4-dark-bg);
}

html[data-theme="dark"] body {
  color: var(--m4-dark-text);
  background:
    radial-gradient(circle at 86% 2%, rgba(211, 169, 63, .08), transparent 34rem),
    var(--m4-dark-bg) !important;
}

html[data-theme="dark"] body::before {
  background: var(--m4-dark-bg) !important;
}

html[data-theme="dark"] :where(p, li, dd, figcaption, small) {
  text-rendering: optimizeLegibility;
}

html[data-theme="dark"] :where(input, select, textarea) {
  color: var(--m4-dark-text) !important;
  border-color: rgba(255, 255, 255, .18) !important;
  background: #11110f !important;
  caret-color: #f0d47a;
}

html[data-theme="dark"] :where(input, textarea)::placeholder {
  color: #817d74;
  opacity: 1;
}

html[data-theme="dark"] select option {
  color: var(--m4-dark-text) !important;
  background: #11110f !important;
}

html[data-theme="dark"] :where(hr, table, th, td) {
  border-color: var(--m4-dark-line) !important;
}

html[data-theme="dark"] img {
  color: var(--m4-dark-muted);
}

html[data-theme="dark"] .site-header,
html[data-theme="dark"] .site-header.scrolled,
html[data-theme="dark"] .header,
html[data-theme="dark"] body.theme-white .header,
html[data-theme="dark"] body:not(.landing-light) .header {
  color: #fff !important;
  border-bottom-color: rgba(255, 255, 255, .11) !important;
  background:
    linear-gradient(90deg, rgba(211, 169, 63, .06), transparent 32%),
    rgba(8, 8, 7, .94) !important;
  box-shadow: 0 12px 36px rgba(0, 0, 0, .22) !important;
  backdrop-filter: blur(18px);
}

html[data-theme="dark"] :where(.brand, .brand strong, .header .brand) {
  color: #fff !important;
}

html[data-theme="dark"] :where(.brand small, .footer-brand p) {
  color: #aaa59b !important;
}

html[data-theme="dark"] :where(.nav > a, .menu a, .header .menu a) {
  color: #d6d2c9 !important;
  opacity: 1 !important;
}

html[data-theme="dark"] :where(.nav > a, .menu a):hover,
html[data-theme="dark"] :where(.nav > a, .menu a).active,
html[data-theme="dark"] :where(.nav > a, .menu a)[aria-current="page"] {
  color: #f0d47a !important;
}

html[data-theme="dark"] :where(.mobile-toggle, .menu-toggle) {
  color: #fff !important;
  border-color: rgba(255, 255, 255, .18) !important;
  background: rgba(255, 255, 255, .06) !important;
}

html[data-theme="dark"] body.theme-white .mobile-toggle,
html[data-theme="dark"] body:not(.landing-light) .mobile-toggle {
  color: #fff !important;
  border-color: rgba(255, 255, 255, .18) !important;
  background: rgba(255, 255, 255, .06) !important;
}

html[data-theme="dark"] .header-language select {
  color: #f0d47a !important;
  border-color: rgba(240, 212, 122, .38) !important;
  background: rgba(18, 18, 16, .9) !important;
}

html[data-theme="dark"] .page-hero,
html[data-theme="dark"] body.theme-white .page-hero,
html[data-theme="dark"] body:not(.landing-light) .page-hero {
  color: var(--m4-dark-text) !important;
  border-bottom-color: var(--m4-dark-line) !important;
  background:
    radial-gradient(circle at 85% 12%, rgba(211, 169, 63, .14), transparent 31rem),
    linear-gradient(145deg, #0c0c0a, #15130d) !important;
}

html[data-theme="dark"] :where(
  body.theme-white,
  body.theme-white main,
  body.theme-white section,
  body.theme-white .white-band,
  body.theme-white .dark-band,
  body.theme-white footer,
  body:not(.landing-light) main,
  body:not(.landing-light) section,
  body:not(.landing-light) .white-band,
  body:not(.landing-light) .dark-band,
  body:not(.landing-light) footer
) {
  color: var(--m4-dark-text) !important;
  border-color: var(--m4-dark-line) !important;
  background: var(--m4-dark-bg) !important;
}

html[data-theme="dark"] :where(
  body.theme-white h1,
  body.theme-white h2,
  body.theme-white h3,
  body:not(.landing-light) h1,
  body:not(.landing-light) h2,
  body:not(.landing-light) h3
) {
  color: var(--m4-dark-text) !important;
}

html[data-theme="dark"] :where(
  body.theme-white p,
  body.theme-white .lead,
  body.theme-white .section-head p,
  body.theme-white .faq-answer,
  body.theme-white .scrub-copy p,
  body:not(.landing-light) p,
  body:not(.landing-light) .lead,
  body:not(.landing-light) .section-head p
) {
  color: var(--m4-dark-muted) !important;
}

html[data-theme="dark"] :where(
  .card,
  .panel,
  .newsletter-card,
  .contact-card,
  .faq-item,
  .schedule-card,
  .mini-card,
  .media-panel,
  .feature-panel,
  .legal-box,
  .legal-box-pro,
  .price-card,
  .price-notice,
  .info-card,
  .stat-card,
  .apparel-card,
  .apparel-intro-card,
  .team-soon-panel,
  .hours-visual-card
) {
  color: var(--m4-dark-text) !important;
  border-color: var(--m4-dark-line) !important;
  background: var(--m4-dark-surface) !important;
  box-shadow: var(--m4-dark-shadow) !important;
}

html[data-theme="dark"] :where(.card-body, .card-img, .feature-item) {
  color: var(--m4-dark-text) !important;
  border-color: var(--m4-dark-line) !important;
  background: var(--m4-dark-surface) !important;
}

html[data-theme="dark"] .card-img {
  background: #080807 !important;
}

html[data-theme="dark"] :where(
  .card p,
  .panel p,
  .price-card p,
  .price-notice p,
  .contact-card p,
  .contact-card a,
  .schedule-card p,
  .mini-card p,
  .feature-panel p,
  .legal-box p,
  .legal-box-pro p,
  .legal-box-pro li,
  .team-soon-panel p
) {
  color: var(--m4-dark-muted) !important;
}

html[data-theme="dark"] :where(.price, .price-card h3, .price-notice h2) {
  color: var(--m4-dark-text) !important;
}

html[data-theme="dark"] :where(.plan-tag, .service-tag) {
  color: #e4c86f !important;
  border-color: rgba(240, 212, 122, .22) !important;
  background: rgba(211, 169, 63, .1) !important;
}

html[data-theme="dark"] :where(.field span, .field label) {
  color: #d4d0c7 !important;
}

html[data-theme="dark"] :where(.result, .legal-warning) {
  color: #e9d894 !important;
  border-color: rgba(240, 212, 122, .24) !important;
  background: rgba(211, 169, 63, .1) !important;
}

html[data-theme="dark"] :where(.quick-actions a, .floating-whatsapp, .mobile-actionbar a) {
  color: var(--m4-dark-text) !important;
  border-color: rgba(255, 255, 255, .16) !important;
  background: rgba(17, 17, 15, .96) !important;
  box-shadow: 0 14px 38px rgba(0, 0, 0, .35) !important;
}

html[data-theme="dark"] .qa-icon {
  color: #f0d47a !important;
  border-color: rgba(240, 212, 122, .25) !important;
  background: rgba(211, 169, 63, .1) !important;
}

html[data-theme="dark"] :where(.m4-footer, .site-footer, .footer, footer) {
  color: var(--m4-dark-text) !important;
  border-color: var(--m4-dark-line) !important;
  background: #080807 !important;
}

html[data-theme="dark"] .m4-footer-shell {
  color: var(--m4-dark-text) !important;
  border-color: var(--m4-dark-line) !important;
  background: #080807 !important;
}

html[data-theme="dark"] :where(.m4-footer a, .m4-footer p, .site-footer a, .site-footer p, footer a, footer p) {
  color: #aaa59b !important;
}

html[data-theme="dark"] :where(.disciplines, .pricing, .center, .faq, .contact, .inner-hero, .b2b-home) {
  color: var(--m4-dark-text);
  border-color: var(--m4-dark-line);
  background: var(--m4-dark-bg);
}

html[data-theme="dark"] :where(.quick-paths, .disciplines-v100, .visual-programs, .planner-v100, .method-v100, .contact-v100) {
  color: var(--m4-dark-text);
  border-color: var(--m4-dark-line);
  background: var(--m4-dark-bg) !important;
}

html[data-theme="dark"] .quick-paths a {
  color: var(--m4-dark-text) !important;
  border-color: var(--m4-dark-line) !important;
  background: var(--m4-dark-surface) !important;
}

html[data-theme="dark"] :where(.program-card, .method-v100-card, .planner-panel, .contact-card-v100, .faq-compact, .location-card) {
  color: var(--m4-dark-text) !important;
  border-color: var(--m4-dark-line) !important;
  background: var(--m4-dark-surface) !important;
  box-shadow: var(--m4-dark-shadow) !important;
}

html[data-theme="dark"] :where(.program-card p, .method-v100-card p, .planner-panel p, .contact-card-v100 p, .faq-compact p, .location-card p) {
  color: var(--m4-dark-muted) !important;
}

html[data-theme="dark"] :where(.section-heading > p, .center-copy > p, .center-facts span, .price-value span, .price-card > p, .price-card li, .price-note, .eyebrow.dark) {
  color: var(--m4-dark-muted) !important;
}

html[data-theme="dark"] :where(.center-facts, .other-prices, .detail-grid, .related-links) {
  border-color: var(--m4-dark-line) !important;
}

html[data-theme="dark"] .other-prices {
  background: var(--m4-dark-surface) !important;
}

html[data-theme="dark"] .other-prices div {
  border-color: var(--m4-dark-line) !important;
}

html[data-theme="dark"] :where(.detail-card, .related-links a, .b2b-home-links a) {
  color: var(--m4-dark-text) !important;
  border-color: var(--m4-dark-line) !important;
  background: var(--m4-dark-surface) !important;
  box-shadow: none !important;
}

html[data-theme="dark"] :where(.detail-card p, .b2b-home-copy > p, .b2b-home-links span) {
  color: var(--m4-dark-muted) !important;
}

html[data-theme="dark"] .b2b-page {
  color: var(--m4-dark-text);
  background: var(--m4-dark-bg);
}

html[data-theme="dark"] .b2b-page .b2b-section {
  color: var(--m4-dark-text);
  background: var(--m4-dark-bg);
}

html[data-theme="dark"] .b2b-page .b2b-section.soft {
  border-color: var(--m4-dark-line);
  background: var(--m4-dark-surface-2);
}

html[data-theme="dark"] :where(.b2b-card, .b2b-audience, .b2b-faq, .b2b-cta) {
  color: var(--m4-dark-text);
  border-color: var(--m4-dark-line) !important;
  background: var(--m4-dark-surface) !important;
  box-shadow: none !important;
}

html[data-theme="dark"] :where(.b2b-card p, .b2b-audience p, .b2b-faq p, .b2b-section p) {
  color: var(--m4-dark-muted);
}

html[data-theme="dark"] .b2b-proof {
  border-color: var(--m4-dark-line);
  background: #090908;
}

html[data-theme="dark"] .seo-language-links a {
  color: #d5d1c8;
  border-color: rgba(255, 255, 255, .18);
  background: rgba(255, 255, 255, .04);
}

html[data-theme="dark"] :where(.tripadvisor-dropin, .tourism-products, .tourism-partners, .dropin-overview, .dropin-spanish, .dropin-schedule-section) {
  color: var(--m4-dark-text);
  background: var(--m4-dark-bg) !important;
}

html[data-theme="dark"] :where(.tourism-product, .tourism-partner-card, .dropin-card, .dropin-note) {
  color: var(--m4-dark-text) !important;
  border-color: var(--m4-dark-line) !important;
  background: var(--m4-dark-surface) !important;
  box-shadow: var(--m4-dark-shadow) !important;
}

html[data-theme="dark"] :where(.tourism-product p, .tourism-product li, .tourism-partner-card p, .dropin-card p, .dropin-es-list li) {
  color: var(--m4-dark-muted) !important;
}

html[data-theme="dark"] :where(.tourism-product-details, .dropin-schedule-table, .dropin-schedule-table th, .dropin-schedule-table td) {
  border-color: var(--m4-dark-line) !important;
}

html[data-theme="dark"] :where(.tourism-price-note, .dropin-note) {
  color: #e4d29a !important;
  background: rgba(211, 169, 63, .09) !important;
}

html[data-theme="dark"] .tpv-page {
  --tpv-black: #f4f0e7;
  --tpv-paper: #0b0b0a;
  --tpv-white: #fff;
  --tpv-line: rgba(255, 255, 255, .13);
  --tpv-muted: #b5b0a5;
  color: var(--m4-dark-text);
  background:
    radial-gradient(circle at 8% 4%, rgba(201, 154, 36, .11), transparent 31rem),
    var(--m4-dark-bg) !important;
}

html[data-theme="dark"] :where(.tpv-card, .tpv-plan-switcher a) {
  color: var(--m4-dark-text);
  border-color: var(--m4-dark-line);
  background: var(--m4-dark-surface) !important;
  box-shadow: var(--m4-dark-shadow);
}

html[data-theme="dark"] .tpv-plan-switcher a[aria-current="true"] {
  color: #090908;
  border-color: #f0d47a;
  background: #f0d47a !important;
}

html[data-theme="dark"] :where(.tpv-summary-list li, .tpv-check, .tpv-secure-note, .tpv-result-text, .tpv-form-card > p) {
  color: var(--m4-dark-muted);
}

html[data-theme="dark"] .tpv-secure-note strong {
  color: var(--m4-dark-text);
}

html[data-theme="dark"] .tpv-result-icon {
  color: #f0d47a;
  border-color: rgba(240, 212, 122, .26);
  background: rgba(211, 169, 63, .1);
}

html[data-theme="dark"] .tpv-message-error {
  color: #ffb8b8;
  border-color: rgba(255, 122, 122, .28);
  background: rgba(142, 29, 29, .25);
}

html[data-theme="dark"] .m4-v99 {
  color: var(--m4-dark-text);
  background: var(--m4-dark-bg);
}

html[data-theme="dark"] :where(.v99-error-page, .v99-container) {
  color: var(--m4-dark-text);
}

html[data-theme="dark"] .cookie-box {
  color: var(--m4-dark-text) !important;
  border-color: rgba(255, 255, 255, .15) !important;
  background: var(--m4-dark-surface-2) !important;
  box-shadow: 0 28px 90px rgba(0, 0, 0, .46) !important;
}

html[data-theme="dark"] .cookie-box :where(h2, h3, .cookie-category strong) {
  color: var(--m4-dark-text) !important;
}

html[data-theme="dark"] .cookie-box :where(p, .cookie-category span) {
  color: var(--m4-dark-muted) !important;
}

html[data-theme="dark"] .cookie-category {
  border-color: var(--m4-dark-line);
}

html[data-theme="dark"] .cookie-btn {
  color: var(--m4-dark-text);
  border-color: rgba(255, 255, 255, .16);
  background: var(--m4-dark-surface-3);
}

html[data-theme="dark"] .cookie-btn.primary,
html[data-theme="dark"] .cookie-btn:hover {
  color: #090908;
  border-color: #f0d47a;
  background: #f0d47a;
}

html[data-theme="dark"] .cookie-btn.link {
  color: #f0d47a;
  border-color: rgba(240, 212, 122, .26);
  background: transparent;
}

html[data-theme="dark"] .cookie-slider {
  background: #4a4740;
}

html[data-theme="dark"] .cookie-switch input:checked + .cookie-slider {
  background: #d3a93f;
}

html[data-theme="dark"] body.horarios-compact-page .page-hero,
html[data-theme="dark"] body.tarifas-compact-page .page-hero,
html[data-theme="dark"] body.horarios-compact-page .horarios-calendar-section,
html[data-theme="dark"] body.tarifas-compact-page .tarifas-calendar-section {
  color: var(--m4-dark-text) !important;
  border-color: var(--m4-dark-line) !important;
  background: var(--m4-dark-bg) !important;
}

html[data-theme="dark"] body.horarios-compact-page .page-hero h1,
html[data-theme="dark"] body.tarifas-compact-page .page-hero h1 {
  color: var(--m4-dark-text) !important;
}

html[data-theme="dark"] body.horarios-compact-page .m4-day-card,
html[data-theme="dark"] body.tarifas-compact-page .m4-price-group {
  color: var(--m4-dark-text) !important;
  border-color: var(--m4-dark-line) !important;
  background: linear-gradient(180deg, #151410 0%, #11110f 100%) !important;
  box-shadow: var(--m4-dark-shadow) !important;
}

html[data-theme="dark"] body.horarios-compact-page .m4-day-card h2,
html[data-theme="dark"] body.tarifas-compact-page .m4-price-group h2 {
  color: var(--m4-dark-text) !important;
  border-color: var(--m4-dark-line) !important;
}

html[data-theme="dark"] body.horarios-compact-page .m4-class-row,
html[data-theme="dark"] body.tarifas-compact-page .m4-price-row {
  color: var(--m4-dark-text) !important;
  border-color: rgba(255, 255, 255, .1) !important;
  background: var(--m4-dark-surface-2) !important;
}

html[data-theme="dark"] body.horarios-compact-page .m4-class-row strong,
html[data-theme="dark"] body.tarifas-compact-page .m4-price-row span,
html[data-theme="dark"] body.tarifas-compact-page .m4-price-row strong {
  color: var(--m4-dark-text) !important;
}

html[data-theme="dark"] body.horarios-compact-page .m4-class-row time,
html[data-theme="dark"] body.tarifas-compact-page .m4-price-row small {
  color: #f0d47a !important;
}

html[data-theme="dark"] body.tarifas-compact-page .m4-price-row a {
  color: #090908 !important;
  border: 1px solid rgba(240, 212, 122, .42) !important;
  background: #f0d47a !important;
}

@media (max-width: 860px) {
  html[data-theme="dark"] :where(.nav, .menu, body.theme-white .menu, body:not(.landing-light) .menu) {
    color: var(--m4-dark-text) !important;
    border-color: rgba(255, 255, 255, .13) !important;
    background:
      radial-gradient(circle at 100% 0%, rgba(211, 169, 54, .14), transparent 34%),
      rgba(9, 9, 8, .98) !important;
    box-shadow: 0 24px 70px rgba(0, 0, 0, .5) !important;
  }

  html[data-theme="dark"] :where(.nav a, .menu a) {
    border-bottom-color: rgba(255, 255, 255, .08) !important;
  }

  html[data-theme="dark"] .mobile-actionbar {
    border-top-color: rgba(255, 255, 255, .12) !important;
    background: rgba(8, 8, 7, .94) !important;
    backdrop-filter: blur(18px);
  }
}

@media (max-width: 480px) {
  :root {
    --m4-dark-shadow: 0 16px 42px rgba(0, 0, 0, .28);
  }

  html[data-theme="dark"] :where(.card, .panel, .price-card, .legal-box-pro, .tourism-product, .tourism-partner-card, .tpv-card) {
    box-shadow: var(--m4-dark-shadow) !important;
  }
}
