/* Migrated from <style> in keto.html */
/* Hero buttons */
    .hero-buttons {
      display: flex;
      gap: 1rem;
      justify-content: center;
      flex-wrap: wrap;
      margin-top: 2rem;
    }

    /* Mecanismo corporal */
    .mechanism-flow {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
      gap: 1.5rem;
      margin: 2.5rem 0;
    }
    .mechanism-step {
      background: var(--blanco);
      border-radius: 18px;
      padding: 1.8rem 1.5rem;
      text-align: center;
      box-shadow: var(--sombra-suave);
      position: relative;
    }
    .mechanism-step .step-icon {
      font-size: 2.2rem;
      display: block;
      margin-bottom: 0.8rem;
    }
    .mechanism-step h4 {
      font-size: 1.1rem;
      color: var(--verde-oscuro);
      font-weight: 600;
      margin-bottom: 0.5rem;
    }
    .mechanism-step p {
      font-size: 0.9rem;
      color: var(--texto-suave);
      line-height: 1.5;
    }
    .keto-flu-box {
      background: linear-gradient(135deg, #fff8f0 0%, #fff3e8 100%);
      border-left: 5px solid var(--tierra);
      border-radius: 15px;
      padding: 2rem 2.5rem;
      margin: 2rem 0;
    }
    .keto-flu-box h3 {
      font-size: 1.4rem;
      color: var(--tierra);
      margin-bottom: 1rem;
      font-weight: 600;
    }
    .keto-flu-box p {
      font-size: 1rem;
      color: var(--texto);
      line-height: 1.8;
      margin-bottom: 0.5rem;
    }
    .empathy-note {
      background: var(--acento-suave);
      border-radius: 15px;
      padding: 1.5rem 2rem;
      text-align: center;
      font-size: 1.05rem;
      color: var(--verde-oscuro);
      font-weight: 500;
      margin-top: 1.5rem;
    }

    /* Test interactivo */
    .test-wrapper {
      max-width: 750px;
      margin: 0 auto;
    }
    .test-question-card {
      background: var(--blanco);
      border-radius: 20px;
      padding: 2rem;
      margin-bottom: 1.5rem;
      box-shadow: var(--sombra-suave);
      border: 2px solid transparent;
      transition: border-color 0.3s ease;
    }
    .test-question-card.answered {
      border-color: var(--verde-sage);
    }
    .test-question-card p {
      font-size: 1.1rem;
      color: var(--texto);
      font-weight: 600;
      margin-bottom: 1.2rem;
    }
    .test-options {
      display: flex;
      gap: 1rem;
    }
    .test-options label {
      flex: 1;
      cursor: pointer;
    }
    .test-options input[type="radio"] {
      display: none;
    }
    .test-options .option-btn {
      display: block;
      text-align: center;
      padding: 0.75rem 1rem;
      border-radius: 50px;
      border: 2px solid var(--verde-sage);
      color: var(--verde-oscuro);
      font-weight: 600;
      font-size: 1rem;
      transition: all 0.2s ease;
      background: var(--crema-claro);
    }
    .test-options input[type="radio"]:checked + .option-btn {
      background: var(--verde-principal);
      color: var(--blanco);
      border-color: var(--verde-principal);
    }
    .test-options label:hover .option-btn {
      background: var(--acento-suave);
    }
    .test-result {
      display: none;
      border-radius: 25px;
      padding: 2.5rem;
      text-align: center;
      margin-top: 2rem;
      box-shadow: var(--sombra-hover);
      animation: fadeIn 0.4s ease;
    }
    @keyframes fadeIn {
      from { opacity: 0; transform: translateY(10px); }
      to   { opacity: 1; transform: translateY(0); }
    }
    .test-result.verde  { background: linear-gradient(135deg, #e8f5e9, #c8e6c9); border: 2px solid #66bb6a; }
    .test-result.amarillo { background: linear-gradient(135deg, #fffde7, #fff9c4); border: 2px solid #ffd54f; }
    .test-result.rojo   { background: linear-gradient(135deg, #fce4ec, #f8bbd0); border: 2px solid #ef9a9a; }
    .test-result .result-icon { font-size: 3rem; display: block; margin-bottom: 1rem; }
    .test-result h3 { font-size: 1.6rem; margin-bottom: 0.8rem; color: var(--verde-oscuro); font-weight: 700; }
    .test-result p  { font-size: 1.05rem; color: var(--texto); line-height: 1.7; margin-bottom: 1.5rem; }
    .test-reset {
      background: none;
      border: 2px solid var(--verde-sage);
      color: var(--verde-oscuro);
      padding: 0.6rem 1.5rem;
      border-radius: 50px;
      font-size: 0.9rem;
      font-weight: 600;
      cursor: pointer;
      transition: all 0.2s ease;
      margin-top: 0.5rem;
    }
    .test-reset:hover { background: var(--acento-suave); }

    @media (max-width: 480px) {
      .mechanism-flow { grid-template-columns: 1fr 1fr; }
      .hero-buttons .btn { width: 100%; text-align: center; }
    }

/* Migrated style attribute from keto.html */
[data-csp-style="keto-1"] { height:56px;width:auto;display:block; }

/* Migrated style attribute from keto.html */
[data-csp-style="keto-2"] { margin-top: 3rem; }

/* Migrated style attribute from keto.html */
[data-csp-style="keto-3"] { text-align: center; font-size: 0.95rem; color: var(--texto-suave); font-style: italic; }

/* Migrated style attribute from keto.html */
[data-csp-style="keto-4"] { margin-top: 2rem; }

/* Migrated style attribute from keto.html */
[data-csp-style="keto-5"] { margin-top: 3rem; }

/* Migrated style attribute from keto.html */
[data-csp-style="keto-6"] { background: var(--blanco); color: var(--verde-oscuro); }