:root {
      --bg: #05070c;
      --surface: #0c1019;
      --surface2: #121827;
      --surface3: #182136;
      --blue: #265dff;
      --blue2: #1543d8;
      --red: #ff3047;
      --white: #f7f9ff;
      --muted: #9ba7bd;
      --line: #25304a;
      --green: #2fd38a;
      --amber: #ffb74a;
      --radius: 20px;
      --shadow: 0 24px 80px rgba(0,0,0,.38);
    }

    * {
      box-sizing: border-box;
    }

    html {
      scroll-behavior: smooth;
    }

    body {
      margin: 0;
      background: var(--bg);
      color: var(--white);
      font-family: Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
      font-size: 16px;
      line-height: 1.5;
      overflow-x: hidden;
    }

    button,input,select,textarea {
      font: inherit;
    }

    button,a {
      touch-action: manipulation;
    }

    button {
      cursor: pointer;
    }

    a {
      color: inherit;
    }

    .hidden {
      display: none !important;
    }

    .shell {
      min-height: 100vh;
      background:
        radial-gradient(
          circle at 86% 9%,
          rgba(38,93,255,.18),
          transparent 26rem
        ),
        radial-gradient(
          circle at 12% 40%,
          rgba(255,48,71,.08),
          transparent 25rem
        ),
        var(--bg);
    }

    .nav {
      height: 76px;
      position: sticky;
      top: 0;
      z-index: 90;
      display: flex;
      align-items: center;
      gap: 24px;
      padding: 0 max(24px,calc((100vw - 1280px)/2));
      background: rgba(5,7,12,.84);
      border-bottom: 1px solid rgba(255,255,255,.08);
      backdrop-filter: blur(18px);
    }

    .brand {
      display: flex;
      align-items: center;
      gap: 12px;
      text-decoration: none;
      font-weight: 950;
      letter-spacing: .09em;
    }

    .brand-mark {
      width: 39px;
      height: 39px;
      border-radius: 12px;
      background: linear-gradient(145deg,var(--blue),#1238ad);
      position: relative;
      box-shadow: 0 10px 28px rgba(38,93,255,.3);
    }

    .brand-mark:before {
      content: "";
      position: absolute;
      inset: 9px 8px;
      border: 3px solid white;
      border-left-color: transparent;
      border-radius: 50%;
      transform: rotate(-28deg);
    }

    .brand-mark:after {
      content: "";
      position: absolute;
      width: 7px;
      height: 7px;
      right: 4px;
      top: 5px;
      background: var(--red);
      border-radius: 50%;
    }

    .brand small {
      display: block;
      color: var(--muted);
      font-size: .62rem;
      font-weight: 750;
      letter-spacing: .14em;
    }

    .nav-links {
      display: flex;
      align-items: center;
      gap: 6px;
      margin-left: auto;
    }

    .nav-links a {
      padding: 9px 12px;
      text-decoration: none;
      color: #c9d2e3;
      font-size: .88rem;
      font-weight: 700;
      border-radius: 10px;
    }

    .nav-links a:hover {
      background: rgba(255,255,255,.06);
      color: white;
    }

    .nav-actions {
      display: flex;
      gap: 8px;
    }

    .btn {
      border: 1px solid var(--line);
      background: var(--surface2);
      color: var(--white);
      padding: 11px 16px;
      border-radius: 12px;
      font-weight: 800;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      text-decoration: none;
      transition: .18s;
    }

    .btn:hover {
      transform: translateY(-1px);
      border-color: #40527a;
    }

    .btn.primary {
      background: var(--blue);
      border-color: var(--blue);
      box-shadow: 0 10px 28px rgba(38,93,255,.24);
    }

    .btn.primary:hover {
      background: #3267ff;
    }

    .btn.red {
      background: var(--red);
      border-color: var(--red);
    }

    .btn.ghost {
      background: transparent;
    }

    .btn.small {
      padding: 8px 11px;
      font-size: .84rem;
    }

    .btn:disabled {
      opacity: .42;
      cursor: not-allowed;
      transform: none;
    }

    .hero {
      max-width: 1280px;
      margin: auto;
      min-height: calc(100vh - 76px);
      display: grid;
      grid-template-columns: 1.04fr .96fr;
      gap: 55px;
      align-items: center;
      padding: 80px 24px;
    }

    .eyebrow {
      text-transform: uppercase;
      letter-spacing: .18em;
      font-weight: 900;
      font-size: .74rem;
      color: #86a5ff;
    }

    .hero h1 {
      font-size: clamp(3.4rem,8vw,7.8rem);
      line-height: .83;
      letter-spacing: -.075em;
      margin: 22px 0 24px;
    }

    .hero h1 span {
      display: block;
      color: transparent;
      -webkit-text-stroke: 1.5px rgba(255,255,255,.6);
    }

    .hero h2 {
      font-size: clamp(1.45rem,2.7vw,2.5rem);
      line-height: 1.12;
      margin: 0 0 22px;
      max-width: 730px;
    }

    .hero p {
      color: #b8c2d6;
      max-width: 650px;
      font-size: 1.1rem;
    }

    .hero-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
      margin-top: 32px;
    }

    .hero-proof {
      display: flex;
      gap: 24px;
      margin-top: 42px;
    }

    .hero-proof b {
      display: block;
      font-size: 1.4rem;
    }

    .hero-proof span {
      color: var(--muted);
      font-size: .78rem;
    }

    .hero-art {
      min-height: 570px;
      position: relative;
      isolation: isolate;
    }

    .curve-card {
      position: absolute;
      inset: 30px 5px 30px 28px;
      border-radius: 34px;
      background: linear-gradient(
        145deg,
        rgba(18,24,39,.94),
        rgba(7,10,18,.94)
      );
      border: 1px solid #2a3654;
      box-shadow: var(--shadow);
      overflow: hidden;
    }

    .curve-card:before {
      content: "";
      position: absolute;
      inset: 0;
      background-image:
        linear-gradient(
          rgba(255,255,255,.035) 1px,
          transparent 1px
        ),
        linear-gradient(
          90deg,
          rgba(255,255,255,.035) 1px,
          transparent 1px
        );
      background-size: 38px 38px;
      mask-image: linear-gradient(to bottom,#000,transparent);
    }

    .curve-svg {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
    }

    .float-card {
      position: absolute;
      z-index: 4;
      background: rgba(14,19,31,.9);
      border: 1px solid #32405f;
      border-radius: 18px;
      box-shadow: 0 18px 44px rgba(0,0,0,.35);
      backdrop-filter: blur(12px);
      padding: 16px;
    }

    .float-card b {
      display: block;
    }

    .float-card small {
      color: var(--muted);
    }

    .fc1 {
      left: -8px;
      top: 74px;
    }

    .fc2 {
      right: -6px;
      bottom: 84px;
    }

    .fc3 {
      left: 66px;
      bottom: 7px;
    }

    .pulse {
      display: inline-block;
      width: 9px;
      height: 9px;
      border-radius: 50%;
      background: var(--green);
      box-shadow: 0 0 0 6px rgba(47,211,138,.12);
      margin-right: 8px;
    }

    .section {
      max-width: 1280px;
      margin: auto;
      padding: 96px 24px;
    }

    .section-head {
      display: grid;
      grid-template-columns: .62fr 1.38fr;
      gap: 30px;
      margin-bottom: 44px;
    }

    .section-head h2 {
      font-size: clamp(2.3rem,5vw,4.5rem);
      letter-spacing: -.055em;
      line-height: .95;
      margin: 8px 0;
    }

    .section-head p {
      color: var(--muted);
      font-size: 1.05rem;
      max-width: 690px;
      margin: 12px 0 0;
    }

    .index {
      font-size: .75rem;
      color: #7496ff;
      font-weight: 900;
      letter-spacing: .15em;
    }

    .service-grid {
      display: grid;
      grid-template-columns: repeat(4,1fr);
      gap: 14px;
    }

    .service {
      min-height: 255px;
      background: linear-gradient(150deg,var(--surface2),#0a0e17);
      border: 1px solid var(--line);
      border-radius: 22px;
      padding: 24px;
      position: relative;
      overflow: hidden;
    }

    .service:after {
      content: "";
      width: 92px;
      height: 92px;
      border: 1px solid rgba(38,93,255,.45);
      border-radius: 50%;
      position: absolute;
      right: -34px;
      bottom: -35px;
    }

    .service:nth-child(2):after,
    .service:nth-child(4):after {
      border-color: rgba(255,48,71,.5);
    }

    .service-num {
      color: #6f8fe9;
      font-size: .75rem;
      font-weight: 900;
    }

    .service h3 {
      font-size: 1.25rem;
      margin: 70px 0 8px;
    }

    .service p {
      color: var(--muted);
      font-size: .9rem;
      margin: 0;
    }

    .process {
      display: grid;
      grid-template-columns: repeat(4,1fr);
      border-top: 1px solid var(--line);
      border-bottom: 1px solid var(--line);
    }

    .step {
      padding: 32px 24px;
      border-right: 1px solid var(--line);
    }

    .step:last-child {
      border: 0;
    }

    .step b {
      color: var(--red);
      font-size: .78rem;
    }

    .step h3 {
      margin: 28px 0 8px;
    }

    .step p {
      color: var(--muted);
      font-size: .9rem;
    }

    .labs-wrap {
      background: linear-gradient(
        180deg,
        transparent,
        rgba(38,93,255,.06),
        transparent
      );
    }

    .labs-toolbar {
      display: flex;
      gap: 9px;
      flex-wrap: wrap;
      margin-bottom: 24px;
    }

    .filter {
      border: 1px solid var(--line);
      background: var(--surface);
      color: #b9c4d8;
      border-radius: 999px;
      padding: 9px 14px;
      font-weight: 800;
    }

    .filter.active {
      background: var(--blue);
      border-color: var(--blue);
      color: white;
    }

    .tools-grid {
      display: grid;
      grid-template-columns: repeat(3,1fr);
      gap: 14px;
    }

    .tool-card {
      background: rgba(14,19,31,.85);
      border: 1px solid var(--line);
      border-radius: 22px;
      padding: 21px;
      min-height: 235px;
      display: flex;
      flex-direction: column;
      transition: .2s;
      position: relative;
      overflow: hidden;
    }

    .tool-card:hover {
      transform: translateY(-4px);
      border-color: #3d527f;
      box-shadow: 0 18px 50px rgba(0,0,0,.24);
    }

    .tool-card:before {
      content: "";
      position: absolute;
      inset: auto -40px -55px auto;
      width: 130px;
      height: 130px;
      border-radius: 50%;
      background: radial-gradient(
        circle,
        rgba(38,93,255,.18),
        transparent 65%
      );
    }

    .tool-top {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
    }

    .tool-icon {
      width: 44px;
      height: 44px;
      border-radius: 13px;
      background: #172342;
      border: 1px solid #294378;
      display: grid;
      place-items: center;
      font-size: 1.3rem;
    }

    .status {
      font-size: .68rem;
      font-weight: 900;
      letter-spacing: .08em;
      text-transform: uppercase;
      color: #9fb5ed;
      background: #17213a;
      border-radius: 99px;
      padding: 6px 9px;
    }

    .tool-card h3 {
      margin: 24px 0 7px;
      font-size: 1.16rem;
    }

    .tool-card p {
      margin: 0 0 22px;
      color: var(--muted);
      font-size: .88rem;
    }

    .tool-card .btn {
      margin-top: auto;
      align-self: flex-start;
    }

    .lock {
      font-size: .78rem;
      color: #8190a8;
      margin-left: 8px;
    }

    .cta {
      margin: 20px auto 96px;
      max-width: 1232px;
      border-radius: 30px;
      background: linear-gradient(
        125deg,
        #1e55f0,
        #0f2e89 58%,
        #22070d
      );
      padding: 50px;
      display: grid;
      grid-template-columns: 1fr auto;
      align-items: center;
      gap: 30px;
      box-shadow: 0 25px 90px rgba(18,67,216,.28);
    }

    .cta h2 {
      font-size: clamp(2rem,4vw,3.8rem);
      letter-spacing: -.05em;
      line-height: 1;
      margin: 0 0 12px;
    }

    .cta p {
      margin: 0;
      color: #d9e4ff;
    }

    .footer {
      border-top: 1px solid var(--line);
      padding: 30px 24px;
      color: #8997af;
    }

    .footer-inner {
      max-width: 1280px;
      margin: auto;
      display: flex;
      justify-content: space-between;
      gap: 20px;
    }
        .wa {
      position: fixed;
      right: 22px;
      bottom: 22px;
      z-index: 120;
      background: #25d366;
      color: #06150c;
      text-decoration: none;
      border-radius: 999px;
      padding: 14px 18px;
      font-weight: 900;
      box-shadow: 0 16px 45px rgba(37, 211, 102, .3);
      display: flex;
      align-items: center;
      gap: 9px;
    }

    .wa-dot {
      width: 22px;
      height: 22px;
      border: 2px solid currentColor;
      border-radius: 50%;
      display: grid;
      place-items: center;
      font-size: .7rem;
    }

    dialog {
      padding: 0;
      border: 0;
      border-radius: 22px;
      background: var(--surface);
      color: var(--white);
      box-shadow: var(--shadow);
      max-width: calc(100vw - 28px);
    }

    dialog::backdrop {
      background: rgba(0, 0, 0, .72);
      backdrop-filter: blur(8px);
    }

    .dialog {
      width: 480px;
    }

    .dialog-head {
      padding: 20px 22px;
      border-bottom: 1px solid var(--line);
      display: flex;
      justify-content: space-between;
      align-items: center;
    }

    .dialog-head h3 {
      margin: 0;
    }

    .x {
      border: 0;
      background: transparent;
      color: #aab5c8;
      font-size: 1.5rem;
    }

    .dialog-body {
      padding: 22px;
    }

    .field {
      display: flex;
      flex-direction: column;
      gap: 7px;
      margin-bottom: 14px;
    }

    .field label {
      font-size: .78rem;
      color: #aeb9cd;
      font-weight: 800;
    }

    .input,
    input[type=text],
    input[type=number],
    input[type=url],
    input[type=date],
    input[type=color],
    input[type=file],
    select,
    textarea {
      width: 100%;
      background: #090d16;
      color: white;
      border: 1px solid #303c58;
      border-radius: 11px;
      padding: 11px 12px;
      outline: none;
    }

    .input:focus,
    input:focus,
    select:focus,
    textarea:focus {
      border-color: #5a81ff;
      box-shadow: 0 0 0 3px rgba(38, 93, 255, .18);
    }

    textarea {
      min-height: 105px;
      resize: vertical;
    }

    .notice {
      padding: 12px 14px;
      border-radius: 12px;
      background: #111a2e;
      border: 1px solid #273b67;
      color: #bfd0f4;
      font-size: .85rem;
    }

    .error {
      color: #ff8997;
      font-size: .85rem;
      min-height: 20px;
    }

    .session-pill {
      display: none;
      font-size: .78rem;
      color: #cce0ff;
      background: #142447;
      border: 1px solid #284b92;
      border-radius: 999px;
      padding: 7px 10px;
    }

    .session-pill.show {
      display: inline-flex;
    }

    .workspace {
      position: fixed;
      inset: 0;
      background: var(--bg);
      z-index: 100;
      display: none;
      grid-template-rows: 68px 1fr;
    }

    .workspace.open {
      display: grid;
    }

    .workbar {
      display: flex;
      align-items: center;
      gap: 13px;
      padding: 0 16px;
      border-bottom: 1px solid var(--line);
      background: #080b12;
    }

    .workbar h2 {
      font-size: 1rem;
      margin: 0;
    }

    .workbar small {
      display: block;
      color: var(--muted);
      font-weight: 500;
    }

    .workbar .spacer {
      flex: 1;
    }

    .tool-frame,
    .native-tool {
      width: 100%;
      height: 100%;
      border: 0;
      background: #0b0e15;
    }

    .tool-stage {
      position: relative;
      min-height: 0;
      overflow: auto;
    }

    .tool-frame.locked {
      pointer-events: none;
      filter: saturate(.72) brightness(.62);
    }

    .tool-gate {
      position: absolute;
      z-index: 10;
      inset: 0;
      display: grid;
      place-items: center;
      padding: 20px;
      background: rgba(4, 6, 10, .35);
      backdrop-filter: blur(2px);
    }

    .tool-gate.hidden {
      display: none !important;
    }

    .gate-card {
      width: min(470px, 100%);
      background: rgba(11, 15, 24, .96);
      border: 1px solid #33415f;
      border-radius: 22px;
      padding: 24px;
      box-shadow: var(--shadow);
    }

    .gate-card h3 {
      margin: 0 0 8px;
    }

    .gate-card p {
      color: var(--muted);
      font-size: .9rem;
    }

    .gate-actions {
      display: grid;
      grid-template-columns: 1fr auto;
      gap: 8px;
    }

    .gate-actions input {
      min-width: 0;
    }

    .native-tool {
      padding: 24px;
      overflow: auto;
    }

    .tool-layout {
      max-width: 1200px;
      margin: auto;
      display: grid;
      grid-template-columns: 370px minmax(0, 1fr);
      gap: 16px;
    }

    .panel {
      background: var(--surface);
      border: 1px solid var(--line);
      border-radius: 18px;
      overflow: hidden;
    }

    .panel-head {
      padding: 16px 18px;
      border-bottom: 1px solid var(--line);
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 10px;
    }

    .panel-head h3 {
      font-size: .96rem;
      margin: 0;
    }

    .panel-body {
      padding: 18px;
    }

    .form-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 11px;
    }

    .field.full {
      grid-column: 1 / -1;
    }

    .results {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 10px;
    }

    .result {
      background: #0b101b;
      border: 1px solid #26324a;
      border-radius: 14px;
      padding: 15px;
    }

    .result small {
      display: block;
      color: var(--muted);
      font-size: .72rem;
    }

    .result b {
      font-size: 1.35rem;
      color: #dfe7ff;
    }

    .result.hero-result {
      grid-column: 1 / -1;
      background: linear-gradient(135deg, #173a9e, #0c1d50);
    }

    .result.hero-result b {
      font-size: 2rem;
    }

    .tool-actions {
      display: flex;
      gap: 8px;
      flex-wrap: wrap;
      margin-top: 14px;
    }

    .preview-canvas {
      display: block;
      max-width: 100%;
      margin: auto;
      background-color: #ddd;
      background-image:
        linear-gradient(45deg, #bbb 25%, transparent 25%),
        linear-gradient(-45deg, #bbb 25%, transparent 25%),
        linear-gradient(45deg, transparent 75%, #bbb  75%),
        linear-gradient(-45deg, transparent 75%, #bbb 75%);
      background-size: 20px 20px;
      background-position: 0 0, 0 10px, 10px -10px, -10px 0;
      border-radius: 12px;
    }

    .native-tool[aria-disabled=true] {
      pointer-events: none;
      filter: saturate(.72) brightness(.68);
    }

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

    .swatch {
      aspect-ratio: 1;
      border-radius: 12px;
      border: 1px solid #ffffff25;
      position: relative;
    }

    .swatch span {
      position: absolute;
      inset: auto 4px 4px;
      background: #0009;
      color: #fff;
      border-radius: 6px;
      padding: 3px;
      font-size: .62rem;
      text-align: center;
    }

    .catalog {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
      gap: 12px;
    }

    .catalog-card {
      background: #0b101b;
      border: 1px solid var(--line);
      border-radius: 15px;
      padding: 14px;
    }

    .catalog-card img {
      width: 100%;
      height: 145px;
      object-fit: cover;
      border-radius: 10px;
      background: #161c2a;
    }

    .catalog-card h4 {
      margin: 11px 0 5px;
    }

    .catalog-card p {
      color: var(--muted);
      font-size: .8rem;
    }

    .output {
      white-space: pre-wrap;
      background: #090d16;
      border: 1px solid #26334e;
      border-radius: 13px;
      padding: 15px;
      min-height: 160px;
      color: #dbe5f8;
    }

    .chat {
      display: flex;
      flex-direction: column;
      gap: 10px;
      min-height: 330px;
      max-height: 520px;
      overflow: auto;
      padding: 5px;
    }

    .bubble {
      max-width: 83%;
      padding: 12px 14px;
      border-radius: 15px;
      background: #18223a;
    }

    .bubble.user {
      align-self: flex-end;
      background: #1f55e0;
    }

    .bubble small {
      display: block;
      color: #aebbd2;
      margin-top: 5px;
    }

    @media (max-width: 980px) {
      .hero {
        grid-template-columns: 1fr;
        padding-top: 60px;
      }

      .hero-art {
        min-height: 460px;
      }

      .service-grid,
      .tools-grid {
        grid-template-columns: repeat(2, 1fr);
      }

      .section-head {
        grid-template-columns: 1fr;
      }

      .process {
        grid-template-columns: 1fr 1fr;
      }

      .step:nth-child(2) {
        border-right: 0;
      }

      .step:nth-child(-n+2) {
        border-bottom: 1px solid var(--line);
      }

      .tool-layout {
        grid-template-columns: 1fr;
      }

      .nav-links {
        display: none;
      }

      .nav {
        padding: 0 16px;
      }

      .cta {
        margin-inline: 20px;
      }

      .native-tool {
        padding: 14px;
      }
    }

    @media (max-width: 620px) {
      .hero {
        padding: 44px 18px;
      }

      .hero h1 {
        font-size: 4rem;
      }

      .hero-art {
        min-height: 400px;
      }

      .fc1 {
        left: 4px;
      }

      .fc2 {
        right: 4px;
      }

      .fc3 {
        left: 28px;
      }

      .section {
        padding: 70px 18px;
      }

      .service-grid,
      .tools-grid,
      .process {
        grid-template-columns: 1fr;
      }

      .step {
        border-right: 0 !important;
        border-bottom: 1px solid var(--line);
      }

      .cta {
        padding: 30px 22px;
        grid-template-columns: 1fr;
      }

      .footer-inner {
        display: block;
      }

      .nav-actions .btn.ghost {
        display: none;
      }

      .brand small {
        display: none;
      }

      .wa {
        right: 14px;
        bottom: 14px;
        padding: 13px;
      }

.wa .wa-label {
  display: inline;
}


      .workbar small {
        display: none;
      }

      .workbar {
        height: 64px;
      }

      .workspace {
        grid-template-rows: 64px 1fr;
      }

      .form-grid,
      .results {
        grid-template-columns: 1fr;
      }

      .field.full,
      .result.hero-result {
        grid-column: auto;
      }

      .gate-actions {
        grid-template-columns: 1fr;
      }

      .swatches {
        grid-template-columns: repeat(3, 1fr);
      }
    }
/* Navegación accesible en pantallas pequeñas. */
@media(max-width:980px){.nav{height:auto;min-height:76px;flex-wrap:wrap;gap:4px 12px;padding-top:9px;padding-bottom:8px}.nav-links{display:flex;order:3;width:100%;margin-left:0;overflow-x:auto;white-space:nowrap;gap:2px;scrollbar-width:thin}.nav-links a{flex:0 0 auto;padding:7px 10px}.nav-actions{margin-left:auto}.nav>img{max-width:180px;width:35%!important}}
.bz-hidden-catalog{display:none!important}


/* Contenido editorial Bézier Studio — clases nuevas, sin modificar las plataformas */
.bz-page-hero{padding-top:86px;padding-bottom:62px;max-width:1150px}
.bz-page-hero h1{font-size:clamp(2.9rem,6.3vw,5.9rem);letter-spacing:-.065em;line-height:1.04;max-width:1050px;margin:18px 0 22px}
.bz-lead{font-size:clamp(1.1rem,1.9vw,1.4rem);color:#bbc8de;max-width:880px;line-height:1.7}
.bz-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}
.bz-tight{padding-top:45px;padding-bottom:65px}
.bz-feature-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.bz-feature{background:linear-gradient(145deg,#111a2b,#0a0e17);border:1px solid var(--line);border-radius:20px;padding:26px;display:flex;flex-direction:column;align-items:flex-start;gap:12px}
.bz-feature h3{font-size:1.3rem;letter-spacing:-.02em;margin:0}.bz-feature p{color:#abb9d0;line-height:1.7;margin:0 0 8px}.bz-feature .btn{margin-top:auto}
.bz-highlight{padding:clamp(24px,5vw,55px);background:linear-gradient(125deg,#173b9a,#101e3b 70%,#1d111b);border:1px solid #3758a3;border-radius:25px}
.bz-highlight h2{font-size:clamp(2rem,4vw,3.5rem);line-height:1.1;max-width:760px;letter-spacing:-.05em}.bz-highlight p{max-width:780px;color:#d2ddf0;line-height:1.7}
.bz-mini-stats{display:flex;flex-wrap:wrap;gap:20px;margin-top:32px;color:#aab8d1;font-size:.93rem}.bz-mini-stats span{padding-right:20px;border-right:1px solid #32415d}.bz-mini-stats strong{font-size:1.4rem;color:white}
.bz-guide-list{display:grid;gap:12px}.bz-guide-row{border:1px solid var(--line);border-radius:16px;padding:18px 22px;background:#0e1522;display:flex;justify-content:space-between;align-items:center;gap:18px}.bz-guide-row h3{margin:6px 0}.bz-guide-row p{margin:0;color:#aab8d1}.bz-guide-row .btn{flex-shrink:0}
.bz-guides-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px;margin-top:23px}.bz-guide-card{border:1px solid var(--line);background:#0e1522;border-radius:18px;padding:24px;display:flex;flex-direction:column;gap:13px}.bz-guide-card h3{font-size:1.2rem;margin:0}.bz-guide-card p{color:#aab8d1;margin:0;line-height:1.6}.bz-guide-card .btn{align-self:flex-start;margin-top:auto}.bz-guide-card[hidden]{display:none!important}
.bz-search-label{display:block;font-weight:750;margin-bottom:10px;color:#cbd7eb}.bz-search{max-width:650px!important;width:100%;font-size:1rem!important;padding:15px!important}.bz-empty{color:#d6e0ef}
.bz-guide-layout{display:grid;grid-template-columns:.8fr 1.2fr;gap:55px}.bz-guide-layout h2{font-size:clamp(1.8rem,3.5vw,3rem);line-height:1.15;letter-spacing:-.04em}.bz-body-copy{color:#abb9d0;line-height:1.8}.bz-notice{margin-top:25px;padding:22px;border:1px solid #3456a2;background:#101f3e;border-radius:15px}.bz-notice p{color:#b7c7e4;line-height:1.7;margin-bottom:0}
.bz-steps{list-style:none;padding:0;margin:24px 0;display:grid;gap:15px}.bz-steps li{display:flex;align-items:flex-start;gap:18px;background:#101725;border:1px solid #29354d;padding:20px;border-radius:15px;line-height:1.7;color:#d8e3f4}.bz-step-num{font-weight:900;color:#88a8ff;font-size:1.15rem}.bz-backlink{display:inline-block;color:#a6bcff;text-decoration:none;margin-bottom:26px}
@media(max-width:960px){.bz-feature-grid,.bz-guides-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.bz-guide-layout{grid-template-columns:1fr;gap:20px}}
@media(max-width:640px){.bz-page-hero{padding-top:56px}.bz-feature-grid,.bz-guides-grid{grid-template-columns:1fr}.bz-guide-row{flex-direction:column;align-items:flex-start}.bz-mini-stats span{border-right:0}.bz-page-hero h1{font-size:clamp(2.6rem,12vw,4rem)}}

/* Bézier Suite: búsqueda, favoritos y movimiento progresivo accesible */
.bz-search-form{display:flex;gap:12px;flex-wrap:wrap;align-items:end;max-width:900px}.bz-search-form label{width:100%}.bz-search-form input{flex:1;min-width:220px}.bz-guide-card button{margin-left:8px}@media(prefers-reduced-motion:no-preference){.bz-feature,.bz-guide-card{animation:bzEnter .55s ease both}@keyframes bzEnter{from{opacity:.6;transform:translateY(8px)}to{opacity:1;transform:none}}}
