/* Centrum Coreinfra — strona publiczna. Ta sama paleta co panel i CCiL. */

:root{
  --bg:#F1F2F4; --card:#FFFFFF; --ink:#16181D; --ink-2:#5B6171; --ink-3:#868C9B;
  --line:#D9DDE4; --accent:#8A6A22; --accent-ink:#FFFFFF;
  --ok:#2F7A50; --ok-soft:rgba(47,122,80,.12);
  --warn:#9A6C12; --warn-soft:rgba(154,108,18,.12);
  --crit:#A93A34; --crit-soft:rgba(169,58,52,.10);
  --sans:"Segoe UI Variable Text",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Ubuntu,"Helvetica Neue",Arial,sans-serif;
  --shadow:0 1px 2px rgba(20,24,32,.05), 0 12px 32px -22px rgba(20,24,32,.45);
  --radius:14px;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#131419; --card:#1A1C22; --ink:#E9E7E2; --ink-2:#9BA1AE; --ink-3:#767D8B;
    --line:#2B2F38; --accent:#C79A46; --accent-ink:#15161A;
    --ok:#62B183; --ok-soft:rgba(98,177,131,.14);
    --warn:#D7A94A; --warn-soft:rgba(215,169,74,.14);
    --crit:#E0665D; --crit-soft:rgba(224,102,93,.14);
    --shadow:0 1px 2px rgba(0,0,0,.4), 0 14px 40px -26px rgba(0,0,0,.9);
  }
}

*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);
  font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:var(--accent)}
h1,h2{letter-spacing:-.02em;margin:0}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{
  outline:2px solid var(--accent);outline-offset:2px;border-radius:4px}

/* ---------- nagłówek ---------- */
.site-top{max-width:980px;margin:0 auto;padding:20px 20px 0;
  display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.site-brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);
  font-weight:650;letter-spacing:-.01em}
.site-nav{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.site-nav a{color:var(--ink-2);text-decoration:none;font-size:14.5px}
.site-nav a:hover{color:var(--ink)}
.site-nav a.site-btn-main{color:var(--accent-ink)}

/* ---------- treść ---------- */
.site-main{max-width:980px;margin:0 auto;padding:8px 20px 40px;
  display:flex;flex-direction:column;gap:18px}

.site-hero{padding:38px 4px 14px;max-width:44rem}
.site-hero-tight{padding-bottom:6px}
.site-hero h1{font-size:clamp(26px,4vw,38px);line-height:1.2}
.site-lead{color:var(--ink-2);font-size:17px;margin:14px 0 0}
.site-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}

.site-btn{display:inline-block;padding:9px 16px;border-radius:10px;border:1px solid var(--line);
  background:var(--card);color:var(--ink);text-decoration:none;font-size:14.5px;font-weight:550;
  cursor:pointer}
.site-btn:hover{border-color:var(--ink-3)}
.site-btn-main{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.site-btn-main:hover{filter:brightness(1.06)}
.site-btn-ghost{background:transparent;border-color:transparent;color:var(--ink-2)}

/* ---------- karty ---------- */
.site-card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:22px 24px;box-shadow:var(--shadow)}
.site-card-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;
  margin-bottom:14px;flex-wrap:wrap}
.site-card h2{font-size:19px}
.site-more{font-size:14px;text-decoration:none}
.site-cols{display:grid;gap:20px;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr)}
@media (max-width:720px){.site-cols{grid-template-columns:1fr}}
.site-cols p{margin:0 0 10px}
.site-links{display:flex;flex-direction:column;gap:8px;align-items:flex-start}
.site-muted{color:var(--ink-2)}
.small{font-size:13.5px}

