/* GDPR RoPA template landing page: free template first, optional draft step second */
.tp-ropa .mt-hero{align-items:start}
.tp-ropa-lead{margin:0 0 18px}
.tp-ropa-step{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;margin:0 0 10px;font-weight:800;color:var(--ink,#071b35);font-size:1rem;line-height:1.35}
.tp-ropa-step span{display:inline-block;padding:3px 10px;border-radius:999px;background:#e4ecfb;color:#1c3f8f;font-size:.74rem;font-weight:850;letter-spacing:.06em;text-transform:uppercase}
.tp-ropa-get{padding:20px;border:1px solid #bfd0e5;border-radius:18px;background:#fff;box-shadow:0 12px 32px rgba(9,34,70,.08)}
.tp-ropa-dl{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;max-width:100%;box-sizing:border-box;padding:12px 22px;border-radius:14px;background:var(--blue,#1f5cf0);color:#fff;font-weight:800;font-size:1.02rem;line-height:1.25;text-align:center;text-decoration:none;box-shadow:0 10px 24px rgba(31,92,240,.25)}
.tp-ropa-dl:hover{background:#1548c7}
.tp-ropa-dl:focus-visible{outline:3px solid #0b1f3f;outline-offset:3px}
.tp-ropa-dl svg{flex:0 0 auto;width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.tp-ropa-meta{margin:12px 0 0;color:var(--muted,#52647b);font-size:.9rem;line-height:1.5}
.tp-ropa-meta a{display:inline-flex;align-items:center;min-height:40px;font-weight:700;color:#1c47c4}
.tp-ropa-next{margin-top:26px}
.tp-ropa-next .wt-drop{margin-top:0}

/* Sample output card */
.tp-ropa-demo{display:grid}
.tp-ropa-src{padding:16px 22px;background:linear-gradient(145deg,#0b213d,#12345e);color:#fff}
.tp-ropa-src .tp-ropa-file{color:#c9d8f0}
.tp-ropa-src pre{margin:6px 0 0;white-space:pre-wrap;overflow-wrap:anywhere;font-size:.86rem;line-height:1.55}
.tp-ropa-sheet{padding:16px 22px 4px;min-width:0}
.tp-ropa-file{margin:0 0 8px;font-size:.74rem;font-weight:850;letter-spacing:.06em;text-transform:uppercase;color:#3159b8}
.tp-ropa-kv{display:grid;grid-template-columns:1fr 1fr;gap:0 16px;margin:0}
.tp-ropa-kv div{display:grid;gap:2px;padding:7px 0;border-bottom:1px solid var(--line,#d7e1ee);min-width:0}
.tp-ropa-kv dt{font-size:.78rem;font-weight:700;color:var(--muted,#52647b)}
.tp-ropa-kv dd{margin:0;font-weight:700;color:var(--ink,#071b35);overflow-wrap:anywhere}
.tp-ropa-kv dd.tp-ropa-blank{justify-self:start;padding:1px 8px;border:1px dashed #c7a24a;border-radius:6px;background:#fff8e6;color:#6b4d00;font-weight:700;font-size:.86rem}
.tp-ropa-table{width:100%;border-collapse:collapse;font-size:.88rem;line-height:1.4}
.tp-ropa-table th,.tp-ropa-table td{padding:7px 8px 7px 0;border-bottom:1px solid var(--line,#d7e1ee);text-align:left;vertical-align:top;overflow-wrap:anywhere}
.tp-ropa-table thead th{font-size:.72rem;font-weight:850;letter-spacing:.04em;text-transform:uppercase;color:var(--muted,#52647b)}
.tp-ropa-table td{color:var(--ink,#071b35)}
.tp-ropa-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.tp-ropa-foot{margin:0;padding:12px 22px 20px;color:var(--muted,#52647b);font-size:.88rem;line-height:1.5}

/* Column list */
.tp-ropa-cols>p{max-width:760px;color:var(--muted,#52647b)}
.tp-ropa-colgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-top:20px}
.tp-ropa-colgrid>div{min-width:0;padding:20px 22px;border:1px solid var(--line,#d7e1ee);border-radius:18px;background:#fff}
.tp-ropa-colgrid h3{margin:0 0 10px;font-size:1.05rem}
.tp-ropa-colgrid ul{margin:0;padding:0;list-style:none}
.tp-ropa-colgrid li{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:9px 0;border-bottom:1px solid var(--line,#d7e1ee)}
.tp-ropa-colgrid li span{min-width:0;overflow-wrap:anywhere}
.tp-ropa-colgrid li b{flex:0 0 auto;font-size:.8rem;font-variant-numeric:tabular-nums;color:#1c3f8f;white-space:nowrap}
.tp-ropa-colgrid div>p{margin:12px 0 0;color:var(--muted,#52647b);font-size:.9rem;line-height:1.5}
.tp-ropa .mt-context-links{display:flex;flex-wrap:wrap;gap:10px 18px}

@media (max-width:800px){
  .tp-ropa .mt-public .mt-promise{display:block}
  .tp-ropa .mt-public .mt-promise>p{margin:0 0 14px}
  .tp-ropa .mt-public .mt-promise>h1{margin:8px 0 12px}
  .tp-ropa .mt-public .mt-hero>.mt-demo{order:0;margin-top:22px}
  .tp-ropa-colgrid{grid-template-columns:1fr}
}
@media (max-width:480px){
  .tp-ropa-get{padding:16px}
  .tp-ropa-dl{width:100%;padding:12px 14px}
  .tp-ropa-src,.tp-ropa-sheet{padding-left:16px;padding-right:16px}
  .tp-ropa-foot{padding:12px 16px 18px}

  .tp-ropa-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .tp-ropa-table,.tp-ropa-table tbody,.tp-ropa-table tr,.tp-ropa-table td{display:block}
  .tp-ropa-table tr{padding:8px 0;border-bottom:1px solid var(--line,#d7e1ee)}
  .tp-ropa-table td{display:grid;grid-template-columns:7.5em minmax(0,1fr);gap:8px;padding:3px 0;border:0}
  .tp-ropa-table td::before{content:attr(data-label);font-size:.72rem;font-weight:850;letter-spacing:.03em;text-transform:uppercase;color:var(--muted,#52647b)}
  .tp-ropa-colgrid>div{padding:16px}
}
@media (prefers-reduced-motion:reduce){.tp-ropa-dl{transition:none}}
@media (max-width:359px){.tp-ropa-kv{grid-template-columns:1fr}}
