/* =========================
   COCO – Style v6 (UX chip + polishing)
   ========================= */
/*
:root{
  --bg: #f5f7fb;
  --card: #ffffff;
  --text: #0f172a;
  --muted: #64748b;
  --border: #e5eaf2;

  --primary: #2f5bd6;
  --primary-2: #4f7cff;

  --accent: #22a06b;
  --accent-soft: #ecf9f3;

  --radius: 14px;
  --shadow: 0 12px 30px rgba(15,23,42,0.06);
  --shadow-soft: 0 3px 12px rgba(15,23,42,0.05);
}
*/
:root{
  /* Paleta Bosque de Otoño (MVP_7) */
  --bg: #faf8f6;                 /* beige claro */
  --card: #ffffff;
  --text: #2f3028;               /* verde/marrón oscuro */
  --muted: #7c6f5c;              /* texto secundario cálido */
  --border: rgba(0,0,0,.08);

  --primary: #3b6e3b;            /* verde musgo */
  --primary-2: #2e5230;          /* verde más oscuro */
  --ring: rgba(59,110,59,.25);

  --accent: #a47148;             /* marrón cálido */
  --accent-soft: rgba(164,113,72,.12);

  --radius: 14px;
  --shadow: 0 12px 30px rgba(47,48,40,0.08);
  --shadow-soft: 0 3px 12px rgba(47,48,40,0.06);
}

*{ box-sizing:border-box; }

body{
  margin: 0;
  background:
    radial-gradient(900px 500px at 80% -10%, rgba(59,110,59,.12), transparent 60%),
    radial-gradient(700px 350px at -10% 20%, rgba(164,113,72,.12), transparent 60%),
    var(--bg);
  color: var(--text);
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  line-height: 1.45;
  }

/* ---------- Layout ---------- */
.coco-page{
  padding-top: 14px;
  padding-bottom: 48px;
}

/* ---------- Header ---------- */
.coco-header{
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow-soft);
  overflow: hidden;
  margin-bottom: 22px;
}

.coco-header__topline{
  height: 5px;
  /* antes: linear-gradient(90deg, var(--primary), var(--primary-2)) */
  background: linear-gradient(90deg, var(--primary), var(--accent));
}

.coco-header__bar{
  height: 8px;
  /* antes: #f1f4ff */
  background: rgba(59,110,59,.10);
  border-top: 1px solid var(--border);
}


.coco-header__inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 16px;
  padding: 14px 20px; /* compact */
}


/* brand */
.coco-brand{
  display:flex;
  align-items:center;
  gap: 14px;
}

.coco-brand__logo{
  width: 50px;
  height: auto;
}



.coco-brand__name{
  font-size: 28px; /* compact */
  font-weight: 650;
  letter-spacing: -0.4px;
}

/* user area */
.info-usuario{
  display:flex;
  align-items:center;
  gap: 10px;
  background: transparent;
  margin: 0;
}

.data-usuario,
.data-usuario-temporal{
  font-size: 13px;
  color: var(--muted);
  display:flex;
  flex-direction:column;
  align-items:flex-end;
}

/* ---------- Cards ---------- */
.item-consulta,
.item-consenso,
.item-comunidad{
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 26px 28px;
  color: var(--text);
  max-width: 880px;
  margin: 0 auto;
}

/* main title inside card */
.ver-consulta-texto-consulta{
  font-size: 24px;
  font-weight: 750;
  letter-spacing: -0.3px;
  margin-bottom: 6px;
  color: var(--text);
}

.descripcion-consulta{
  font-size: 14px;
  color: var(--muted);
  margin-bottom: 18px;
}

/* green panel */

.ver-consulta-accion-usuario{
  background: linear-gradient(
    180deg,
    rgba(59,110,59,.08),
    rgba(59,110,59,.04)
  );
  box-shadow: inset 0 1px 0 rgba(255,255,255,.6);
  border: 1px solid rgba(59,110,59,.18);
  border-radius: 12px;
  padding: 18px 18px;
  color: var(--text);
  line-height: 1.6;
}

/* ---------- Buttons ---------- */
.btn-comenzar-consulta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 11px 22px;
  border-radius: 999px;
  background: var(--primary);
  color: #fff;
  font-weight: 650;
  border: none;
  transition: transform .12s ease, box-shadow .12s ease, background .12s ease;
}

