/* ============================================================
   LP-B · Card do diagnóstico em "ficha" (compacto) + popup "ficha sobe e vira".
   Card: override de #metodo .hib-apply.hib-ficha. Popup: #diagPop.
   Conteúdo da triagem usa .tg-* de sim-triage-light.css.
   ============================================================ */

/* ---- CARD FICHA (largura cheia, 2 colunas — preenchido) ---- */
#metodo .hib-apply.hib-ficha {
  display: block; position: relative; text-align: left; max-width: none; margin: 0; padding: 22px 26px 20px;
  border: 1px solid rgba(151,146,125,0.4); border-left: 4px solid #97927D; border-radius: 6px 10px 10px 6px;
  background: linear-gradient(180deg, rgba(151,146,125,0.07), rgba(255,255,255,0.02)); overflow: hidden;
}
#metodo .hib-apply.hib-ficha::after { content: ""; position: absolute; top: 0; right: 0; border-width: 0 20px 20px 0; border-style: solid; border-color: transparent rgba(151,146,125,0.55) transparent transparent; }
#metodo .hib-ficha-tab { position: absolute; top: 0; left: 0; color: #09212C; background: #97927D; font-size: 0.58rem; font-weight: 900; letter-spacing: 0.12em; text-transform: uppercase; padding: 5px 12px; border-radius: 0 0 8px 0; }
#metodo .hib-ficha-grid { display: grid; grid-template-columns: 1.25fr 1fr; gap: 28px; align-items: center; margin-top: 16px; }
#metodo .hib-apply.hib-ficha h3 { font-family: var(--m-serif, Georgia, serif); font-weight: 500; font-size: 1.3rem; line-height: 1.2; margin: 0 0 8px; max-width: none; color: #fff; text-align: left; }
#metodo .hib-ficha-sub { color: rgba(217,212,195,0.78); font-size: 0.86rem; line-height: 1.42; margin: 0 0 13px; font-weight: 600; }
#metodo .hib-ficha-chips { display: flex; flex-wrap: nowrap; gap: 5px; }
#metodo .hib-ficha-chips span { font-size: 0.68rem; font-weight: 800; color: #D9D4C3; border: 1px solid rgba(151,146,125,0.4); background: rgba(151,146,125,0.08); padding: 3px 8px; border-radius: 999px; white-space: nowrap; }
@media (max-width: 700px) { #metodo .hib-ficha-chips { flex-wrap: wrap; } }
#metodo .hib-ficha-side { display: grid; align-content: center; justify-items: stretch; border-left: 1px solid rgba(151,146,125,0.28); padding-left: 28px; }

/* botão emotivo (gradiente, brilho que respira, shimmer, seta que avança) */
#metodo .hib-ficha-cta {
  position: relative; overflow: hidden; display: flex; flex-direction: column; align-items: center; gap: 3px;
  padding: 15px 22px; border-radius: 12px; border: 0; cursor: pointer; font: inherit; color: #09212C;
  background: linear-gradient(135deg, #c6bd9f, #97927D 56%, #877f67);
  box-shadow: 0 12px 28px rgba(151,146,125,0.34), inset 0 1px 0 rgba(255,255,255,0.3);
  animation: fichaGlow 3s ease-in-out infinite;
  transition: transform 0.18s ease, box-shadow 0.2s ease, filter 0.2s ease;
}
#metodo .hib-ficha-cta-eyebrow { font-size: 0.58rem; font-weight: 900; letter-spacing: 0.14em; text-transform: uppercase; color: rgba(9,33,44,0.62); }
#metodo .hib-ficha-cta-main { display: inline-flex; align-items: center; gap: 9px; font-weight: 900; font-size: 1.02rem; }
#metodo .hib-ficha-cta::after { content: ""; position: absolute; top: 0; left: -60%; width: 42%; height: 100%; background: linear-gradient(110deg, transparent, rgba(255,255,255,0.42), transparent); transform: skewX(-18deg); animation: fichaSweep 3.6s ease-in-out infinite; pointer-events: none; }
#metodo .hib-ficha-cta:hover { transform: translateY(-2px); filter: brightness(1.05); box-shadow: 0 18px 40px rgba(151,146,125,0.5); }
#metodo .hib-ficha-cta svg { width: 17px; height: 17px; fill: none; stroke: #09212C; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; transition: transform 0.2s ease; }
#metodo .hib-ficha-cta:hover svg { transform: translateX(4px); }
@keyframes fichaGlow { 0%, 100% { box-shadow: 0 12px 26px rgba(151,146,125,0.3), inset 0 1px 0 rgba(255,255,255,0.3); } 50% { box-shadow: 0 16px 38px rgba(151,146,125,0.52), inset 0 1px 0 rgba(255,255,255,0.3); } }
@keyframes fichaSweep { 0%, 68% { left: -60%; } 100% { left: 130%; } }
@media (prefers-reduced-motion: reduce) { #metodo .hib-ficha-cta, #metodo .hib-ficha-cta::after { animation: none; } }
@media (max-width: 700px) {
  #metodo .hib-ficha-grid { grid-template-columns: 1fr; gap: 16px; }
  #metodo .hib-ficha-side { border-left: 0; border-top: 1px dashed rgba(151,146,125,0.34); padding-left: 0; padding-top: 16px; }
}

/* ---- POPUP "ficha sobe e vira" ---- */
#diagPop[hidden] { display: none; }
#diagPop { position: fixed; inset: 0; z-index: 1200; }
#diagPop .dp-bk { position: absolute; inset: 0; background: rgba(3,12,16,0.62); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); opacity: 0; transition: opacity 0.4s; }
#diagPop.show .dp-bk { opacity: 1; }
#diagPop .dp-sheet { position: fixed; left: 50%; bottom: 0; transform: translateX(-50%) translateY(100%); width: min(100%, 520px); transition: transform 0.46s cubic-bezier(0.2,0.9,0.3,1.05); }
#diagPop.show .dp-sheet { transform: translateX(-50%) translateY(0); }
#diagPop .dp-stage { perspective: 1600px; }
#diagPop .dp-card { position: relative; width: 100%; height: 454px; transform-style: preserve-3d; transition: transform 0.72s cubic-bezier(0.2,0.8,0.2,1); }
#diagPop .dp-card.opened { transform: rotateY(180deg); }
#diagPop .dp-face { position: absolute; inset: 0; backface-visibility: hidden; -webkit-backface-visibility: hidden; border-radius: 20px 20px 0 0; overflow: hidden; }
#diagPop .dp-front { padding: 30px; color: #fff; border: 1px solid rgba(151,146,125,0.32); border-left: 4px solid #97927D; background: radial-gradient(120% 60% at 50% -8%, rgba(151,146,125,0.18), transparent 55%), linear-gradient(180deg, #12313d, #09212c); display: flex; flex-direction: column; justify-content: center; text-align: center; }
#diagPop .dp-grip { width: 42px; height: 4px; border-radius: 99px; background: rgba(255,255,255,0.22); margin: 0 auto 20px; }
#diagPop .dp-fk { color: #D9D4C3; font-size: 0.62rem; font-weight: 900; letter-spacing: 0.15em; text-transform: uppercase; }
#diagPop .dp-fh { font-family: var(--m-serif, Georgia, serif); font-weight: 500; font-size: 1.34rem; line-height: 1.2; margin: 8px auto 8px; max-width: 22ch; }
#diagPop .dp-fs { color: rgba(217,212,195,0.7); font-size: 0.84rem; font-weight: 600; max-width: 34ch; margin: 0 auto; }
#diagPop .dp-back { transform: rotateY(180deg); background: #F8F7F4; padding: 18px 26px 26px; overflow: auto; }
#diagPop .dp-bc { display: flex; justify-content: flex-end; margin-bottom: 2px; }
#diagPop .dp-bc button { border: 0; background: none; color: #97927D; font: inherit; font-size: 0.78rem; font-weight: 800; cursor: pointer; }
#diagPop .dp-x { position: absolute; top: 14px; right: 18px; border: 0; background: none; font-size: 1.5rem; line-height: 1; color: #fff; cursor: pointer; z-index: 3; }
@media (prefers-reduced-motion: reduce) { #diagPop .dp-sheet, #diagPop .dp-card, #diagPop .dp-bk { transition: none; } }