/* =========================
   TCM Privacy Layout (no page scroll; footer visible)
   ========================= */
:root{
  /* Tune if צריך: רזרווה ל-Header/Nav/Title ול-Footer */
  --header-block: 300px;   /* גבוה הכותרות והניווט העליון + רווחים */
  --footer-block: 72px;    /* גבוה הפוטר בדף שלך */
  --v-gap: 18px;           /* ריווח בין ה-Title לגריד */
}

.privacy-wrap{
  max-width: 1200px;
  margin: 1rem auto;
  padding: 0 12px;
}

/* Header */
.privacy-header h1{
  font-size: 1.6rem;
  margin: 0 0 .35rem 0;
  color:#fff; text-align:center;
}
.privacy-header .subtitle{
  color:#fff; text-align:center;
  margin: 0 0 .8rem 0;
  font-weight:500; opacity:1;
}

/* Card base */
.card{
  background:#0f172a; color:#fff;
  border-radius:14px;
  padding:.8rem;
  margin:.6rem 0;
  box-shadow:0 10px 26px rgba(2,6,23,.28);
}
.card h2{ margin:0 0 .45rem 0; font-size:1rem; }

/* Internals */
.grid{
  display:grid; grid-template-columns:repeat(4,minmax(0,1fr));
  gap:.5rem; margin-bottom:.5rem;
}
.grid .k{ opacity:.85; font-size:.78rem; }
.grid .v{ font-weight:600; font-size:.86rem; }

.cats{ width:100%; border-collapse:collapse; margin-top:.2rem; font-size:.86rem; }
.cats th,.cats td{ border-top:1px solid rgba(255,255,255,.08); padding:.42rem .33rem; text-align:left; color:#fff; }

.pill{ display:inline-block; padding:.12rem .45rem; border-radius:999px; font-size:.78rem; background:rgba(255,255,255,.12); color:#fff; }
.pill.on{ background:#16a34a; }
.pill.off{ background:#ef4444; }

.actions{ display:flex; gap:.45rem; margin-top:.6rem; flex-wrap:wrap; }
.btn{ border:1px solid rgba(255,255,255,.2); background:transparent; color:#fff; padding:.42rem .78rem; border-radius:10px; cursor:pointer; }
.btn.primary{ background:#22c55e; border-color:#22c55e; color:#0a0f1f; font-weight:700; }
.btn.ghost:hover,.btn.primary:hover{ filter:brightness(1.05); }

/* Links readable */
.card a{ color:#93c5fd; text-decoration:underline; }
.card a:hover{ filter:brightness(1.1); }

/* ========= Wide layout: 3 columns, no **page** scroll ========= */
.cards-grid{ display:block; }

@media (min-width: 1280px){
  /* מונעים גלילה של כל העמוד בדף זה בלבד */
  html, body{ height:100%; overflow:hidden; }

  .cards-grid{
    display:grid;
    grid-template-columns: 1fr 0.9fr 1.1fr; /* Current | Retention | Compliance */
    gap:14px;
    align-items:stretch;

    /* הגובה המקסימלי של אזור הכרטיסים = גובה מסך פחות Header/Title ופוטר */
    height: calc(100vh - var(--header-block) - var(--footer-block) - var(--v-gap));
    margin-top: var(--v-gap);
  }

  /* כל כרטיס תופס את הגובה המחושב; גלילה פנימית אם צריך */
  .cards-grid > .card{
    height: 100%;
    overflow:auto;
  }

  /* טיפוגרפיה קומפקטית עוד קצת למסכים ניידים-רחבים */
  .privacy-header h1{ font-size:1.5rem; }
  .privacy-header .subtitle{ font-size:.95rem; margin-bottom:.75rem; }
  .card{ padding:.75rem; }
  .cats{ font-size:.84rem; }
  .grid .k{ font-size:.75rem; }
  .grid .v{ font-size:.84rem; }
}

/* Ensure white text anywhere in cards */
.privacy-wrap .card p,
.privacy-wrap .card li,
.privacy-wrap .card .k,
.privacy-wrap .card .v,
.privacy-wrap .card .cats th,
.privacy-wrap .card .cats td{ color:#fff !important; }

/* Optional */
.note{ opacity:.9; }