.btn-comenzar-consulta:hover{
  background: var(--primary-2);  
  transform: translateY(-1px);
  box-shadow: var(--shadow-soft);
}



.btn-volver{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 10px 18px;
  border-radius: 999px;
  background: rgba(0,0,0,.02);
  border: 1px solid var(--border);
  color: var(--text);
  font-weight: 600;
  margin-top: 18px;
  align-self: flex-end;
}

.btn-volver:hover{
  background: rgba(59,110,59,.08);
}

/* ---------- Footer alignment ---------- */
.ver-consulta-footer,
.index-footer,
.footer{
  display:flex;
  justify-content:flex-end;
  align-items:center;
  gap: 12px;
  margin-top: 20px;
}

/* ---------- Footer visual ---------- */
.footer{
  background: linear-gradient(
    180deg,
    rgba(59,110,59,.10),
    rgba(59,110,59,.04)
  ) !important;
  border-top: 1px solid var(--border);
  color: var(--muted);
  padding: 14px 0;
  font-size: 13px;
}

/* =====================================
   NEW: Chip CTA centrado + bloques UX
   ===================================== */

/* Chip CTA */
.coco-chip{
  display:flex;
  justify-content:center;
  margin: 8px 0 14px 0;
}




.coco-chip__link{
  display:inline-flex;
  align-items:center;
  gap: 8px;
  padding: 10px 16px;
  border-radius: 999px;
  color: var(--primary);
  font-size: 14px;
  letter-spacing: 0.2px;
  text-decoration: none;
  background: rgba(59,110,59,.14);   /* antes .10 */
  border: 1px solid rgba(59,110,59,.28);
  font-weight: 500;
}

.coco-chip__link:hover{
  background: rgba(59,110,59,.14);
}

/* meta row inside panel */
.coco-meta{
  display:flex;
  flex-wrap: wrap;
  gap: 10px 16px;
  margin-bottom: 12px;
}

.coco-meta__item{
  color: var(--text);
  font-size: 14px;
}

/* details block */
.coco-details{
  margin: 6px 0 12px 0;
}

.coco-details__summary{
  cursor: pointer;
  color: var(--primary);
  font-weight: 650;
  list-style: none;
}

.coco-details__summary::-webkit-details-marker{
  display:none;
}

.coco-details__content{
  margin-top: 10px;
  padding-left: 6px;
}

.coco-bullet{
  margin: 4px 0;
  color: var(--text);
}

/* purpose text */
.coco-purpose{
  margin: 6px 0 14px 0;
  color: var(--muted);
  font-size: 14px;
}

/* actions row */
.coco-actions{
  display:flex;
  justify-content:flex-end;
}

/* --------- Responsive --------- */
@media (max-width: 768px){
  .coco-header__inner{ padding: 12px 14px; }
  .coco-brand__name{ font-size: 24px; }
  .coco-brand__logo{ width: 46px; }
  .item-consulta, .item-consenso, .item-comunidad{ padding: 20px; }
  .coco-chip{ justify-content:flex-start; } /* en mobile queda mejor a la izquierda */
}

/* Page title (reemplaza el chip) */
.coco-page-title{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  margin: 6px 0 10px 0;
}

.coco-page-title__eyebrow{
  font-size: 18px;
  font-weight: 700;
  color: var(--text);
  letter-spacing: 0.2px;
}

/* si querés un subtítulo más “sección” en vez de H2 */
@media (max-width: 768px){
  .coco-page-title__eyebrow{ font-size: 16px; }
}

/* opcional link secundario */
.coco-page-title__link{
  font-size: 13px;
  color: var(--primary);
  text-decoration: none;
}
.coco-page-title__link:hover{
  text-decoration: underline;
}

/* Section pill (title visual) */

/* Section pill (title visual) */



.coco-section-pill{
  display:inline-block;
  padding: 9px 20px;
  margin: 6px 0 14px 0;
  letter-spacing: 0.3px;
  position: relative;

  /*background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(59,110,59,.28);
  border-radius: 999px;*/
  color: var(--primary-2);

  font-size: 26px;
  font-weight: 700;

/*box-shadow:
    0 2px 6px rgba(47,48,40,0.08),
    inset 0 1px 0 rgba(255,255,255,0.65);*/

  user-select: none;
}
.coco-section-pill::after{
  content: "";
  display: block;
  width: 36px;
  height: 3px;
  margin: 4px auto 0;
  border-radius: 1.5px;
  background: var(--accent);
  opacity: .6;
}

