/* Comparison board: shared by index.html and the TripIt/Polarsteps/Wanderlog post */
.board{--ink:#14110F;--royal:#2456E6;--hair:rgba(20,17,15,.09);position:relative;margin:44px 0 36px;border-radius:20px;background:#fff;box-shadow:0 18px 50px rgba(20,17,15,.09),0 1px 0 rgba(20,17,15,.06);font-family:Inter,system-ui,sans-serif;font-size:.92rem;line-height:1.35;color:#14110F}
.board .sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
/* the raised dark Adonde card, full height, sits above the rows */
.board::before{content:"";position:absolute;z-index:1;left:24%;width:28%;top:-18px;bottom:-18px;border-radius:20px;background:var(--ink);box-shadow:0 22px 50px rgba(20,17,15,.35)}
.brow{position:relative;display:grid;grid-template-columns:24% 28% 16% 16% 16%;border-bottom:1px solid var(--hair);background:#faf9f6}
.brow:first-child{border-radius:20px 20px 0 0}
.brow:last-child{border-bottom:0;border-radius:0 0 20px 20px}
.brow:not(.bhead):hover{background:#fff}
.cap,.cell{padding:16px 16px;min-width:0}
.cap{font-family:"Space Grotesk",system-ui,sans-serif;font-weight:700;font-size:1rem;line-height:1.2;display:flex;align-items:center;letter-spacing:-.005em}
.cell{display:flex;gap:10px;align-items:flex-start;color:#2a2622}
.cell .tx{display:flex;flex-direction:column;gap:2px;min-width:0}
.cell b{font-weight:600}
.cell small{font-size:.76rem;color:#6C6560;font-weight:400}
.brow:not(.bhead) .cell,.brow:not(.bhead) .cap{transition:transform .18s ease}
.brow:not(.bhead):hover .tx,.brow:not(.bhead):hover .m{transform:translateY(-2px)}
.tx,.m{transition:transform .18s ease}
.cell.us{position:relative;z-index:2;color:#fff;padding-left:20px}
.cell.us small{color:rgba(255,255,255,.72)}
.cell.us b{font-size:.98rem}
.m{flex:none;position:relative;width:22px;height:22px;border-radius:50%;margin-top:1px}
.m.y{background:var(--royal) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 22'%3E%3Cpath d='M6 11.5l3.4 3.3L16 7.8' fill='none' stroke='%23fff' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/100% no-repeat}
.cell.us .m.y{box-shadow:0 0 0 2px rgba(255,255,255,.9)}
.m.n{border:2px solid #c4beb7}
.m.p::after{content:"";position:absolute;left:3px;right:3px;top:50%;height:4px;margin-top:-2px;border-radius:2px;background:#E0A100}
.m.p{background:rgba(224,161,0,.14)}
.bhead{background:#fff;border-radius:20px 20px 0 0}
.bhead .cap{min-height:92px}
.bhead .cell{align-items:center;font-family:"Space Grotesk",system-ui,sans-serif;font-weight:700;font-size:1.05rem;color:#14110F;padding-top:30px}
.bhead .cell.us{color:#fff;font-size:1.25rem;gap:10px;padding-top:34px}
.bhead img{border-radius:8px;display:block}
.ribbon{position:absolute;top:0;right:16px;padding:5px 11px 7px;background:var(--royal);color:#fff;font:700 .68rem/1 "Space Mono",monospace;letter-spacing:.16em;border-radius:0 0 8px 8px}
@media (max-width:720px){
  .board{background:none;box-shadow:none;border-radius:0;margin:28px 0 16px;display:grid;gap:14px}
  .board::before{display:none}
  .board .brow.bhead{display:none}
  .brow,.brow:first-child,.brow:last-child{display:block;border:1px solid var(--hair);border-radius:16px;padding:16px;background:#fff;box-shadow:0 8px 24px rgba(20,17,15,.06)}
  .brow:not(.bhead):hover .tx,.brow:not(.bhead):hover .m{transform:none}
  .cap{padding:0 0 12px;font-size:1.05rem}
  .cell{padding:0}
  .cell.us{padding:12px 14px;border-radius:14px;background:#14110F;margin-bottom:12px}
  .cell.us::after{content:"FREE";position:absolute;top:10px;right:12px;font:700 .6rem/1 "Space Mono",monospace;letter-spacing:.14em;background:#2456E6;padding:4px 7px;border-radius:6px}
  .cell:not(.us){align-items:center;gap:8px;padding:5px 0;border-top:1px solid var(--hair)}
  .cell:not(.us):nth-of-type(n){font-size:.84rem}
  .cell:not(.us) .m{width:18px;height:18px;margin:0}
  .cell:not(.us) .tx{flex-direction:row;flex-wrap:wrap;gap:0 6px;align-items:baseline}
  .cell:not(.us)::before{content:attr(data-n);flex:none;width:84px;font-weight:600;color:#6C6560;order:-1}
  .cell:not(.us) .m{order:0}
  .cell:not(.us) b{font-weight:500}
}
.board + .foot-note a{color:#2456E6}