/* Protocol+ Dark UI — Section Styles (Roboto-based) */
:root{
  --pp-bg:#0C0D10;
  --pp-surface:#16171D;
  --pp-muted:#5B5960;
  --pp-text:#FFFFFF;
  --pp-gradient-start:#FF5A3D; /* adjust to taste */
  --pp-gradient-end:#FFB33D;
  --pp-accent:#FF6A3D;
  --pp-border:rgba(255,255,255,0.08);
}
@media (prefers-color-scheme: light){
  :root{ --pp-text:#0C0D10; --pp-surface:#FFFFFF; --pp-bg:#F5F6F8; --pp-border:rgba(0,0,0,0.08); }
}
/* Typography */
.pp-wrap{
  font-family: "Roboto", system-ui, -apple-system, Segoe UI, Arial, sans-serif;
  color: var(--pp-text);
  background: var(--pp-bg);
  padding: 48px 24px;
}
.pp-section{
  max-width:1200px;
  margin:0 auto 36px auto;
  background: linear-gradient(180deg, var(--pp-surface) 0%, rgba(22,23,29,0.85) 100%);
  border:1px solid var(--pp-border);
  border-radius:16px;
  padding:36px;
  box-shadow: 0 10px 30px rgba(0,0,0,0.35);
}
.pp-overline{
  letter-spacing:.18em;
  text-transform:uppercase;
  color: var(--pp-muted);
  font-weight:700;
  font-size:.85rem;
  margin:0 0 12px 0;
}
.pp-h1{font-size: clamp(2rem, 4vw, 3.25rem); line-height:1.15; margin: 0 0 16px 0;}
.pp-h2{font-size: clamp(1.5rem, 3vw, 2.25rem); line-height:1.18; margin: 0 0 12px 0;}
.pp-h3{font-size: clamp(1.125rem, 2.2vw, 1.5rem); line-height:1.25; margin: 0 0 12px 0;}
.pp-body{font-size:1.05rem; color: #E7E8EC; margin:0 0 16px 0;}
.pp-muted{color: var(--pp-muted);}
.pp-gradient-text{ background: linear-gradient(90deg, var(--pp-gradient-start), var(--pp-gradient-end)); -webkit-background-clip: text; background-clip:text; color:transparent; }
.pp-chip{ display:inline-block; padding:.35rem .65rem; border:1px solid var(--pp-border); border-radius:999px; font-size:.9rem; color:#E7E8EC; margin:.25rem .35rem .25rem 0; background: rgba(255,255,255,0.04); }
.pp-list{ margin: 0; padding-left: 1.1rem;}
.pp-list li{ padding:.25rem 0; }
.pp-columns{ display:grid; gap:20px; grid-template-columns: repeat(1,1fr); }
@media(min-width:720px){ .pp-columns{ grid-template-columns: repeat(2,1fr);} }
@media(min-width:1024px){ .pp-columns{ grid-template-columns: repeat(4,1fr);} }
.pp-card{ background: rgba(255,255,255,0.03); border:1px solid var(--pp-border); border-radius:12px; padding:20px; }
.pp-result{ color: var(--pp-muted); font-style: italic; margin-top:6px;}
.pp-metrics{ display:flex; flex-wrap:wrap; gap:10px; }
.pp-metrics .pp-chip{ font-weight:700; }
.pp-btns{ display:flex; flex-wrap:wrap; gap:12px; margin-top: 8px;}
.pp-btn{ text-decoration:none; display:inline-block; padding:.85rem 1.05rem; border-radius:10px; border:1px solid var(--pp-border); background: rgba(255,255,255,0.04); color: var(--pp-text); }
.pp-btn.primary{ background: linear-gradient(90deg, var(--pp-gradient-start), var(--pp-gradient-end)); color:#0C0D10; border-color:transparent; font-weight:700;}
.pp-kicker{ margin-top: 8px; color: var(--pp-muted); font-size: .95rem;}
/* Utility for Gutenberg containers */
.wp-block-group.pp-section{ background: linear-gradient(180deg, var(--pp-surface) 0%, rgba(22,23,29,0.85) 100%); }