/* Responsive tweak */
@media (max-width: 768px){
  .coco-section-pill{
    font-size: 15px;
    padding: 8px 16px;
  }
}

/* =====================================
   Header brand stack (CoCo arriba / centrado)
   ===================================== */

.coco-brand__stack{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  line-height: 1.05;
}

.coco-brand__title{
  font-size: 30px;      /* sube bastante */
  font-weight: 600;
  letter-spacing: 7px; /* ensancha visualmente */
  color: var(--text);
}

.coco-brand__subtitle{
  font-size: 12.5px;
  font-weight: 550;
  color: var(--muted);
}

/* Ajuste fino para mobile */
@media (max-width: 768px){
  .coco-brand__title{ font-size: 16px; }
  .coco-brand__subtitle{ font-size: 11.5px; }
}

.coco-user__stack{
  display: flex;
  flex-direction: column;
  align-items: flex-end; /* alineado a la derecha, prolijo */
  line-height: 1.15;
  gap: 2px;
}

.data-usuario-temporal,
.data-usuario{
  font-size: 12.5px;
  color: var(--muted);
}

.data-usuario-validar{
  font-size: 12.5px;
  font-weight: 650;
  color: var(--primary);
}


/* ===== Compatibilidad pantallas "layout2/base2" ===== */

/* Titular tipo "mensaje_aporte" (antes azul) */
.mensaje_aporte{
  background: linear-gradient(90deg, rgba(59,110,59,.16), rgba(164,113,72,.10));
  color: var(--text);
  border: 1px solid rgba(59,110,59,.18);
  text-align: center;
  padding: 12px 16px;
  margin: 10px 0 12px;
  border-radius: 14px;
}


.mensaje_aporte h1{
  font-size: 22px;     /* antes te queda gigante */
  line-height: 1.18;
  margin: 0;
  font-weight: 750;
  letter-spacing: 0.2px;
}



/* Botón CTA principal */
.btn-enviar{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 11px 22px;
  border-radius: 999px;
  background: var(--primary);
  color: #fff;
  font-weight: 650;
  border: none;
  transition: transform .12s ease, box-shadow .12s ease, background .12s ease;
}

.btn-enviar:hover{
  background: var(--primary-2);
  transform: translateY(-1px);
  box-shadow: var(--shadow-soft);
}


/* Botón deshabilitado -> mismo look, versión apagada */
.btn-enviar-bloqueado{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 11px 22px;
  border-radius: 999px;

  background: rgba(59,110,59,.18);     /* verde apagado */
  color: rgba(46,82,48,.55);
  border: 1px solid rgba(59,110,59,.25);

  font-weight: 650;

  box-shadow: var(--shadow-soft);

  opacity: .9;
  cursor: not-allowed;
  pointer-events: none;               /* no clickeable */

  transition: none;                   /* sin animación */
}

/* Progreso (circulitos) a paleta nueva */
.circle { border-color: rgba(0,0,0,.25); }
.filled { background-color: var(--primary); border-color: var(--primary); }
.actual { background-color: var(--accent); border-color: var(--accent); }

.coco-kicker{
  display:flex;
  justify-content:center;
  margin-top: 10px;
  font-size: 16px;
  font-weight: 650;
  color: var(--primary-2);
}

.coco-desc{
  display:flex;
  justify-content:center;
  margin-top: 10px;
  font-size: 14px;
  color: var(--muted);
  text-align: center;
}

/* =========================================
   Layout2 -> consistente con landing (wizard)
   ========================================= */

.coco-flow{
  max-width: 920px;
  margin: 0 auto;
  padding: 16px 16px 40px;
}

.coco-flow-card{
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 18px 18px;
}

/* Barra superior (solo para posicionar la X) */
.coco-flow-top{
  display:flex;
  justify-content:flex-end;
  margin-bottom: 6px;
}

/* Botón salir */
.coco-exit{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width: 38px;
  height: 38px;
  border-radius: 10px;
  border: 1px solid var(--border);
  color: var(--muted);
  text-decoration: none;
  background: rgba(255,255,255,.75);
}

.coco-exit:hover{
  color: var(--text);
  background: rgba(59,110,59,.08);
}

/* Logo (opción A) */
.coco-flow-brand{
  display:flex;
  justify-content:center;
  margin: 2px 0 10px;
}

.coco-flow-logo{
  width: 56px;
  height: auto;
  opacity: .92;
}

