/* =========================================================
   PLATFORM PAGE — app release (platform.html only)
   To be merged into style.css by the orchestrator.
   ========================================================= */

/* Focus colours (release palette) */
:root {
  --focus-dev: #2563EB;
  --focus-reg: #0F766E;
  --focus-pap: #7C3AED;
}

/* Section intro */
.pl-kicker { display:flex; flex-wrap:wrap; align-items:center; gap:.5rem; margin-bottom:1rem; }
.pl-lead { font-size:1.125rem; line-height:1.65; color:#475569; max-width:62ch; margin:0 0 1.5rem; }
.section-dark .pl-lead { color:#cbd5e1; }
.pl-h2 { margin-bottom:1rem; }

/* Focus pill: dot + name in the focus colour */
.focus-pill {
  --fc: var(--focus-dev);
  display:inline-flex; align-items:center; gap:.4rem;
  padding:.3rem .75rem; border-radius:9999px;
  font-size:.8125rem; font-weight:600; line-height:1;
  color:var(--fc); background:color-mix(in srgb, var(--fc) 9%, #fff);
  border:1px solid color-mix(in srgb, var(--fc) 22%, #fff);
}
.focus-pill::before { content:""; width:.5rem; height:.5rem; border-radius:50%; background:var(--fc); }
.focus-pill.fp-dev { --fc: var(--focus-dev); }
.focus-pill.fp-reg { --fc: var(--focus-reg); }
.focus-pill.fp-pap { --fc: var(--focus-pap); }

/* Plan availability pill: always neutral grey, never colour-coded */
.plan-pill {
  display:inline-flex; align-items:center;
  padding:.25rem .6rem; border-radius:9999px;
  font-size:.6875rem; font-weight:600; letter-spacing:.06em; text-transform:uppercase; line-height:1;
  color:#475569; background:#F1F5F9; border:1px solid #E2E8F0;
}
.section-dark .plan-pill { color:#CBD5E1; background:rgba(255,255,255,.06); border-color:rgba(255,255,255,.15); }

/* Short check list */
.pl-list { list-style:none; padding:0; margin:0; display:grid; gap:.6rem; }
.pl-list li { position:relative; padding-left:1.6rem; color:#334155; line-height:1.5; }
.pl-list li::before {
  content:""; position:absolute; left:0; top:.3rem; width:1rem; height:1rem;
  background:no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2364748B' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
}
.pl-list.cols-2 { grid-template-columns:1fr 1fr; column-gap:2rem; }
.section-dark .pl-list li { color:#e2e8f0; }
.section-dark .pl-list li::before {
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2394A3B8' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
}
@media (max-width:640px){ .pl-list.cols-2 { grid-template-columns:1fr; } }

/* Media frame */
.pl-frame { border-radius:12px; overflow:hidden; box-shadow:0 20px 60px rgba(15,23,42,.12); }
.pl-frame img { width:100%; height:auto; display:block; }
.section-dark .pl-frame { box-shadow:0 20px 60px rgba(0,0,0,.35); }
.pl-caption { margin-top:.75rem; font-size:.875rem; color:#64748B; text-align:center; }
.section-dark .pl-caption { color:#94A3B8; }

/* Two-column copy + media */
.pl-split { display:grid; grid-template-columns:minmax(0,5fr) minmax(0,7fr); gap:3.5rem; align-items:center; }
.pl-split.flip { grid-template-columns:minmax(0,7fr) minmax(0,5fr); }
.pl-split.flip > :first-child { order:2; }
@media (max-width:900px){
  .pl-split, .pl-split.flip { grid-template-columns:1fr; gap:2rem; }
  .pl-split.flip > :first-child { order:0; }
}

/* Stage row: Concept → Feasibility → Development → Scale-Up → Launch */
.pl-stages { display:flex; flex-wrap:wrap; align-items:center; gap:.5rem; margin:0 0 1.5rem; padding:0; list-style:none; }
.pl-stages li { display:inline-flex; align-items:center; gap:.5rem; font-size:.875rem; font-weight:600; color:#fff; }
.pl-stages li span {
  padding:.4rem .75rem; border-radius:.5rem;
  background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.15);
}
.pl-stages li + li::before { content:"\2192"; color:#94A3B8; font-weight:400; }
.pl-stages li.is-archived span { background:transparent; border-style:dashed; color:#94A3B8; font-weight:500; }
.pl-stages li.is-archived::before { content:"\00B7"; }

/* Briefing sources: grouped chips */
.pl-sources { display:grid; grid-template-columns:1fr 1fr; gap:1.25rem 2rem; margin-top:2rem; }
.pl-sources h3 {
  font-family:Inter, sans-serif; font-size:.75rem; font-weight:600; letter-spacing:.08em; text-transform:uppercase;
  color:#64748B; margin:0 0 .6rem;
}
.pl-sources h3.is-safety { color:#B45309; }
.pl-chips { display:flex; flex-wrap:wrap; gap:.375rem; list-style:none; padding:0; margin:0; }
.pl-chips li {
  font-size:.8125rem; color:#334155; background:#fff; border:1px solid #E2E8F0;
  padding:.25rem .6rem; border-radius:9999px; line-height:1.3;
}
.pl-chips li.is-new { border-color:#CBD5E1; }
.pl-chips li.is-new::after { content:"New"; margin-left:.4rem; font-size:.625rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:#64748B; }
@media (max-width:640px){ .pl-sources { grid-template-columns:1fr; } }

/* Small feature tiles */
.pl-tiles { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; }
.pl-tile { background:#fff; border:1px solid #E2E8F0; border-radius:.75rem; padding:1.25rem 1.25rem 1.1rem; }
.pl-tile h3 { font-family:Inter, sans-serif; font-size:1rem; font-weight:600; color:#0F172A; margin:0 0 .35rem; display:flex; align-items:center; gap:.5rem; flex-wrap:wrap; }
.pl-tile p { font-size:.9375rem; color:#64748B; line-height:1.55; margin:0; }
.pl-tile kbd {
  font-family:Inter, sans-serif; font-size:.75rem; font-weight:600; color:#334155;
  background:#F1F5F9; border:1px solid #E2E8F0; border-bottom-width:2px; border-radius:.3rem; padding:.05rem .35rem;
}
.pl-tiles.cols-2 { grid-template-columns:repeat(2,minmax(0,1fr)); }
@media (max-width:900px){ .pl-tiles { grid-template-columns:1fr 1fr; } }
@media (max-width:600px){ .pl-tiles, .pl-tiles.cols-2 { grid-template-columns:1fr; } }

/* Languages banner: 800x200 */
.anim-embed.anim-banner { padding-bottom:25%; }

/* Trial line */
.pl-trial { font-size:.9375rem; color:#94A3B8; margin-top:1.25rem; }