/* ---------- lista serwisów ---------- */
.site-services{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.site-services li + li{border-top:1px solid var(--line)}
.site-services a{display:flex;align-items:center;gap:12px;padding:12px 4px;
  text-decoration:none;color:var(--ink)}
.site-services a:hover{background:var(--bg);border-radius:8px}
.site-service{display:flex;flex-direction:column;min-width:0;flex:1}
.site-service span{font-size:13.5px}
.site-host{color:var(--ink-3);font-size:13.5px;white-space:nowrap}
@media (max-width:560px){.site-host{display:none}}

.site-dot{width:10px;height:10px;border-radius:50%;flex:none;box-shadow:0 0 0 4px var(--ok-soft)}
.site-dot-ok{background:var(--ok);box-shadow:0 0 0 4px var(--ok-soft)}
.site-dot-bad{background:var(--crit);box-shadow:0 0 0 4px var(--crit-soft)}
.site-dot-unk{background:var(--ink-3);box-shadow:0 0 0 4px rgba(134,140,155,.14)}

/* ---------- komunikaty ---------- */
.site-alert{border-radius:var(--radius);padding:14px 18px;border:1px solid var(--line);
  background:var(--ok-soft);border-color:color-mix(in srgb, var(--ok) 40%, transparent)}
.site-alert-error{background:var(--crit-soft);border-color:color-mix(in srgb, var(--crit) 40%, transparent)}

/* ---------- formularz ---------- */
.site-form{display:flex;flex-direction:column;gap:14px;margin-top:6px}
.site-row{display:grid;gap:14px;grid-template-columns:1fr 1fr}
@media (max-width:640px){.site-row{grid-template-columns:1fr}}
.site-form label{display:flex;flex-direction:column;gap:6px;font-size:14px;color:var(--ink-2)}
.site-form label em{font-style:normal;color:var(--ink-3)}
.site-form input,.site-form select,.site-form textarea{
  font:inherit;font-size:15px;color:var(--ink);background:var(--bg);
  border:1px solid var(--line);border-radius:10px;padding:9px 11px;width:100%}
.site-form textarea{resize:vertical;min-height:120px}
.site-form-foot{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.site-trap{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* ---------- stopka ---------- */
.site-foot{max-width:980px;margin:0 auto;padding:22px 20px 40px;border-top:1px solid var(--line);
  display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;
  color:var(--ink-2);font-size:14px}
.site-foot-links{display:flex;gap:16px;flex-wrap:wrap}
.site-foot-links a{color:var(--ink-2);text-decoration:none}
.site-foot-links a:hover{color:var(--ink)}

/* ---------- reklama ---------- */
.ads-slots{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.ads-slots li{display:flex;align-items:center;gap:16px;padding:14px 2px;flex-wrap:wrap}
.ads-slots li + li{border-top:1px solid var(--line)}
.ads-slot-main{display:flex;flex-direction:column;min-width:0;flex:1 1 14rem}
.ads-slot-price{text-align:right;display:flex;flex-direction:column;min-width:6.5rem}
.ads-slot-price strong{font-size:17px}
@media (max-width:560px){.ads-slot-price{text-align:left}}

.ads-steps{margin:0;padding-left:1.3em;color:var(--ink-2)}
.ads-steps li{margin:0 0 8px}

.ads-box{border:1px solid var(--line);border-radius:12px;padding:14px 16px;width:100%;
  background:color-mix(in srgb, var(--bg) 60%, transparent)}
.ads-box p{margin:4px 0 0}
.ads-price{font-size:22px;font-weight:650;letter-spacing:-.02em}
.ads-busy{list-style:none;margin:6px 0 0;padding:0;font-size:14px;color:var(--ink-2)}
.ads-busy li{font-variant-numeric:tabular-nums}

.ads-gateways{border:1px solid var(--line);border-radius:12px;padding:12px 14px;margin:0;
  display:flex;flex-direction:column;gap:10px}
.ads-gateways legend{padding:0 6px;font-size:14px;color:var(--ink-2)}
.ads-gateway{flex-direction:row !important;align-items:flex-start;gap:10px;cursor:pointer}
.ads-gateway input{width:auto;flex:none;margin-top:4px}
.ads-gateway span{display:flex;flex-direction:column;color:var(--ink)}

.ads-summary{border-collapse:collapse;width:100%;font-size:15px}
.ads-summary th{text-align:left;font-weight:500;color:var(--ink-2);padding:7px 16px 7px 0;
  white-space:nowrap;vertical-align:top;width:1%}
.ads-summary td{padding:7px 0}
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:14px}

.ads-kpi{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(8rem,1fr))}
.ads-kpi div{display:flex;flex-direction:column;gap:2px;color:var(--ink-2);font-size:14px}
.ads-kpi span{font-size:26px;font-weight:650;letter-spacing:-.02em;color:var(--ink);
  font-variant-numeric:tabular-nums}

.ads-days{border-collapse:collapse;width:100%;font-size:14.5px}
.ads-days th{text-align:left;font-weight:500;color:var(--ink-2);padding:6px 12px 6px 0;
  border-bottom:1px solid var(--line)}
.ads-days td{padding:6px 12px 6px 0;border-bottom:1px solid var(--line);
  font-variant-numeric:tabular-nums}
.ads-bar-cell{width:36%;min-width:4rem}
.ads-bar{display:block;height:8px;border-radius:4px;background:var(--accent);min-width:2px}
@media (max-width:560px){.ads-bar-cell{display:none}}