/* Ajuste opcional del container bootstrap dentro de la card */
.coco-flow-card .container{
  padding-left: 0;
  padding-right: 0;
}



/* =========================================
   Layout2 / wizard: bloque central tipo card
   ========================================= */

.coco-flow{
  max-width: 920px;
  margin: 0 auto;
  padding: 16px 16px 40px;
}

.coco-flow-card{
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 18px 18px;
}

.coco-flow-card .container{
  padding-left: 0;
  padding-right: 0;
}

/* X (salir) */
.coco-flow-top{
  display:flex;
  justify-content:flex-end;
  margin-bottom: 6px;
}

.coco-exit{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width: 38px;
  height: 38px;
  border-radius: 10px;
  border: 1px solid var(--border);
  color: var(--muted);
  text-decoration: none;
  background: rgba(255,255,255,.75);
}
.coco-exit:hover{
  color: var(--text);
  background: rgba(59,110,59,.08);
}

/* Logo (opción A) */
.coco-flow-brand{
  display:flex;
  justify-content:center;
  margin: 2px 0 10px;
}
.coco-flow-logo{
  width: 56px;
  height: auto;
  opacity: .92;
}

/* Textos (reemplazan inline styles) */
.coco-kicker{
  display:flex;
  justify-content:center;
  margin-top: 8px;
  font-size: 16px;
  font-weight: 650;
  color: var(--primary-2);
  text-align: center;
}

.coco-desc{
  display:flex;
  justify-content:center;
  margin-top: 6px;
  font-size: 14px;
  color: var(--muted);
  text-align: center;
}

/* Media */
.coco-media{
  display:flex;
  justify-content:center;
  margin-top: 10px;
}

.coco-media-img{
  width: 100%;
  max-width: 680px;
  border-radius: 14px;
  border: 1px solid var(--border);
}

/* Textarea aporte (altura + look) */
.input_aporte{
  width: 100%;
  padding: 12px 14px;
  border-radius: 12px;
  background: rgba(255,255,255,.85);
  color: var(--text);
  font-size: 14px;
  line-height: 1.45;
  min-height: 200px;
  resize: vertical;
  outline: none;
  border: 1px solid var(--border);
  box-shadow: 0 1px 0 rgba(0,0,0,.02);

}

.input_aporte:focus{
  box-shadow: 0 0 0 4px var(--ring);
  border-color: rgba(59,110,59,.35);
}

/* Botón pegado al textarea */
.coco-flow-actions{
  display:flex;
  justify-content:flex-end;
  margin-top: 10px;

}

/* Progreso (circulitos) a paleta nueva */
.circle-container{
  display:flex;
  justify-content:center;
  gap: 8px;
  margin: 10px 0 6px;
}

.circle{
  width: 16px;
  height: 16px;
  border-radius: 50%;
  border: 2px solid rgba(0,0,0,.25);
}

.circle.filled{
  background: var(--primary);
  border-color: var(--primary);
}

.circle.actual{
  background: var(--accent);
  border-color: var(--accent);
}

.StyleIdea{
  font-family: Nunito;
  font-size: 0.95em;
  line-height: 1.35;
  text-align: left;
  font-weight: normal;

  display: block;
  width: 100%;
  max-width: 100%;
  margin: 12px auto;
  padding: 0;

  border-radius: 14px;
  border: 1px solid rgba(0,0,0,0.10);
  background-color: rgba(255,255,255,1);

  cursor: default;
  height: auto;         /* clave: no lo fuerces a 132px */
  overflow: hidden;     /* para que la “banda” no se salga */
}


/* Logo consistente */
.coco-logo{
  width: 50vw;
  max-width: 150px;
  height: auto;
}

/* Textos de instrucciones en valoración */
.coco-h2{
  margin: 0 0 6px 0;
  font-weight: 700;
}

.coco-help{
  font-size: 0.95em;
  color: #4c4c4c;
}

.coco-error{
  margin-top: 10px;
  color: #8b0000;
  font-weight: 600;
}

/* Layout interno de cada idea (texto + columna de votos + banda) */






/* Banda izquierda */
.coco-band{
  width: 10px;
  background-color: rgba(0,0,0,0.18);
  border-radius: 14px 0 0 14px;
}

/* ===========================
   Valoración (pantalla votos)
   =========================== */

.coco-rate-head{
  margin: 10px 0 14px;
  text-align: center;
}

