:root {
      color-scheme: light;
      --black: var(--wp--preset--color--black);
      --navy: var(--wp--preset--color--navy);
      --gold: var(--wp--preset--color--gold);
      --sand: var(--wp--preset--color--sand);
      --teal: var(--wp--preset--color--teal);
      --ivory: var(--wp--preset--color--ivory);
      --bg: var(--wp--preset--color--background);
      --paper: var(--wp--preset--color--paper);
      --ink: var(--wp--preset--color--navy);
      --muted: var(--wp--preset--color--muted);
      --line: var(--wp--preset--color--line);
      --line2: var(--wp--preset--color--line-soft);
      --shadow: var(--wp--custom--shadow--elevated);
      --shadow2: var(--wp--custom--shadow--card);
      --r: var(--wp--custom--radius--medium)
    }

    * {
      box-sizing: border-box
    }

    html {
      scroll-behavior: smooth
    }

    body {
      margin: 0;
      font-family: var(--wp--preset--font-family--primary);
      background: radial-gradient(circle at top left, var(--ivory) 0, var(--bg) 48%, color-mix(in srgb, var(--teal) 18%, var(--bg)) 100%);
      color: var(--ink);
      line-height: 1.5
    }

    a {
      color: inherit
    }

    .page {
      min-height: 100vh;
      display: flex;
      flex-direction: column
    }

    .main {
      flex: 1
    }

    .wrap {
      max-width: 1220px;
      margin: auto;
      padding: 24px 20px 56px
    }

    .site-header {
      position: sticky;
      top: 0;
      z-index: 50;
      background: var(--wp--custom--overlay--paper-90);
      backdrop-filter: blur(14px);
      border-bottom: 1px solid var(--line)
    }

    .bar {
      width: 100%;
      margin: 0;
      padding: 0 20px;
      min-height: 68px;
      display: flex;
      align-items: stretch;
      justify-content: space-between;
      gap: 16px
    }

    .brand {
      text-decoration: none;
      font-weight: 900;
      color: var(--navy);
      letter-spacing: .01em;
      flex: 0 0 auto;
      display: flex;
      flex-direction: column;
      justify-content: center
    }

    .brand span {
      display: block;
      color: var(--muted);
      font-size: 12px;
      font-weight: 600
    }

    .menu-toggle {
      display: none;
      width: 44px;
      height: 40px;
      border: 1px solid var(--line);
      background: var(--wp--preset--color--white);
      border-radius: 12px;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      box-shadow: var(--wp--custom--shadow--subtle);
      align-self: center
    }

    .menu-toggle i,
    .menu-toggle i:before,
    .menu-toggle i:after {
      content: "";
      display: block;
      width: 19px;
      height: 2px;
      background: var(--navy);
      border-radius: 999px;
      transition: .22s cubic-bezier(.22, 1, .36, 1)
    }

    .menu-toggle i:before {
      transform: translateY(-6px)
    }

    .menu-toggle i:after {
      transform: translateY(4px)
    }

    .menu-toggle.open i {
      background: transparent
    }

    .menu-toggle.open i:before {
      transform: rotate(45deg)
    }

    .menu-toggle.open i:after {
      transform: rotate(-45deg) translateY(-2px)
    }

    .nav {
      display: flex;
      align-items: stretch;
      gap: 4px;
      flex: 0 0 auto;
      margin-left: auto
    }

    .nav a {
      position: relative;
      display: flex;
      align-items: center;
      justify-content: center;
      min-width: 0;
      text-align: center;
      text-decoration: none;
      color: var(--ink);
      font-weight: 800;
      font-size: 14px;
      padding: 0 14px;
      border-radius: 0;
      transition: color .28s cubic-bezier(.22, 1, .36, 1), background-color .28s cubic-bezier(.22, 1, .36, 1), transform .28s cubic-bezier(.22, 1, .36, 1)
    }

    .nav a:after {
      content: "";
      position: absolute;
      left: 12px;
      right: 12px;
      bottom: 13px;
      height: 2px;
      background: var(--sand);
      transform: scaleX(0);
      transform-origin: left;
      transition: transform .32s cubic-bezier(.22, 1, .36, 1)
    }

    .nav a:hover,
    .nav a:focus {
      background: var(--navy);
      color: var(--sand);
      transform: translateY(-1px);
      outline: none
    }

    .nav a:hover:after,
    .nav a:focus:after {
      transform: scaleX(1)
    }

    .btn,
    button {
      border: 1px solid var(--line);
      background: var(--wp--preset--color--white);
      color: var(--ink);
      padding: 10px 14px;
      border-radius: 12px;
      text-decoration: none;
      font-weight: 850;
      font-size: 14px;
      cursor: pointer;
      transition: transform .18s ease, box-shadow .18s ease, background .18s ease, border-color .18s ease
    }

    .btn:hover,
    button:hover {
      transform: translateY(-2px);
      box-shadow: var(--shadow2);
      background: var(--wp--preset--color--surface-soft)
    }

    .primary,
    .timeline-list button.active,
    .tab.active {
      background: var(--navy);
      color: var(--ivory);
      border-color: var(--navy)
    }

    .primary:hover {
      background: var(--gold);
      border-color: var(--gold);
      color: var(--wp--preset--color--white)
    }

    .ghost {
      background: var(--wp--custom--overlay--white-14);
      color: var(--wp--preset--color--white);
      border-color: var(--wp--custom--overlay--white-38)
    }

    .ghost:hover {
      background: var(--wp--custom--overlay--white-24);
      color: var(--wp--preset--color--white)
    }

    .eyebrow {
      font-size: 12px;
      text-transform: uppercase;
      letter-spacing: .12em;
      color: var(--gold);
      font-weight: 900
    }

    .muted {
      color: var(--muted)
    }

    .section {
      background: var(--paper);
      border: 1px solid var(--line);
      border-radius: var(--r);
      margin: 24px 0;
      overflow: hidden;
      box-shadow: var(--wp--custom--shadow--floating)
    }

    [data-view] {
      display: none
    }

    [data-view].active-view {
      display: block
    }

    .head {
      padding: 18px 20px;
      background: linear-gradient(180deg, var(--paper), var(--ivory));
      border-bottom: 1px solid var(--line);
      display: flex;
      justify-content: space-between;
      gap: 16px;
      align-items: flex-start
    }

    .head :is(h1, h2) {
      font-size: 22px;
      line-height: 1.15;
      margin: 0 0 5px;
      color: var(--gold)
    }

    .head p {
      margin: 0;
      color: var(--muted)
    }

    .content {
      padding: 20px
    }

    .grid {
      display: grid;
      gap: 16px
    }

    .grid2 {
      grid-template-columns: repeat(2, minmax(0, 1fr))
    }

    .grid3 {
      grid-template-columns: repeat(3, minmax(0, 1fr))
    }

    .hero-carousel {
      position: relative;
      min-height: 470px;
      height: 470px;
      background: var(--navy);
      color: var(--wp--preset--color--white);
      overflow: hidden;
      border-bottom: 1px solid var(--teal);
      touch-action: pan-y
    }

    .hero-track {
      height: 100%;
      display: flex;
      transition: transform .35s ease;
      will-change: transform
    }

    .hero-slide {
      min-width: 100%;
      min-height: 470px;
      height: 470px;
      display: grid;
      grid-template-columns: minmax(0, 1fr) 460px;
      align-items: stretch
    }

    .hero-copy {
      padding: 76px max(28px, calc((100vw - 1220px)/2 + 20px));
      display: flex;
      flex-direction: column;
      justify-content: center;
      gap: 18px;
      background: linear-gradient(135deg, var(--slide-start, var(--black)) 0, var(--navy) 55%, var(--slide-end, var(--teal)) 100%)
    }

    .hero-copy h1,
    .hero-copy h2 {
      font-size: clamp(34px, 5vw, 62px);
      line-height: 1.02;
      margin: 0;
      color: var(--slide-title, var(--sand))
    }

    .hero-copy p {
      font-size: 18px;
      max-width: 720px;
      color: var(--slide-text, var(--wp--preset--color--sand-soft));
      margin: 0
    }

    .hero-visual {
      background: var(--wp--preset--color--navy-dark);
      position: relative;
      overflow: hidden;
      display: grid;
      place-items: center;
      padding: 0;
      height: 100%;
      min-height: 0
    }

    .hero-slide.media-left .hero-visual { order: -1 }
    .hero-slide.media-left { grid-template-columns: 460px minmax(0,1fr) }
    .hero-slide.media-background { grid-template-columns: 1fr; position: relative }
    .hero-slide.media-background .hero-visual { position: absolute; inset: 0; z-index: 0; width: 100%; height: 100%; }
    .hero-slide.media-background .hero-visual img,
    .hero-slide.media-background .hero-visual video { width: 100%; height: 100%; min-height: 100%; object-fit: cover }
    .hero-slide.media-background .hero-copy {
      position: relative;
      z-index: 1;
      background: transparent
    }
    .be-carousel-buttons { width: 100%; flex-wrap: wrap }
    .be-carousel-buttons.is-start { justify-content: flex-start }
    .be-carousel-buttons.is-center { justify-content: center }
    .be-carousel-buttons.is-end { justify-content: flex-end }
    .be-carousel-buttons.is-space-between { justify-content: space-between }
    .be-carousel-buttons.is-space-evenly { justify-content: space-evenly }
    .hero-copy:has(.be-carousel-buttons.is-top),
    .hero-copy:has(.be-carousel-buttons.is-bottom) { position: relative }
    .be-carousel-buttons.is-top,
    .be-carousel-buttons.is-bottom { position: absolute; left: 0; right: 0; padding: 0 max(28px, calc((100vw - 1220px)/2 + 20px)) }
    .be-carousel-buttons.is-top { top: 32px }
    .be-carousel-buttons.is-bottom { bottom: 32px }
    .hero-slide .ghost { background: var(--slide-button-bg, var(--wp--custom--overlay--white-14)); color: var(--slide-button-color, var(--wp--preset--color--white)) }
    .be-carousel-editor-note { padding: 10px 14px; background: #fff4cc; color: #4d3a00; font-weight: 700; border: 1px solid #e3c764 }
    .be-carousel-editor-preview { display: grid; min-height: 420px; height: 420px }

    .hero-visual img,
    .hero-visual video {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
      border-radius: 0
    }

    .media-card img,
    .media-card video,
    .img img,
    .img video,
    .gallery-main img,
    .gallery-main video,
    .thumb img,
    .thumb video {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block
    }

    .hero-controls {
      position: absolute;
      left: 50%;
      right: auto;
      bottom: 24px;
      inset: auto auto 24px 50%;
      transform: translateX(-50%);
      pointer-events: none;
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 38px;
      padding: 0
    }

    .hero-control {
      pointer-events: auto;
      width: 46px;
      height: 46px;
      border-radius: 999px;
      padding: 0;
      color: var(--wp--preset--color--white);
      background: var(--wp--custom--overlay--white-14);
      border-color: var(--wp--custom--overlay--white-38);
      font-size: 0;
      opacity: 0;
      visibility: hidden;
      transform: translateY(4px);
      display: grid;
      place-items: center;
      line-height: 1;
      position: relative
    }

    .hero-carousel:hover .hero-control,
    .hero-carousel:focus-within .hero-control {
      opacity: 1;
      visibility: visible;
      transform: translateY(0)
    }

    .hero-control:before {
      font-size: 22px;
      line-height: 1;
      display: block;
      transform: translateY(-1px)
    }

    .hero-control#heroPrev:before {
      content: "‹"
    }

    .hero-control#heroNext:before {
      content: "›"
    }

    .hero-control:before {
      content: "";
      position: absolute;
      left: 50%;
      top: 50%;
      width: 12px;
      height: 12px;
      display: block;
      border-top: 4px solid currentColor;
      border-right: 4px solid currentColor;
      font-size: 0;
      line-height: 0
    }

    .hero-control#heroPrev:before {
      content: "";
      transform: translate(-35%, -50%) rotate(225deg)
    }

    .hero-control#heroNext:before {
      content: "";
      transform: translate(-65%, -50%) rotate(45deg)
    }

    .hero-control:hover,
    .hero-control:focus {
      background: var(--ivory);
      color: var(--navy);
      border-color: var(--ivory)
    }

    .hero-dots {
      position: static;
      left: auto;
      bottom: auto;
      transform: none;
      display: flex;
      align-items: center;
      gap: 7px;
      pointer-events: auto
    }

    .hero-dot {
      width: 9px;
      height: 9px;
      border-radius: 999px;
      background: var(--sand)
    }

    .hero-dot.active {
      width: 28px;
      background: var(--ivory)
    }

    .home-intro {
      display: grid;
      grid-template-columns: 1.1fr .9fr;
      gap: 18px;
      align-items: stretch
    }

    .intro-card {
      border: 0;
      border-radius: var(--r);
      background: linear-gradient(180deg, var(--wp--preset--color--white), color-mix(in srgb, var(--sand) 18%, var(--ivory)));
      padding: 34px 38px;
      box-shadow: var(--shadow2)
    }

    .intro-card :is(h1, h2) {
      font-size: 32px;
      line-height: 1.08;
      margin: 8px 0 12px;
      color: var(--sand)
    }

    .actions {
      display: flex;
      gap: 10px;
      flex-wrap: wrap
    }

    .intro-card .actions {
      margin: 18px 0 24px
    }

    #home.section {
      border: 0
    }

    #home .media-card {
      border: 0
    }

    #home .eyebrow {
      color: var(--sand)
    }

    #home .primary:hover {
      background: var(--sand);
      border-color: var(--sand);
      color: var(--navy)
    }

    .chips {
      display: flex;
      gap: 8px;
      flex-wrap: wrap;
      margin: 12px 0
    }

    .chip {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-width: 116px;
      min-height: 32px;
      border: 1px solid color-mix(in srgb, var(--gold) 45%, var(--line));
      background: color-mix(in srgb, var(--sand) 23%, var(--paper));
      border-radius: 999px;
      padding: 7px 12px;
      font-size: 12px;
      color: var(--ink);
      font-weight: 800;
      text-align: center
    }

    .home-band {
      display: grid;
      gap: 16px
    }

    .value-section {
      background: linear-gradient(135deg, var(--black) 0%, var(--navy) 58%, var(--teal) 100%);
      color: var(--wp--preset--color--white);
      border: 0;
      border-radius: 0;
      margin-left: calc(50% - 50vw);
      margin-right: calc(50% - 50vw);
      box-shadow: none
    }

    .value-section .content {
      max-width: 1280px;
      margin: auto;
      padding: 72px 48px
    }

    .value-split {
      display: grid;
      grid-template-columns: minmax(0, .85fr) minmax(320px, 1fr);
      gap: 72px;
      align-items: center
    }

    .value-copy h2 {
      font-size: 40px;
      line-height: 1.05;
      margin: 0;
      color: var(--wp--preset--color--white)
    }

    .value-copy h2 span {
      display: block;
      font-size: 86px;
      letter-spacing: 0;
      color: var(--sand)
    }

    .value-copy p {
      max-width: 510px;
      color: var(--wp--preset--color--white)
    }

    .value-section .btn {
      color: var(--wp--preset--color--white);
      background: transparent;
      border-color: var(--wp--custom--overlay--white-72)
    }

    .value-section .btn:hover {
      background: var(--wp--custom--overlay--white-14)
    }

    .value-media-placeholder {
      border: 0;
      border-radius: var(--r);
      background: transparent;
      aspect-ratio: 4 / 3;
      min-height: 0;
      display: grid;
      place-items: center;
      text-align: center;
      color: var(--wp--preset--color--white);
      font-weight: 900;
      padding: 0;
      overflow: hidden
    }

    .value-media-placeholder img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center center;
      display: block
    }

    .offer-section {
      text-align: left;
      background: var(--paper);
      border: 0;
      box-shadow: none
    }

    .offer-section .head {
      justify-content: space-between;
      text-align: left;
      background: transparent;
      border: 0;
      padding: 26px clamp(20px, 4vw, 48px) 6px
    }

    .offer-section .head :is(h1, h2) {
      font-size: 34px;
      color: var(--navy)
    }

    .offer-section .head p {
      color: var(--teal);
      font-weight: 800
    }

    .offer-layout {
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(280px, 380px);
      gap: clamp(28px, 5vw, 64px);
      align-items: center;
      padding: 10px clamp(20px, 4vw, 48px) 48px
    }

    .offer-visual {
      aspect-ratio: 4 / 5;
      min-height: 0;
      display: grid;
      place-items: center;
      gap: 14px;
      overflow: hidden;
      border-radius: var(--r);
      order: 2
    }

    .offer-visual img {
      width: 100%;
      height: 100%;
      display: block;
      object-fit: cover;
      object-position: center center;
      border-radius: inherit
    }

    .offer-grid {
      display: grid;
      order: 1
    }

    .offer-card {
      border: 0;
      border-top: 1px solid var(--line2);
      border-radius: 0;
      background: transparent;
      padding: 22px 0;
      min-height: auto;
      display: grid;
      grid-template-columns: 74px 1fr;
      gap: 24px;
      text-align: left;
      align-items: start
    }

    .offer-card:last-child {
      border-bottom: 1px solid var(--line2)
    }

    .offer-icon {
      width: auto;
      height: auto;
      border-radius: 0;
      background: transparent;
      color: var(--teal);
      display: block;
      font-weight: 900;
      font-size: 13px;
      line-height: 1;
      padding-top: 6px;
      letter-spacing: .08em
    }

    .offer-card h3 {
      margin: 0 0 6px;
      color: var(--navy);
      font-size: 22px;
      line-height: 1.12
    }

    .offer-card p {
      margin: 0;
      max-width: 720px
    }

    .media-card {
      aspect-ratio: 4 / 3;
      min-height: 0;
      border-radius: var(--r);
      border: 1px solid var(--line);
      overflow: hidden;
      background: var(--wp--preset--color--dark)
    }

    .card {
      border: 0;
      border-top: 0;
      border-radius: 0;
      background: transparent;
      overflow: visible;
      display: block;
      padding: 0 0 28px;
      transition: transform .18s ease, border-color .18s ease
    }

    .card:hover {
      transform: translateY(-3px);
      box-shadow: none;
      border-color: transparent
    }

    .img {
      aspect-ratio: 4 / 4.35;
      min-height: 0;
      height: auto;
      background: color-mix(in srgb, var(--teal) 14%, var(--ivory));
      overflow: hidden;
      clip-path: none;
      margin-bottom: 14px
    }

    .card .chips {
      margin-bottom: 14px
    }

    .body {
      padding: 0;
      align-self: auto
    }

    .body h3 {
      margin: 0 0 8px;
      color: var(--navy);
      font-size: 20px;
      line-height: 1.1
    }

    .timeline {
      display: grid;
      grid-template-columns: 230px minmax(0, 1fr);
      gap: 20px;
      align-items: stretch
    }

    .timeline-list {
      border-left: 4px solid var(--teal);
      padding-left: 14px
    }

    .timeline-list button {
      width: 100%;
      text-align: left;
      margin: 0 0 10px
    }

    .panel {
      border: 1px solid var(--line);
      border-radius: 14px;
      background: var(--wp--preset--color--white);
      padding: 18px;
      min-height: 260px
    }

    .panel h3 {
      color: var(--gold);
      margin: 0 0 8px
    }

    .company-principles {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 16px;
      padding: 0 20px 20px
    }

    .principle-card {
      padding: 22px;
      border: 1px solid var(--line);
      border-radius: 14px;
      background: var(--paper);
      box-shadow: var(--shadow2)
    }

    .principle-card h3 {
      margin: 0 0 8px;
      color: var(--gold)
    }

    .company-section {
      border: 0;
      border-radius: 0;
      background: var(--paper);
      box-shadow: none;
      overflow: hidden;
      position: relative
    }

    .elementor-widget-bajas-easy-company-hero .company-section { margin-bottom: 0 }
    .elementor-widget-bajas-easy-company-timeline .company-section { margin: 0 }
    .elementor-widget-bajas-easy-company-values .company-section { margin-top: 0 }

    .company-section .head {
      display: none
    }

    .company-hero {
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(320px, .82fr);
      min-height: 420px;
      background: linear-gradient(135deg, var(--black) 0%, var(--navy) 62%, var(--teal) 100%);
      color: var(--ivory);
      overflow: hidden;
      position: relative;
      clip-path: polygon(0 0, 100% 0, 100% calc(100% - 54px), 0 100%)
    }

    .company-hero-copy {
      padding: clamp(36px, 6vw, 72px);
      display: flex;
      flex-direction: column;
      justify-content: center;
      position: relative
    }

    .company-hero-copy :is(h1, h2) {
      margin: 8px 0 16px;
      font-size: clamp(38px, 5.6vw, 72px);
      line-height: .98;
      color: var(--sand)
    }

    .company-hero-copy p {
      max-width: 650px;
      margin: 0;
      color: var(--wp--preset--color--sand-soft);
      font-size: 18px
    }

    .company-hero-media {
      min-height: 420px;
      overflow: hidden;
      clip-path: polygon(13% 0, 100% 0, 100% 100%, 0 100%)
    }

    .company-hero-media img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block
    }

    .company-hero.company-hero-flat,
    .company-hero.company-hero-flat .company-hero-media {
      clip-path: none
    }

    .company-metrics {
      display: none
    }

    .company-section .timeline {
      grid-template-columns: minmax(230px, 280px) minmax(0, 1fr);
      gap: clamp(34px, 5vw, 72px);
      margin: -1px 0 0;
      padding: calc(clamp(38px, 6vw, 72px) + 34px) clamp(38px, 6vw, 72px) clamp(38px, 6vw, 72px);
      background: var(--paper);
      position: relative
    }

    .company-section .timeline-list {
      border-left: 0;
      padding: 0;
      background: transparent
    }

    .company-section .timeline-list button {
      border: 0;
      border-bottom: 1px solid color-mix(in srgb, var(--teal) 28%, var(--line2));
      border-radius: 0;
      background: transparent;
      box-shadow: none;
      margin: 0;
      padding: 16px 0;
      color: var(--navy)
    }

    .company-section .timeline-list button:hover {
      transform: none;
      background: transparent;
      color: var(--teal);
      box-shadow: none
    }

    .company-section .timeline-list button.active {
      background: transparent;
      border-color: var(--sand);
      color: var(--sand)
    }

    .company-section .panel {
      border: 0;
      border-radius: 0;
      background: transparent;
      min-height: 240px;
      padding: 0
    }

    .company-section .panel h3 {
      color: var(--navy);
      font-size: 34px;
      line-height: 1.05
    }

    .company-section .company-principles {
      grid-template-columns: repeat(3, minmax(0, 1fr));
      padding: calc(clamp(38px, 6vw, 72px) + 36px) clamp(38px, 6vw, 72px) clamp(44px, 6vw, 76px);
      column-gap: clamp(24px, 5vw, 56px);
      row-gap: 22px;
      justify-content: center;
      background: linear-gradient(135deg, var(--black) 0%, var(--navy) 72%, var(--teal) 100%);
      color: var(--ivory);
      clip-path: polygon(0 48px, 100% 0, 100% 100%, 0 100%)
    }

    .company-section .company-principles > .company-principles-heading {
      display: block;
      grid-column: 1 / -1;
      color: var(--sand);
      font-size: clamp(30px, 4vw, 48px);
      font-weight: 900;
      line-height: 1;
      margin-bottom: 6px
    }

    .company-section .principle-card {
      border: 0;
      border-radius: 0;
      background: transparent;
      box-shadow: none;
      padding: 8px 0 4px;
      display: grid;
      grid-template-columns: 1fr;
      gap: 14px;
      align-items: start;
      position: relative
    }

    .company-section .principle-card:not(:last-child):after {
      content: "";
      position: absolute;
      right: calc(clamp(24px, 5vw, 56px) / -2);
      top: 6px;
      bottom: 6px;
      width: 1px;
      background: var(--wp--custom--overlay--white-16)
    }

    .company-section .principle-card .eyebrow {
      width: 56px;
      height: 56px;
      border-radius: 999px;
      border: 0;
      background: var(--sand);
      color: var(--navy);
      display: grid;
      place-items: center;
      font-size: 0;
      letter-spacing: 0;
      margin: 0 0 4px;
      line-height: 1
    }

    .company-section .principle-card .eyebrow img {
      width: 30px;
      height: 30px;
      display: block;
      object-fit: contain;
      filter: brightness(0) saturate(100%) invert(12%) sepia(66%) saturate(1451%) hue-rotate(174deg) brightness(91%) contrast(102%)
    }

    .company-section .principle-card h3 {
      color: var(--sand);
      font-size: 24px;
      line-height: 1.1;
      margin: 0
    }

    .company-section .principle-card .muted,
    .company-section .principle-card p {
      color: var(--wp--preset--color--border-on-dark)
    }

    #catalogo {
      border: 0;
      border-radius: 0;
      background: transparent;
      box-shadow: none;
      overflow: visible;
      margin-top: -24px
    }

    #catalogo .head {
      position: relative;
      background: transparent;
      color: var(--ivory);
      border: 0;
      padding-top: clamp(38px, 5vw, 68px);
      padding-bottom: clamp(38px, 5vw, 68px);
      clip-path: none;
      border-radius: 0;
      margin-left: calc(50% - 50vw);
      margin-right: calc(50% - 50vw);
      padding-left: max(clamp(22px, 5vw, 58px), calc((100vw - 1220px)/2 + 20px));
      padding-right: max(clamp(22px, 5vw, 58px), calc((100vw - 1220px)/2 + 20px));
      z-index: 1
    }

    #catalogo .head:before {
      content: "";
      position: absolute;
      inset: 0;
      background: linear-gradient(135deg, var(--black) 0%, var(--navy) 68%, var(--teal) 100%);
      clip-path: polygon(0 0, 100% 0, 100% calc(100% - 34px), 0 100%);
      z-index: -1
    }

    #catalogo .head:after {
      content: "";
      position: absolute;
      right: 0;
      top: 0;
      width: clamp(150px, 18vw, 260px);
      height: calc(100% + 104px);
      background: var(--sand);
      clip-path: polygon(100% 0, 0 0, 100% 100%);
      z-index: -2
    }

    #catalogo .head>div {
      position: relative;
      z-index: 1
    }

    #catalogo .head :is(h1, h2) {
      color: var(--sand);
      font-size: clamp(34px, 5vw, 58px);
      line-height: 1;
      margin-bottom: 10px
    }

    #catalogo .head p {
      color: var(--wp--preset--color--border-on-dark);
      max-width: 680px
    }

    .catalog {
      display: grid;
      grid-template-columns: minmax(210px, 1fr) minmax(0, 900px) minmax(210px, 1fr);
      gap: 0;
      padding: clamp(24px, 4vw, 44px) 2px 0
    }

    .catalog-results {
      grid-column: 2;
      background: var(--paper);
      border: 1px solid var(--line);
      border-radius: 0;
      width: 100%;
      padding: clamp(18px, 3vw, 30px);
      box-shadow: var(--wp--custom--shadow--floating)
    }

    .filters {
      border: 0;
      border-radius: 0;
      background: transparent;
      padding: 0;
      align-self: start;
      grid-column: 1;
      justify-self: end;
      margin-right: 17px;
      position: sticky;
      top: 88px;
      width: 210px;
      border-top: 3px solid var(--teal);
      display: block;
      border-bottom: 0;
      padding-bottom: 0
    }

    .filter-group {
      padding: 14px 0 0;
      margin-bottom: 0;
      border-bottom: 0
    }

    .filter-group:last-child {
      border: 0;
      margin: 0;
      padding: 14px 0 0
    }

    .filter-group strong {
      display: block;
      margin-bottom: 10px;
      color: var(--navy);
      text-transform: uppercase;
      font-size: 12px;
      letter-spacing: .08em
    }

    label {
      display: block;
      margin: 8px 0;
      font-size: 14px;
      color: var(--ink)
    }

    input,
    select {
      width: 100%;
      border: 1px solid var(--line);
      border-radius: 10px;
      padding: 10px;
      font: inherit;
      background: var(--paper);
      color: var(--ink)
    }

    input[type=checkbox] {
      width: auto;
      margin-right: 7px;
      accent-color: var(--navy)
    }

    .catalog-top {
      display: flex;
      justify-content: space-between;
      gap: 12px;
      margin-bottom: 18px;
      align-items: center;
      color: var(--teal)
    }

    #terrainGrid {
      gap: clamp(18px, 3vw, 30px)
    }

    #terrainGrid .card {
      padding: 12px;
      border-radius: 14px;
      height: 100%;
      display: flex;
      flex-direction: column;
      transition: background .18s ease, transform .18s ease, color .18s ease
    }

    #terrainGrid .body {
      display: flex;
      flex: 1;
      flex-direction: column
    }

    #terrainGrid .card:hover {
      background: color-mix(in srgb, var(--navy) 88%, var(--teal));
      color: var(--wp--preset--color--white)
    }

    #terrainGrid .card:hover h3,
    #terrainGrid .card:hover .muted {
      color: var(--wp--preset--color--white)
    }

    #terrainGrid .chips {
      margin: 10px 0 14px
    }

    #terrainGrid .img {
      border-radius: 14px
    }

    #terrainGrid .chip {
      min-width: 0;
      border-radius: 0;
      background: transparent;
      border-color: color-mix(in srgb, var(--teal) 42%, var(--line));
      color: var(--teal);
      padding: 3px 6px;
      font-size: 11px;
      min-height: 24px
    }

    #terrainGrid .card:hover .chip {
      border-color: var(--wp--custom--overlay--white-72);
      color: var(--wp--preset--color--white)
    }

    .filters button {
      width: 100%;
      border-radius: 0;
      border-color: var(--navy);
      background: var(--navy);
      color: var(--sand)
    }

    .filters button:hover {
      background: var(--teal);
      border-color: var(--teal);
      color: var(--wp--preset--color--white)
    }

    #terrainGrid .primary {
      display: block;
      width: fit-content;
      margin-left: auto;
      margin-top: auto;
      border-radius: 14px;
      background: transparent;
      color: var(--navy);
      border-color: var(--navy)
    }

    #terrainGrid .primary:hover {
      background: var(--sand);
      color: var(--navy);
      border-color: var(--sand)
    }

    #terrainGrid .card:hover .primary {
      background: var(--wp--preset--color--white);
      color: var(--navy);
      border-color: var(--wp--preset--color--white)
    }

    #terrainGrid .card:hover .primary:hover {
      background: var(--sand);
      color: var(--navy);
      border-color: var(--sand)
    }

    /* Catálogo de terrenos */
    #catalogo {
      position: relative;
      isolation: isolate;
      min-height: 860px;
      margin: -24px calc(50% - 50vw) 0;
      padding: 0 max(20px, calc((100vw - 1220px)/2 + 20px)) 56px;
      background: transparent
    }

    body.has-terrain-background {
      background-color: var(--ivory);
      background-image: var(--terrain-page-background);
      background-size: cover;
      background-position: center;
      background-attachment: fixed
    }

    #catalogo .head {
      margin: 0 calc(50% - 50vw);
      padding: clamp(66px, 8vw, 116px) max(20px, calc((100vw - 1220px)/2 + 20px)) clamp(118px, 13vw, 166px);
      background: linear-gradient(90deg, var(--black) 0%, var(--navy) 68%, rgba(0,40,62,.42) calc(50% + 460px), transparent calc(50% + 625px));
      clip-path: polygon(0 0, 100% 0, 100% calc(100% - 44px), 0 100%)
    }

    #catalogo .head:before,
    #catalogo .head:after { display: none }
    #catalogo .head :is(h1, h2) { max-width: none; color: var(--wp--preset--color--white); font-family: Georgia, serif; font-size: clamp(46px, 4.1vw, 68px); line-height: 1; margin: 0 0 24px; white-space: nowrap }
    #catalogo .head :is(h1, h2) span { color: var(--sand) }
    #catalogo .head i { display: block; width: 48px; height: 4px; margin-bottom: 18px; border-radius: 999px; background: var(--sand) }
    #catalogo .head p { max-width: 560px; font-size: 17px; color: var(--wp--preset--color--white) }

    .catalog { display: block; padding: 0; max-width: 1250px; margin: -84px auto 0; position: relative; z-index: 2 }
    .catalog-results { display: grid; grid-template-columns: 274px minmax(0, 1fr); width: 100%; padding: 0; overflow: hidden; border: 1px solid rgba(10,35,53,.12); border-radius: 22px; background: rgba(255,255,255,.96); box-shadow: 0 18px 42px rgba(3,25,40,.18) }
    .filters { position: static; width: auto; margin: 0; padding: 30px 28px; border: 0; border-right: 1px solid var(--line); background: rgba(255,255,255,.78) }
    .filters h3 { margin: 0 0 18px; color: var(--navy); font-size: 20px }
    .filter-group { margin: 0; padding: 22px 0; border-top: 1px solid var(--line) }
    .filter-group:last-of-type { border-bottom: 1px solid var(--line); padding-bottom: 22px }
    .filter-group strong { margin-bottom: 14px; font-size: 13px; color: var(--navy) }
    .filters label { margin: 13px 0; color: #405267; font-size: 14px }
    .filters button { margin-top: 24px; border-radius: 8px; background: var(--navy); color: var(--sand); font-weight: 800 }
    .catalog-main { min-width: 0; padding: 26px 28px 18px }
    .catalog-top { margin-bottom: 20px; color: var(--navy) }
    .catalog-top strong:before { content: none }
    .catalog-top select { width: 180px; padding: 9px 12px; background: var(--wp--preset--color--white) }
    #terrainGrid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px }
    #terrainGrid .card { padding: 10px; border: 1px solid rgba(10,35,53,.10); border-radius: 18px; background: var(--wp--preset--color--white); box-shadow: 0 8px 18px rgba(5,31,47,.08); cursor: pointer }
    #terrainGrid .card:hover, #terrainGrid .card:focus-visible { background: color-mix(in srgb, var(--navy) 88%, var(--teal)); color: var(--wp--preset--color--white); transform: translateY(-3px); outline: 0 }
    #terrainGrid .card:hover h3, #terrainGrid .card:hover .terrain-zone, #terrainGrid .card:hover .terrain-area, #terrainGrid .card:focus-visible h3, #terrainGrid .card:focus-visible .terrain-zone, #terrainGrid .card:focus-visible .terrain-area { color: var(--wp--preset--color--white) }
    #terrainGrid .img { position: relative; aspect-ratio: 1.46 / 1; margin-bottom: 14px; border-radius: 10px }
    #terrainGrid .body { padding: 2px 10px 10px }
    #terrainGrid .body h3 { margin: 0 0 5px; color: var(--navy); font-size: 19px }
    .terrain-zone { margin: 0; color: #526478; font-size: 13px }
    .terrain-divider { height: 1px; margin: 13px 0 12px; background: var(--line); position: relative }
    .terrain-divider i { position: absolute; left: 0; top: -1px; width: 26px; height: 2px; background: var(--sand) }
    .terrain-area { margin: 0; color: var(--navy); font-size: 14px; font-weight: 800 }
    #terrainGrid .chips { margin: 10px 0 0 }
    #terrainGrid .chip { background: color-mix(in srgb, var(--teal) 9%, var(--wp--preset--color--white)); border-radius: 4px }
    #terrainGrid .card:hover .chip, #terrainGrid .card:focus-visible .chip { border-color: var(--wp--custom--overlay--white-72); color: var(--wp--preset--color--white); background: transparent }
    #terrainGrid .primary { display: none }

    @media(max-width:980px) {
      #catalogo { min-height: 0; padding-bottom: 28px }
      #catalogo .head { padding-top: 58px; padding-bottom: 112px }
      .catalog-results { grid-template-columns: 1fr }
      .filters { border-right: 0; border-bottom: 1px solid var(--line) }
      #terrainGrid { grid-template-columns: repeat(2, minmax(0, 1fr)) }
    }

    @media(max-width:640px) {
      #catalogo { padding-right: 14px; padding-left: 14px }
      #catalogo .head { padding-right: 20px; padding-left: 20px }
      #catalogo .head :is(h1, h2) { font-size: 42px; white-space: normal }
      .catalog { margin-top: -62px }
      .catalog-main { padding: 20px 14px 14px }
      .catalog-top { align-items: stretch; flex-direction: column }
      .catalog-top select { width: 100% }
      #terrainGrid { grid-template-columns: 1fr }
    }

    .service {
      display: inline-flex;
      align-items: center;
      gap: 7px;
      border: 1px solid color-mix(in srgb, var(--teal) 35%, var(--line));
      background: color-mix(in srgb, var(--teal) 10%, var(--paper));
      border-radius: 9px;
      padding: 7px 9px;
      font-size: 12px;
      font-weight: 800
    }

    .service i {
      display: block;
      width: 13px;
      height: 13px;
      border-radius: 3px;
      background: var(--teal)
    }

    .terrain-modal {
      position: fixed;
      inset: 0;
      z-index: 100;
      display: none;
      padding: max(92px, clamp(18px, 3vw, 42px)) clamp(18px, 3vw, 42px) clamp(28px, 3vw, 42px);
      background: var(--wp--custom--overlay--navy-58);
      backdrop-filter: blur(8px);
      overflow: auto
    }

    .terrain-modal.open {
      display: grid;
      place-items: center
    }

    .terrain-modal-card {
      width: min(1120px, 100%);
      max-height: min(780px, calc(100dvh - 128px));
      margin: auto;
      overflow: auto;
      scrollbar-gutter: stable;
      scrollbar-width: thin;
      scrollbar-color: var(--teal) transparent;
      border: 1px solid var(--wp--custom--overlay--sand-35);
      border-radius: 18px;
      background: var(--paper);
      box-shadow: var(--wp--custom--shadow--modal)
    }

    .terrain-modal-card::-webkit-scrollbar { width: 12px }
    .terrain-modal-card::-webkit-scrollbar-track { margin: 18px 0; background: transparent }
    .terrain-modal-card::-webkit-scrollbar-thumb { border: 3px solid transparent; border-radius: 999px; background: var(--teal); background-clip: padding-box }

    .terrain-modal-head {
      position: relative;
      display: flex;
      justify-content: space-between;
      gap: 18px;
      align-items: flex-start;
      padding: 22px clamp(20px, 3vw, 30px);
      background: linear-gradient(135deg, var(--black), var(--navy) 72%, var(--teal));
      color: var(--ivory)
    }

    .window-controls {
      position: absolute;
      top: 16px;
      left: 18px;
      display: flex;
      gap: 8px;
      align-items: center
    }

    .window-dot {
      width: 14px;
      height: 14px;
      min-width: 14px;
      min-height: 14px;
      padding: 0;
      border: 0;
      border-radius: 50%;
      display: block;
      box-shadow: inset 0 0 0 1px rgba(0,0,0,.14)
    }

    .window-close { background: #ff5f57 }
    .window-minimize { background: #febc2e }
    .window-expand { background: #28c840 }
    .window-close:hover { background: #e0443e; transform: none; box-shadow: inset 0 0 0 1px rgba(0,0,0,.2) }

    .terrain-modal-head > div:not(.window-controls) { padding-top: 14px }

    .terrain-modal-head h2 {
      color: var(--sand);
      margin: 4px 0 6px;
      font-size: clamp(26px, 4vw, 42px);
      line-height: 1
    }

    .terrain-modal-head p {
      margin: 0;
      color: var(--wp--preset--color--border-on-dark)
    }

    .modal-close {
      flex: 0 0 auto;
      width: 40px;
      height: 40px;
      padding: 0;
      border-radius: 12px;
      border-color: var(--wp--custom--overlay--white-45);
      background: var(--wp--custom--overlay--white-12);
      color: var(--wp--preset--color--white);
      font-size: 24px;
      line-height: 1
    }

    .modal-close:hover {
      background: var(--sand);
      color: var(--navy);
      border-color: var(--sand)
    }

    .detail {
      display: grid;
      grid-template-columns: 1fr 360px;
      gap: clamp(24px, 4vw, 44px);
      padding: clamp(20px, 3vw, 30px)
    }

    .gallery-main {
      height: 330px;
      border: 0;
      border-radius: 14px;
      background: color-mix(in srgb, var(--teal) 14%, var(--ivory));
      overflow: hidden;
      clip-path: none
    }

    .thumbs {
      display: grid;
      grid-template-columns: repeat(5, 1fr);
      gap: 8px;
      margin-top: 8px
    }

    .thumb {
      height: 68px;
      border: 0;
      border-radius: 10px;
      background: color-mix(in srgb, var(--teal) 12%, var(--ivory));
      cursor: pointer;
      overflow: hidden
    }

    .thumb.active {
      outline: 3px solid var(--sand)
    }

    .side {
      border: 1px solid var(--line2);
      border-top: 3px solid var(--teal);
      border-radius: 14px;
      background: color-mix(in srgb, var(--ivory) 72%, var(--paper));
      padding: 18px;
      align-self: start
    }

    .side h3 {
      color: var(--navy);
      margin: 0 0 8px;
      font-size: 28px;
      line-height: 1.05
    }

    .detail-map {
      margin-top: 18px;
      min-height: 210px;
      overflow: hidden;
      border-radius: 12px;
      border: 1px solid var(--line)
    }

    .detail-map iframe {
      display: block;
      width: 100%;
      height: 230px;
      border: 0
    }

    .tabs {
      display: flex;
      gap: 8px;
      flex-wrap: wrap;
      margin: 14px 0
    }

    .map-panel {
      border: 1px solid var(--line);
      border-radius: 14px;
      overflow: hidden;
      background: color-mix(in srgb, var(--teal) 14%, var(--ivory));
      min-height: 320px
    }

    .map-panel iframe {
      width: 100%;
      height: 320px;
      border: 0;
      display: block
    }

    .faq details {
      border-bottom: 1px solid var(--line);
      padding: 12px 0
    }

    .faq summary {
      font-weight: 900;
      cursor: pointer;
      color: var(--gold)
    }

    /* Lo que tenemos para ti */
    .offer-section {
      position: relative;
      max-width: 1220px;
      margin: 24px auto;
      overflow: hidden;
      border: 1px solid color-mix(in srgb, var(--sand) 78%, var(--line));
      border-radius: var(--r);
      background-color: var(--ivory);
      background-image: linear-gradient(90deg, rgba(255,252,247,.95), rgba(255,252,247,.92)), var(--offer-background-image);
      background-position: center;
      background-size: cover;
      box-shadow: 0 20px 38px rgba(5,31,47,.13)
    }
    .offer-section .head { padding: 42px 5% 18px; }
    .offer-section .head :is(h1, h2) { font-size: clamp(32px, 3.4vw, 46px); line-height: 1.05; font-weight: 900 }
    .offer-section .head :is(h1, h2):after { content: ""; display: block; width: min(100%, 520px); height: 2px; margin-top: 18px; background: linear-gradient(90deg, var(--sand), transparent) }
    .offer-section .head p { margin-top: 12px; color: #bd8b29; font-size: 16px }
    .offer-layout { grid-template-columns: minmax(0, 1.35fr) minmax(280px, .72fr); gap: clamp(28px, 5vw, 64px); align-items: center; padding: 10px 5% 42px }
    .offer-grid { gap: 0 }
    .offer-card { grid-template-columns: 124px 1fr; gap: 20px; padding: 20px 0; border-top: 1px solid color-mix(in srgb, var(--sand) 60%, var(--line)); align-items: center }
    .offer-card:last-child { border-bottom: 0 }
    .offer-icon { display: flex; align-items: center; gap: 14px; padding: 0; color: #c08d2d; font-size: 24px }
    .offer-icon:before { content: "✦"; display: grid; width: 64px; height: 64px; place-items: center; border: 1px solid var(--sand); border-radius: 50%; background: rgba(255,255,255,.72); box-shadow: 0 8px 16px rgba(191,140,42,.18); font-size: 25px }
    .offer-icon span { font-weight: 900 }
    .offer-card h3 { font-size: clamp(20px, 1.8vw, 25px); margin-bottom: 6px }
    .offer-card p { font-size: 14px; color: #536174 }
    .offer-visual { aspect-ratio: 4 / 5; border: 1px solid var(--sand); border-radius: 20px; padding: 7px; box-shadow: 0 12px 22px rgba(191,140,42,.22); background: rgba(255,255,255,.76) }
    .offer-visual img { border-radius: 14px }

    /* Preguntas frecuentes */
    .elementor-page-preguntas-frecuentes { padding-bottom: 0 }
    .elementor-page-preguntas-frecuentes + .footer { margin-top: 0 }
    #faq { max-width: none; margin: -24px calc(50% - 50vw) 0; padding-bottom: 28px; border: 0; border-radius: 0; background-color: var(--ivory); background-image: var(--faq-background-image); background-position: right center; background-size: cover; background-attachment: fixed; box-shadow: none }
    #faq .head { padding: clamp(36px, 4vw, 58px) max(22px, calc((100vw - 1220px)/2 + 20px)); background: transparent; border: 0 }
    .faq-kicker { display: block; color: #bd8b29; font-size: 17px; font-weight: 900; letter-spacing: .08em }
    #faq .head :is(h1, h2) { margin: 6px 0 14px; color: var(--navy); font-family: Georgia, serif; font-size: clamp(36px, 4vw, 54px); line-height: 1 }
    #faq .head i, .faq-help > i { display: block; width: 44px; height: 2px; background: var(--sand) }
    #faq .head p { margin-top: 12px; color: #536174; font-size: 16px }
    .faq-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(260px, 320px); gap: 26px; max-width: 1220px; margin: 0 auto; padding: 16px 20px 34px }
    .faq-list, .faq-help { border: 1px solid rgba(10,35,53,.12); border-radius: 18px; background: rgba(255,255,255,.94); box-shadow: 0 12px 26px rgba(5,31,47,.10) }
    .faq-list { overflow: hidden }
    .faq details { margin: 0; padding: 0; border-bottom: 1px solid var(--line) }
    .faq details:last-child { border-bottom: 0 }
    .faq summary { display: flex; align-items: center; gap: 14px; padding: 18px 22px; color: var(--navy); font-family: Georgia, serif; font-size: 17px; list-style: none }
    .faq summary::-webkit-details-marker { display: none }
    .faq summary:before { content: ""; flex: 0 0 12px; width: 12px; height: 12px; border-right: 2px solid #bd8b29; border-bottom: 2px solid #bd8b29; transform: rotate(45deg) translateY(-3px); transition: transform .18s ease }
    .faq details[open] summary:before { transform: rotate(225deg) translate(-3px, 0) }
    .faq details .muted { margin: 0; padding: 0 22px 18px 68px; color: #536174; font-size: 14px }
    .faq-help { padding: 22px; text-align: center }
    .faq-help-icon { display: grid; width: 52px; height: 52px; margin: 0 auto 12px; place-items: center; border-radius: 50%; background: color-mix(in srgb, var(--sand) 15%, white); color: #bd8b29; font-size: 34px }
    .faq-help h3 { margin: 0; color: var(--navy); font-family: Georgia, serif; font-size: 23px; line-height: 1.08 }
    .faq-help > i { margin: 16px auto }
    .faq-help p { color: #536174 }
    .faq-help .primary { width: 100%; margin-top: 8px; background: #bd8b29; color: white; border-color: #bd8b29 }

    .footer {
      background: linear-gradient(135deg, var(--black), var(--navy));
      color: var(--ivory);
      margin-top: 28px
    }

    .footer .inner {
      max-width: none;
      margin: 0;
      padding: 42px 20px;
      display: grid;
      grid-template-columns: minmax(150px, .65fr) minmax(0, 1.15fr) minmax(220px, .85fr);
      gap: 36px
    }

    .footer-brand {
      text-align: left;
      order: 2
    }

    .footer .inner>div:nth-child(2) {
      order: 1
    }

    .footer .inner>div:nth-child(3) {
      order: 3;
      justify-self: end;
      min-width: 260px
    }

    .footer h3,
    .footer h4 {
      margin-top: 0;
      color: var(--sand)
    }

    .footer a {
      display: block;
      color: var(--wp--preset--color--border-on-dark);
      text-decoration: none;
      margin: 7px 0
    }

    .footer p {
      color: var(--wp--preset--color--border-on-dark);
      margin-bottom: 0
    }

    .alliance-logos {
      display: grid;
      grid-template-columns: repeat(2, auto);
      gap: 12px;
      align-items: center;
      justify-content: end
    }

    .alliance-logo {
      width: 150px;
      height: 52px;
      display: grid;
      place-items: center
    }

    .alliance-logo img {
      width: auto;
      max-width: 150px;
      max-height: 52px;
      object-fit: contain
    }

    .foot-bottom {
      border-top: 1px solid var(--teal);
      padding: 14px 20px;
      text-align: center;
      color: var(--sand);
      font-size: 13px
    }

    @media(max-width:1180px) {
      .catalog {
        grid-template-columns: 1fr
      }

      .catalog-results {
        grid-column: auto
      }

      .filters {
        grid-column: auto;
        justify-self: stretch;
        position: static;
        width: auto;
        margin: 0 0 18px
      }
    }

    @media(max-width:980px) {
      .menu-toggle {
        display: flex
      }

      .bar {
        align-items: center;
        padding: 14px 20px;
        min-height: auto
      }

      .brand {
        justify-content: flex-start
      }

      .nav {
        position: absolute;
        left: 16px;
        right: 16px;
        top: 69px;
        width: auto;
        margin-left: 0;
        display: none;
        flex-direction: column;
        align-items: stretch;
        background: var(--wp--custom--overlay--paper-98);
        border: 1px solid var(--line);
        border-radius: 16px;
        padding: 10px;
        box-shadow: var(--shadow)
      }

      .nav.open {
        display: flex
      }

      .nav a {
        padding: 13px 14px
      }

      .nav a:after {
        display: none
      }

      .hero-slide {
        grid-template-columns: 1fr;
        min-height: auto;
        height: auto
      }

      .hero-visual {
        min-height: 0;
        height: 210px;
        order: -1;
        padding: 0
      }

      .hero-slide.media-background { min-height: 470px; height: 470px }
      .hero-slide.media-background .hero-visual { width: 100%; height: 100% }
      .hero-slide.media-background .hero-copy { min-height: 470px }

      .hero-copy {
        padding: 36px 20px 24px
      }

      .hero-carousel {
        min-height: auto;
        height: auto
      }

      .hero-controls {
        position: absolute;
        left: 50%;
        right: auto;
        bottom: 18px;
        transform: translateX(-50%);
        display: flex;
        grid-template-columns: none;
        align-items: center;
        justify-content: center;
        gap: 30px;
        padding: 0;
        background: transparent
      }

      .hero-control {
        width: 42px;
        height: 42px;
        border-radius: 999px;
        padding: 0;
        font-size: 0;
        opacity: 1;
        visibility: visible;
        transform: none;
        display: grid;
        place-items: center;
        line-height: 1;
        position: relative
      }

      .hero-control:before {
        content: "";
        position: absolute;
        left: 50%;
        top: 50%;
        width: 11px;
        height: 11px;
        display: block;
        border-top: 4px solid currentColor;
        border-right: 4px solid currentColor;
        font-size: 0;
        line-height: 0
      }

      .hero-control#heroPrev:before {
        content: "";
        transform: translate(-35%, -50%) rotate(225deg)
      }

      .hero-control#heroNext:before {
        content: "";
        transform: translate(-65%, -50%) rotate(45deg)
      }

      .hero-dots {
        position: static;
        transform: none;
        justify-content: center
      }

      .home-intro,
      .timeline,
      .catalog,
      .detail,
      .footer .inner,
      .company-principles,
      .value-split,
      .offer-layout,
      .grid3,
      .grid2 {
        grid-template-columns: 1fr
      }

      .company-hero {
        grid-template-columns: 1fr
      }

      .company-hero-media {
        min-height: 260px;
        order: -1
      }

      .company-metrics,
      .company-section .company-principles {
        grid-template-columns: 1fr
      }

      .company-section .timeline {
        grid-template-columns: 1fr
      }

      .company-section .timeline-list {
        padding: 18px
      }

      .company-section .principle-card {
        border-right: 0;
        border-bottom: 0;
        grid-template-columns: 56px 1fr;
        gap: 16px
      }

      .company-section .principle-card:not(:last-child):after {
        display: none
      }

      .filters {
        position: static;
        width: auto;
        margin: 0 0 18px;
        flex-direction: column;
        gap: 4px;
        display: block
      }

      .card {
        display: block
      }

      .img {
        clip-path: none
      }

      .catalog-top {
        align-items: flex-start;
        flex-direction: column
      }

      .head {
        flex-direction: column
      }

      .side {
        order: -1
      }

      .value-copy h2 span {
        font-size: 58px
      }

      .offer-visual {
        min-height: 0;
        order: 1
      }

      .offer-grid {
        order: 2
      }

      .offer-card {
        grid-template-columns: 58px 1fr
      }
    }

    @media(max-width:560px) {
      .bar {
        padding: 12px 14px
      }

      .wrap {
        padding: 16px 14px 36px
      }

      .hero-copy h1,
      .hero-copy h2 {
        font-size: 30px
      }

      .hero-copy p {
        font-size: 16px
      }

      .head {
        padding: 16px
      }

      .content {
        padding: 16px
      }

      .timeline-list {
        display: grid;
        grid-template-columns: 1fr;
        border-left: 0;
        padding-left: 0;
        gap: 8px
      }

      .timeline-list button {
        margin: 0
      }

      .thumbs {
        grid-template-columns: repeat(5, minmax(44px, 1fr));
        gap: 6px
      }

      .thumb {
        height: 52px
      }

      .tabs {
        flex-wrap: nowrap;
        overflow-x: auto
      }

      .tab {
        flex: 0 0 auto
      }

      .chip {
        min-width: calc(50% - 4px)
      }

      .offer-card {
        grid-template-columns: 1fr;
        gap: 8px
      }

      .alliance-logos {
        grid-template-columns: 1fr 1fr;
        max-width: 260px
      }
    }

    .elementor-page-content { width: 100%; overflow: visible }

    .ts-guide {
      --ts-ink: var(--navy);
      --ts-sand: var(--ivory);
      --ts-line: color-mix(in srgb, var(--navy) 14%, transparent);
      width: 100%;
      color: var(--ts-ink);
      background: var(--ivory);
      overflow: clip;
    }
    .ts-guide-hero {
      position: relative;
      display: block;
      min-height: 560px;
      background: var(--navy);
      color: var(--ivory);
    }
    .ts-guide-hero-copy {
      position: relative;
      z-index: 1;
      min-height: 560px;
      max-width: 900px;
      display: flex;
      flex-direction: column;
      justify-content: center;
      gap: 18px;
      padding: clamp(44px, 8vw, 104px) clamp(24px, 7vw, 96px);
      background: linear-gradient(90deg, rgba(2,15,24,.92), rgba(2,15,24,.56) 68%, rgba(2,15,24,.12));
    }
    .ts-guide-hero h1 {
      max-width: 860px;
      margin: 0;
      color: var(--sand);
      font-size: clamp(30px, 3.8vw, 47px);
      line-height: .98;
      letter-spacing: -.035em;
    }
    .ts-guide-kicker {
      max-width: 660px;
      margin: 0;
      color: var(--wp--preset--color--border-on-dark);
      font-size: clamp(17px, 1.8vw, 22px);
    }
    .ts-guide-hero-media { position: absolute; inset: 0; min-height: 0; background: var(--navy-dark); }
    .ts-guide-hero-media img { width: 100%; height: 100%; min-height: 0; display: block; object-fit: cover; opacity: .86; }
    .ts-guide-intro {
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(320px, .75fr);
      gap: clamp(28px, 5vw, 72px);
      max-width: 1220px;
      margin: 0 auto;
      padding: clamp(54px, 8vw, 104px) 20px;
    }
    .ts-guide-intro-main { max-width: 760px; font-size: clamp(22px, 2.5vw, 34px); line-height: 1.18; color: var(--navy); }
    .ts-guide-intro-main p { margin: 0 0 18px; }
    .ts-guide-facts { display: grid; gap: 18px; }
    .ts-guide-facts article { padding: 18px 0 18px 20px; border-left: 3px solid var(--teal); }
    .ts-guide-facts strong { display: none; }
    .ts-guide-facts h2 { margin: 7px 0 6px; color: var(--navy); font-size: 20px; }
    .ts-guide-facts p { margin: 0; color: var(--muted); }
    .ts-guide-shell {
      display: block;
      max-width: 920px;
      margin: 0 auto;
      padding: 20px 20px 100px;
    }
    .ts-guide-nav { display: none; }
    .ts-guide-nav-inner { border-top: 3px solid var(--teal); padding-top: 15px; }
    .ts-guide-nav-label { display: block; margin-bottom: 12px; color: var(--muted); font-size: 11px; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
    .ts-guide-nav nav { display: grid; gap: 2px; }
    .ts-guide-nav a { display: grid; grid-template-columns: 30px 1fr; gap: 8px; padding: 9px 8px; color: var(--muted); border-left: 2px solid transparent; font-size: 13px; font-weight: 800; line-height: 1.2; text-decoration: none; transition: color .2s ease, border-color .2s ease, background .2s ease; }
    .ts-guide-nav a span { color: var(--teal); font-variant-numeric: tabular-nums; }
    .ts-guide-nav a:hover, .ts-guide-nav a.active { color: var(--navy); border-left-color: var(--gold); background: color-mix(in srgb, var(--gold) 12%, transparent); }
    .ts-guide-content { min-width: 0; }
    .ts-reading-bar { position: sticky; top: 68px; z-index: 7; display: flex; align-items: center; gap: 14px; margin: 0 -20px 22px; padding: 12px 20px; color: var(--muted); background: color-mix(in srgb, var(--ivory) 92%, transparent); border-bottom: 1px solid var(--line); backdrop-filter: blur(14px); font-size: 12px; }
    .ts-reading-bar strong { overflow: hidden; color: var(--navy); font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
    .ts-reading-bar span:last-child { display: none; }
    .ts-guide-learning { margin-bottom: 42px; padding: 24px 28px; border: 1px solid var(--line); border-top: 4px solid var(--gold); background: var(--paper); }
    .ts-guide-learning p { max-width: 760px; margin: 8px 0 0; font-size: 20px; }
    .ts-hito { display: block; padding: 58px 0; border-top: 1px solid var(--ts-line); scroll-margin-top: 120px; }
    .ts-hito-number { display: none; }
    .ts-hito-body > .eyebrow { display: none; }
    .ts-hito-body h2 { margin: 4px 0 18px; color: var(--navy); font-size: clamp(27px, 3vw, 38px); line-height: 1.06; }
    .ts-hito-body .eyebrow { color: var(--teal); }
    .ts-objective { max-width: 700px; margin: 0 0 24px; padding: 16px 18px; border-left: 3px solid var(--gold); background: color-mix(in srgb, var(--gold) 11%, var(--paper)); }
    .ts-objective strong, .ts-deliverables strong { display: block; margin-bottom: 5px; color: var(--navy); font-size: 12px; letter-spacing: .1em; text-transform: uppercase; }
    .ts-objective p { margin: 0; color: var(--muted); font-size: 17px; }
    .ts-hito-copy { max-width: 760px; color: var(--ink); font-size: 17px; }
    .ts-hito-copy p { margin: 0 0 14px; }
    .ts-deliverables { max-width: 760px; margin-top: 26px; padding-top: 18px; border-top: 1px solid var(--line); }
    .ts-deliverables ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 22px; margin: 0; padding: 0; list-style: none; }
    .ts-deliverables li { position: relative; padding-left: 18px; color: var(--muted); }
    .ts-deliverables li:before { content: "↗"; position: absolute; left: 0; color: var(--teal); font-weight: 900; }

    /* Los widgets de Quiénes somos siguen separados para Elementor, pero
       comparten una base blanca que une visualmente sus espacios. */
    .elementor-page-empresa > .elementor {
      background: var(--wp--preset--color--white);
    }

    /* Composición editorial Todos Santos: tarjetas claras y fotografía
       contenida, inspirada en layouts móviles de lectura visual. */
    .ts-guide {
      background: #eef0ef;
      color: var(--navy);
    }
    .ts-guide-hero {
      display: grid;
      grid-template-columns: minmax(0, 1.05fr) minmax(320px, .95fr);
      gap: 24px;
      min-height: 0;
      padding: clamp(20px, 4vw, 56px);
      background: transparent;
    }
    .ts-guide-hero-copy {
      position: relative;
      z-index: 1;
      min-height: 480px;
      max-width: none;
      justify-content: flex-end;
      padding: clamp(28px, 5vw, 64px);
      border-radius: 32px;
      background: var(--wp--preset--color--white);
      color: var(--navy);
      box-shadow: 0 18px 50px rgba(13, 35, 45, .10);
    }
    .ts-guide-hero-copy .eyebrow { color: var(--teal); }
    .ts-guide-hero h1 {
      max-width: 680px;
      color: var(--navy);
      font-size: clamp(32px, 4.1vw, 58px);
      line-height: 1.02;
    }
    .ts-guide-kicker { color: var(--muted); }
    .ts-guide-hero-media {
      position: relative;
      inset: auto;
      min-height: 480px;
      height: auto;
      overflow: hidden;
      border-radius: 32px;
      background: var(--navy);
      box-shadow: 0 18px 50px rgba(13, 35, 45, .14);
    }
    .ts-guide-hero-media img {
      width: 100%;
      height: 100%;
      min-height: 480px;
      object-fit: cover;
      object-position: center center;
      opacity: 1;
    }
    .ts-guide-intro { padding-top: 24px; }
    .ts-guide-intro-main, .ts-guide-facts article, .ts-guide-learning, .ts-hito {
      background: var(--wp--preset--color--white);
      border-radius: 24px;
    }
    .ts-guide-intro-main { padding: 28px; }
    .ts-guide-facts { gap: 12px; }
    .ts-guide-facts article { padding: 22px; border: 0; }
    .ts-guide-shell { padding-top: 24px; }
    .ts-hito { margin-bottom: 18px; padding: 38px 42px; border: 0; }
    .ts-hito:last-child { margin-bottom: 0; }
    .ts-guide-learning { margin-bottom: 18px; }
    @media (max-width: 820px) {
      .ts-guide-hero { grid-template-columns: 1fr; padding: 14px; }
      .ts-guide-hero-copy { min-height: 390px; border-radius: 24px; }
      .ts-guide-hero-media { min-height: 300px; height: 300px; border-radius: 24px; }
      .ts-guide-hero-media img { min-height: 300px; }
      .ts-hito { padding: 30px 24px; }
    }

    @media (max-width: 820px) {
      .ts-guide-intro { grid-template-columns: 1fr; }
      .ts-guide-hero { min-height: 0; }
      .ts-guide-hero-copy { min-height: 480px; }
      .ts-guide-shell { padding-top: 0; }
      .ts-hito { grid-template-columns: 42px minmax(0, 1fr); gap: 12px; padding: 42px 0; }
      .ts-deliverables ul { grid-template-columns: 1fr; }
    }

    /* Todos Santos: relato comercial inspirado en el boceto entregado. */
    .ts-story {
      width: 100%;
      overflow: hidden;
      color: var(--navy);
      background:
        radial-gradient(circle at 8% 38%, color-mix(in srgb, var(--teal) 9%, transparent), transparent 26%),
        linear-gradient(180deg, var(--wp--preset--color--white), var(--ivory));
    }

    .ts-story-hero {
      display: grid;
      grid-template-columns: minmax(320px, .92fr) minmax(0, 1.08fr);
      min-height: clamp(560px, 72vh, 760px);
      border-bottom: 1px solid var(--line);
    }

    .ts-story-hero-media {
      min-height: 560px;
      overflow: hidden;
      background: var(--navy);
    }

    .ts-story-hero-media img,
    .ts-story-image img {
      width: 100%;
      height: 100%;
      display: block;
      object-fit: cover;
    }

    .ts-story-hero-copy {
      display: flex;
      flex-direction: column;
      justify-content: center;
      padding: clamp(54px, 8vw, 120px);
      background: var(--wp--preset--color--white);
    }

    .ts-story-hero-copy .eyebrow,
    .ts-story-cta .eyebrow {
      margin: 0 0 18px;
      color: var(--teal);
    }

    .ts-story-hero h1 {
      max-width: 780px;
      margin: 0;
      color: var(--navy);
      font-size: clamp(42px, 5.5vw, 78px);
      line-height: .98;
      letter-spacing: -.045em;
    }

    .ts-story-lead {
      max-width: 680px;
      margin-top: 28px;
      color: var(--muted);
      font-size: clamp(18px, 1.6vw, 23px);
      line-height: 1.55;
    }

    .ts-story-lead p,
    .ts-story-copy p { margin: 0; }

    .ts-story-flow {
      display: grid;
      grid-template-columns: repeat(12, minmax(0, 1fr));
      max-width: 1380px;
      margin: 0 auto;
      padding: clamp(80px, 11vw, 160px) clamp(20px, 5vw, 72px);
    }

    .ts-story-copy {
      position: relative;
      z-index: 2;
      align-self: center;
      padding: clamp(28px, 4vw, 56px);
      background: var(--wp--preset--color--white);
      border: 1px solid var(--line);
      box-shadow: 0 24px 60px rgba(2, 31, 43, .10);
    }

    .ts-story-copy h2 {
      max-width: 520px;
      margin: 0 0 18px;
      color: var(--navy);
      font-size: clamp(29px, 3.2vw, 48px);
      line-height: 1.04;
      letter-spacing: -.025em;
    }

    .ts-story-copy p {
      max-width: 580px;
      color: var(--muted);
      font-size: clamp(16px, 1.35vw, 19px);
      line-height: 1.7;
    }

    .ts-story-number {
      display: block;
      margin-bottom: 24px;
      color: var(--gold);
      font-size: 13px;
      font-weight: 900;
      letter-spacing: .18em;
    }

    .ts-story-copy-one { grid-column: 1 / span 6; grid-row: 1; }
    .ts-story-image-one { grid-column: 6 / -1; grid-row: 1; margin: 84px 0 0; }
    .ts-story-image-two { grid-column: 1 / span 7; grid-row: 2; margin: -18px 0 0; }
    .ts-story-copy-two { grid-column: 7 / -1; grid-row: 2; margin-top: 150px; }
    .ts-story-copy-three { grid-column: 2 / span 6; grid-row: 3; margin-top: -18px; }

    .ts-story-image {
      height: clamp(330px, 39vw, 540px);
      overflow: hidden;
      background: var(--teal);
      box-shadow: 0 30px 70px rgba(2, 31, 43, .16);
    }

    .ts-story-image-one {
      border-radius: 52% 0 0 52% / 50% 0 0 50%;
    }

    .ts-story-image-two {
      border-radius: 0 52% 52% 0 / 0 50% 50% 0;
    }

    .ts-story-cta {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 42px;
      padding: clamp(58px, 8vw, 100px) clamp(24px, 8vw, 120px);
      color: var(--ivory);
      background: linear-gradient(125deg, var(--navy-dark), var(--navy) 68%, var(--teal));
    }

    .ts-story-cta > div { max-width: 760px; }
    .ts-story-cta h2 { margin: 0 0 14px; color: var(--sand); font-size: clamp(32px, 4vw, 56px); line-height: 1; }
    .ts-story-cta p:not(.eyebrow) { margin: 0; color: var(--wp--preset--color--border-on-dark); font-size: 18px; }
    .ts-story-cta .btn { flex: 0 0 auto; }

    @media (max-width: 900px) {
      .ts-story-hero { grid-template-columns: 1fr; }
      .ts-story-hero-media { min-height: 360px; height: 52vw; }
      .ts-story-hero-copy { padding: 50px 24px 64px; }
      .ts-story-flow { display: flex; flex-direction: column; gap: 0; padding: 72px 18px; }
      .ts-story-copy,
      .ts-story-image { width: 100%; margin: 0; }
      .ts-story-copy { padding: 32px 24px; }
      .ts-story-image { height: min(78vw, 430px); }
      .ts-story-image-one { border-radius: 0 0 0 48%; order: 2; }
      .ts-story-copy-one { order: 1; }
      .ts-story-image-two { border-radius: 0 48% 0 0; order: 3; margin-top: 44px; }
      .ts-story-copy-two { order: 4; }
      .ts-story-copy-three { order: 5; margin: 44px 0 0; }
      .ts-story-cta { align-items: flex-start; flex-direction: column; }
    }

    @media (max-width: 560px) {
      .ts-story-hero h1 { font-size: 40px; }
      .ts-story-hero-media { min-height: 300px; }
      .ts-story-cta { padding: 52px 22px; }
      .ts-story-cta .btn { width: 100%; text-align: center; }
    }

    @media (max-width: 900px) {
      .offer-layout, .faq-layout { grid-template-columns: 1fr; }
      .offer-section .head, .offer-layout { padding-right: 28px; padding-left: 28px }
      .offer-visual { width: min(460px, 100%); margin: auto; order: 2 }
      .offer-grid { order: 1 }
      .faq-layout { padding: 16px 20px 32px }
    }

    @media (max-width: 560px) {
      .offer-section { margin: 24px 0; border-radius: 20px }
      .offer-section .head { padding-top: 42px }
      .offer-section .head :is(h1, h2) { font-size: 38px }
      .offer-card { grid-template-columns: 88px 1fr; gap: 16px; padding: 22px 0 }
      .offer-icon { font-size: 24px; gap: 10px }
      .offer-icon:before { width: 58px; height: 58px; font-size: 22px }
      .offer-card h3 { font-size: 21px }
      #faq .head :is(h1, h2) { font-size: 42px }
      .faq-layout { padding-right: 14px; padding-left: 14px }
      .faq summary { padding: 18px; gap: 12px; font-size: 17px }
      .faq details .muted { padding: 0 18px 18px 62px }
    }