/* GoodPlann · baraja DRIZA (3 tarjetas) */

.gp .band{ padding:clamp(18px,4vh,46px) 0 clamp(56px,9vh,96px); }
.gp .band-cap{ text-align:center; margin-bottom:26px; }
.gp .band-cap .k{ font-size:11.5px; font-weight:700; letter-spacing:.18em; text-transform:uppercase; color:var(--tiffany); }
.gp .band-cap h2{ margin:10px 0 0; font-weight:900; font-size:clamp(1.4rem,2.6vw,2rem); letter-spacing:-.02em;
  color:var(--snow); text-wrap:balance; }
.gp .band-cap .tw-title{ margin:14px auto 0; font-weight:900; font-size:clamp(1.5rem,3.7vw,2.7rem); letter-spacing:-.025em;
  line-height:1.2; color:var(--snow); max-width:none; }
.gp .band-cap h2 em{ font-style:normal;
  background:var(--text-grad); -webkit-background-clip:text; background-clip:text; color:transparent; }
.gp .band .reveal{ opacity:0; transform:translateY(24px); transition:opacity .7s ease, transform .7s cubic-bezier(.2,.8,.2,1); }
.gp .band.seen .reveal{ opacity:1; transform:none; }
.gp .deck{ display:grid; grid-template-columns:1fr 1.1fr 1fr; gap:18px; align-items:stretch; margin-top:38px; perspective:1300px; }
.gp .dcard{ position:relative; border-radius:20px; padding:20px; overflow:hidden;
  background:linear-gradient(180deg, rgba(20,32,30,.85), rgba(11,19,20,.92));
  border:1px solid var(--glass-brd); box-shadow:0 26px 64px rgba(0,0,0,.52), inset 0 1px 0 var(--glass-hi);
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); }
.gp .d-center{ align-self:stretch; }
.gp-js .gp .deck .dcard{ opacity:0; will-change:transform,opacity; }
.gp .deck .d-center{ transform:translateY(20px) scale(.96); transform-origin:center bottom; }
.gp .deck .d-left{ transform:translateX(-96px) rotate(-8deg) scale(.94); transform-origin:right bottom; }
.gp .deck .d-right{ transform:translateX(96px) rotate(8deg) scale(.94); transform-origin:left bottom; }
.gp .deck.play .dcard{ opacity:1; transform:none; transition:opacity .5s ease, transform .55s cubic-bezier(.2,.85,.25,1); }
.gp .deck.play .d-center{ transition-delay:0s; }
.gp .deck.play .d-left{ transition-delay:.15s; }
.gp .deck.play .d-right{ transition-delay:.3s; }
.gp .dhead{ display:flex; align-items:center; gap:10px; }
.gp .dhead .di{ width:34px; height:34px; border-radius:10px; display:grid; place-items:center; color:var(--night); font-weight:900; font-size:15px; flex:0 0 auto; }
.gp .dhead .dt{ font-size:11px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--snow); line-height:1.2; }
.gp .dhead .dt small{ display:block; color:var(--muted); font-weight:600; letter-spacing:.05em; font-size:9.5px; }
.gp .dhead .dots3{ margin-left:auto; color:var(--muted-2); letter-spacing:2px; }
.gp .dk{ font-size:10.5px; font-weight:700; letter-spacing:.13em; text-transform:uppercase; color:var(--muted); margin:18px 0 8px; }
.gp .dtitle{ font-weight:900; font-size:clamp(1.05rem,1.5vw,1.4rem); letter-spacing:-.02em; color:var(--snow); line-height:1.14; margin:0; }
.gp .gantt{ margin-top:16px; }
.gp .gantt .scale{ display:flex; justify-content:space-between; font-size:9px; color:var(--muted-2); margin-bottom:12px; padding:0 1px; }
.gp .grow{ margin:0 0 13px; }
.gp .grow .gl{ font-size:11.5px; color:var(--ink); margin-bottom:6px; }
.gp .gbar{ height:6px; border-radius:99px; background:rgba(255,255,255,.06); position:relative; }
.gp .gbar i{ position:absolute; top:0; height:100%; border-radius:99px; }
.gp .dfoot{ font-size:11.5px; color:var(--muted); margin-top:8px; display:flex; align-items:center; gap:7px; }
.gp .dfoot .d{ width:6px; height:6px; border-radius:50%; background:var(--lime); }
.gp .gauge{ display:flex; align-items:center; gap:18px; margin-top:20px; }
.gp .gauge svg{ width:118px; height:118px; flex:0 0 auto; }
.gp .glegend{ display:flex; flex-direction:column; gap:12px; }
.gp .glegend span{ display:flex; align-items:center; gap:9px; font-size:12.5px; color:var(--ink); }
.gp .glegend i{ width:9px; height:9px; border-radius:50%; flex:0 0 auto; }
.gp .dsteps{ display:flex; justify-content:space-between; margin-top:20px; padding-top:15px; border-top:1px solid rgba(255,255,255,.07); }
.gp .dsteps div{ font-size:11px; color:var(--muted); }
.gp .dsteps b{ display:block; font-size:20px; font-weight:900; color:var(--snow); }
.gp .trow{ display:flex; align-items:center; gap:12px; padding:13px 0; border-bottom:1px solid rgba(255,255,255,.06); }
.gp .trow .ti{ width:30px; height:30px; border-radius:8px; display:grid; place-items:center; flex:0 0 auto;
  background:rgba(125,226,209,.12); color:var(--tiffany); font-size:14px; }
.gp .trow .tt{ flex:1; font-size:13px; font-weight:700; color:var(--snow); }
.gp .trow .tt small{ display:block; font-size:9px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); margin-top:2px; }
.gp .trow .arw{ color:var(--muted); }
.gp .aibox{ margin-top:16px; padding:14px 16px; border-radius:14px; background:rgba(255,94,98,.09); border:1px solid rgba(255,94,98,.24); }
.gp .aibox .aik{ font-size:10px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color:#FF8A72; }
.gp .aibox p{ margin:8px 0 0; font-size:12.5px; color:var(--ink); font-style:italic; }
@media (max-width:940px){
  .gp .deck{ grid-template-columns:1fr; }
  .gp .deck .d-left, .gp .deck .d-right{ transform:translateY(26px) scale(.97); }
}
@media (max-width:560px){
  .gp .gauge{ flex-direction:column; align-items:flex-start; }
  .gp .band-cap .tw-title{ font-size:clamp(1.4rem,6vw,1.9rem); }
}