.coco-h2{
  margin: 0 0 6px 0;
  font-weight: 750;
  font-size: 18px;
}

.coco-help{
  font-size: 14px;
  color: var(--muted);
}

.coco-error{
  margin-top: 10px;
  color: #8b0000;
  font-weight: 650;
  text-align: center;
}

/* contenedor idea */
.StyleIdea{
  width: 100%;
  margin: 12px 0;
  border-radius: 14px;
  border: 1px solid rgba(0,0,0,0.10);
  background: rgba(255,255,255,.92);
  overflow: hidden;
}











/* texto */


/* banda izquierda */
.coco-band{
  width: 10px;
  background: rgba(0,0,0,.18);
  border-radius: 14px 0 0 14px;
}

/* botón enviar votos */
.coco-flow-actions{
  display:flex;
  justify-content:flex-end;
  margin-top: 14px;
}

/* ===== Valoration list ===== */
.coco-idea-row{
  display:flex;
  flex-direction: row-reverse;
  gap:0px;
  padding:0px 0px;
  border-radius:18px;
  background:#ffffff;
  margin:0px 0;
  border:1px solid rgba(0,0,0,.06);
  box-shadow: 0 6px 18px rgba(0,0,0,.05);
  transition: transform .15s ease, box-shadow .15s ease;
}

.coco-idea-row:hover{
  transform: translateX(-12px);
  box-shadow: 0 10px 26px rgba(0,0,0,.08);
}



.coco-vote-col{
  display:flex;
  flex-direction:column;
  gap:0px;
  justify-content:center;
}

.coco-vote-btn{
  width:56px;
  height:75px;
  border:none;
  border-radius:14px;
  background: var(--primary-2);
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  box-shadow: 0 2px 8px rgba(0,0,0,.08);
}
.coco-vote-btn.top{
  border-radius: 0 14px 0 0;
}

.coco-vote-btn.bottom{
  border-radius: 0 0 14px 0;
}
.coco-vote-btn img{ width:26px; height:26px; }

.texto-idea{
  padding: 0px 5px;
  margin: 5px 0px;
  flex:1;
  font-size:16.5px;
  max-height: 150px;
  line-height:1.50;
  color: var(--text);
  display:flex;
  align-items:flex-start;
  overflow-y: auto;
  
}


.coco-band{
  width:10px;
  border-radius:10px;
  background:#afafaf;
}

.coco-flow-actions{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:10px;
  margin-top:16px;
}

.coco-vote-status{
  font-size:14px;
  color: rgba(0,0,0,.65);
}



/* ===== Section header ===== */
.coco-section-header{
  text-align:center;
  margin: 10px 0 18px;
}

.coco-section-title{
  font-size: 20px;
  font-weight: 700;
  color: var(--primary);
}

.coco-section-subtitle{
  font-size: 14.5px;
  color: rgba(0,0,0,.6);
  margin-top: 4px;
}

/* =====================================
   Finish screen (consulta completa)
   ===================================== */

.coco-finish-wrap{
  max-width: 980px;
  margin: 0 auto;
  padding: 22px 16px 28px;
  display:flex;
  justify-content:center;
}

.coco-finish-card{
  width: min(760px, 100%);
  background: rgba(255,255,255,0.92);
  border: 1px solid var(--border);
  border-radius: 18px;
  box-shadow: var(--shadow-soft);
  padding: 26px 22px;
  text-align: center;
}

.coco-finish-icon{
  width: 54px;
  height: 54px;
  border-radius: 999px;
  margin: 0 auto 12px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size: 28px;
  font-weight: 800;
  background: #ecf9f3;
  border: 1px solid rgba(34,160,107,0.18);
  color: var(--accent);
}

.coco-finish-title{
  font-size: 32px;
  line-height: 1.15;
  margin: 6px 0 10px;
  color: var(--text);
  letter-spacing: -0.3px;
}

.coco-finish-subtitle{
  margin: 0 auto 16px;
  max-width: 56ch;
  color: var(--muted);
  font-size: 15px;
  line-height: 1.6;
}

.coco-finish-actions{
  display:flex;
  justify-content:center;
  margin-top: 6px;
}

/* mobile */
@media (max-width: 520px){
  .coco-finish-title{ font-size: 26px; }
  .coco-finish-card{ padding: 22px 16px; }
}

.footer {
    margin-top: 80px;
    padding: 30px 20px;
    background: #f2f5f3;
    border-top: 1px solid #e0e5e2;
}

