/* index.html – original styles extracted from the HTML. */
:root{
    --cmpat-blue:#0078D2;
    --cmpat-blue-dark:#0078D2;
    --cmpat-border:#0078D2;
    --cmpat-muted:#6b7280;
    --cmpat-bg:#ffffff;
    --cmpat-soft:#f6f7f9;
  }
  body{
    background:var(--cmpat-bg) !important;
    color:#111827 !important;
  }
  a{ color:var(--cmpat-blue); }
  a:hover{ color:var(--cmpat-blue-dark); }

  /* Container fallback (in case ../style.css defines something unexpected) */
  .cmpat-wrap{ 
	  width:97%;
	  padding-left:1%;
	  padding-right:1%;
  }
  .material-symbols-outlined{
	  font-size:36px;
	  font-weight:normal;
	  color:#0078D2;
	  vertical-align:middle;
  }

  /* App-like header */
  .cmpat-header{
    background:#ffffff;
	border-bottom-color:#0078D2;
    border-bottom-width:5px;
	border-bottom-style:solid;
  }
  .cmpat-header-row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:5px;
    padding:0px 0;
  }
  .cmpat-logo{
    height:85px;
    width:auto;
    display:block;
  }
  .cmpat-toplinks{
    display:flex; 
	gap:5px; 
	flex-wrap:wrap;
  }
  .cmpat-toplinks a{
    text-decoration:none;
	font-weight:bold;
    padding:0;
	border-color:#0078D2;
	background-color:#0078D2;
	color:#ffffff;
    border-radius:8px;
  }
  .cmpat-toplinks a:hover{
    background:var(--cmpat-soft);
  }

  /* Page title */
  .cmpat-title{
    margin: 5px 0 5px 0;
    font-size: 2rem;
    letter-spacing: 0.2px;
  }

  /* Tabs */
  .cmpat-tabs{
    display:flex; flex-wrap:wrap; gap:8px;
    margin: 0 0 16px 0;
  }
  .cmpat-tab{
    text-decoration:none;
    padding:8px 12px;
    border:1px solid var(--cmpat-blue);
    border-radius:10px;
    background:var(--cmpat-soft);
    color:var(--cmpat-blue);
    font-weight:bold;
  }
  .cmpat-tab:hover{
	font-weight:bold;	
  }
  .cmpat-tab.active{
    background:var(--cmpat-blue);
    border-color:var(--cmpat-blue);
    color:#ffffff;
	font-weight:bold;
  }

  /* Cards */
  .cmpat-grid{
    display:grid;
    grid-template-columns: 1.6fr 0.4fr;
    gap:10px;
    align-items:start;
  }
  @media (max-width: 900px){
    .cmpat-grid{ grid-template-columns:1fr; }
  }
  .cmpat-card{
    border:1px solid var(--cmpat-border);
    border-radius:10px;
    padding:10px 10px;
    background:#ffffff;
    box-shadow: 0 1px 0 rgba(17,24,39,0.02);
  }
  .cmpat-kicker{
    color:var(--cmpat-muted);
    font-weight:600;
    font-size:0.92rem;
    margin-bottom:6px;
  }
  .cmpat-quote{
    margin-top:14px;
    padding:12px 14px;
    border-left:4px solid var(--cmpat-blue);
    background:linear-gradient(0deg, rgba(11,94,215,0.06), rgba(11,94,215,0.02));
    border-radius:12px;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  }
  .cmpat-cta{
    display:inline-block;
    margin-top:12px;
    padding:10px 14px;
    border-radius:12px;
    background:var(--cmpat-blue);
    color:#ffffff;
    text-decoration:none;
    font-weight:700;
  }
  .cmpat-cta:hover{ background:var(--cmpat-blue-dark); color:#ffffff; }

  /* Footer */
  .cmpat-foot{
    margin: 26px 0 20px 0;
    color: var(--cmpat-muted);
    font-size: 0.92rem;
  }