.footer-content {
    max-width: 900px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    gap: 20px;
    justify-content: center;
    text-align: center;
    flex-wrap: wrap;
}

.footer-logo {
    width: 60px;
    opacity: 0.85;
}

.footer-text {
    font-size: 0.9em;
    color: #555;
    line-height: 1.4;
}

a.btn-primary {
    display: inline-block;
    background: #2f6b3f !important;
    padding: 12px 28px !important;
    border-radius: 30px !important;
    font-weight: 600;
    color: white !important;
    text-decoration: none !important;
}

.landing-container{
  max-width: 980px;
  margin: 0 auto;
  padding: 10px 24px 80px;
}

.landing-hero h1{
  font-size: 2.6em;
  margin: 0 0 14px 0;
  color: #2f4f3f;
}

.landing-lead{
  font-size: 1.05em;
  color: #333;
  line-height: 1.6;
  margin: 0 0 10px 0;
  max-width: 900px;
}

.landing-bridge{
  margin-top: 16px;
  padding: 14px 18px;
  background: #f4f8f5;
  border: 1px solid #e1e8e4;
  border-radius: 14px;
  color: #2f4f3f;
  max-width: 900px;
}

/* CARDS */
.landing-steps{
  margin-top: 28px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.landing-card{
  background: #ffffff;
  border: 1px solid #e6ece8;
  border-radius: 18px;
  padding: 18px 18px 16px;
  box-shadow: 0 6px 18px rgba(0,0,0,0.06);
}

.landing-card-title{
  font-size: 1.2em;
  font-weight: 700;
  color: #2f4f3f;
  margin-bottom: 8px;
}

.landing-card p{
  margin: 0;
  color: #444;
  line-height: 1.5;
}

/* CTA */
.landing-cta{
  margin-top: 34px;
}

.landing-cta-text{
  font-size: 1.05em;
  margin-bottom: 14px;
  color: #333;
}

.landing-contact{
  margin-top: 28px;
  color: #555;
}

.landing-contact-link{
  font-weight: 600;
  color: #2f6b3f;
  text-decoration: none;
}

.landing-contact-link:hover{
  text-decoration: underline;
}

/* Responsive */
@media (max-width: 900px){
  .landing-steps{
    grid-template-columns: 1fr;
  }
}

.main-card{
  background: #fff;
  border-radius: 22px;
  padding: 38px 38px 42px;
  box-shadow: 0 8px 26px rgba(0,0,0,0.07);
}

.landing-hero {
  text-align: center;
  padding-top: 20px;
}
.landing-hero p {
  margin-left: auto;
  margin-right: auto;
}
.landing-cta {
  margin-top: 48px;
}
.landing-hero { text-align: center; }

.landing-lead, .landing-bridge{
  text-align: left;
  margin-left: auto;
  margin-right: auto;
  max-width: 820px;
}
.landing-section-title{
  margin-top: 26px;
  margin-bottom: 6px;
  font-size: 1.2em;
  font-weight: 700;
  color: #2f4f3f;
  text-align: left;
  max-width: 820px;
  margin-left: auto;
  margin-right: auto;
}

.landing-section-subtitle{
  margin-top: 0;
  margin-bottom: 18px;
  color: #444;
  line-height: 1.5;
  text-align: left;
  max-width: 820px;
  margin-left: auto;
  margin-right: auto;
}

.landing-hero h1 {
  margin-top: 0px;        /* o incluso -5px si hace falta */
  margin-bottom: 20px;
}

.landing-hero h1 {
  letter-spacing: 0.2px;
}

.btn-primary{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 14px 22px;
  border-radius: 999px;
  font-weight: 700;
  text-decoration: none;
  border: 1px solid rgba(0,0,0,0.08);
}


/* ---------- Privacy box ---------- */
.coco-privacy{
  max-width: 880px;
  margin: 12px auto 12px;
  padding: 14px 16px;
  background: var(--accent-soft);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow-soft);
}

.coco-privacy__title{
  font-size: 14px;
  font-weight: 750;
  letter-spacing: -0.2px;
  color: var(--primary-2);
  margin-bottom: 6px;
}

.coco-privacy__text{
  font-size: 14px;
  color: var(--text);
  opacity: 0.80;
  line-height: 1.45;
}

.coco-privacy__text b{
  font-weight: 750;
  color: var(--text);
  opacity: 1;
}