/* SZKIC Refero 11.11.2026: kierunek "operacje pod kontrolą".
   Fundament: Ameba (refero.design style 8a02d0fb), detale: Linear (3affd07f), n8n /ai-agents (hero z przebiegiem).
   11.11 wieczór: układ home ze szkicu UX Pilot (karta ceny, usługi, proces, zasady, stopka),
   przy zachowaniu tokenów i copy Refero. Ładowany jako ostatni arkusz. */
:root{
  --cta:#2563eb;--cta-h:#1d4ed8;             /* tylko główne akcje i linki */
  --edge:rgba(255,255,255,.08);--edge2:rgba(255,255,255,.15);
  --glass:rgba(255,255,255,.05);
  --mono:ui-monospace,"SFMono-Regular","JetBrains Mono",Menlo,Consolas,monospace;
  --lav:#eef0f8;--lav-rule:#dfe2ef;--ink:#0b1033;--ink-body:#454a63;
  --sky:#93c5fd;--mint:#6ee7b7;
}
/* Typografia: spokojniejsze nagłówki, bez gradientowych liter */
h1,h2,h3{font-weight:600;text-wrap:balance}
h2{letter-spacing:-.025em;font-size:clamp(1.75rem,3vw,2.4rem)}
.hero h1{font-weight:650;letter-spacing:-.032em;line-height:1.08}
.grad{background:none;-webkit-background-clip:initial;background-clip:initial;color:inherit;-webkit-text-fill-color:currentColor}
.lead{color:#b4bccb;line-height:1.6}
p{text-wrap:pretty}
.eyebrow,.tag,.proc-name,.ptest-score{font-family:var(--mono);font-weight:500;font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;color:var(--sky)}
/* Pigułka statusu: mono, szkło, miętowa kropka */
.badge{font-family:var(--mono);font-size:.74rem;letter-spacing:.07em;text-transform:uppercase;font-weight:500;color:#e5e7eb;background:var(--glass);border:1px solid var(--edge2);padding:7px 14px}
.dot{background:var(--mint);box-shadow:none}
/* Przyciski: prostokąt 8px, pełny niebieski z kontrastem AA, bez poświaty */
.btn{border-radius:8px;min-height:48px;padding:12px 24px;transition:background .15s,border-color .15s,opacity .15s}
.btn-sm{min-height:40px;padding:8px 16px}
.btn-primary{background:var(--cta);box-shadow:none;color:#fff}
.btn-primary:hover{background:var(--cta-h);transform:none;box-shadow:none}
.btn-ghost{background:var(--glass);border-color:var(--edge2)}
.btn-ghost:hover{background:rgba(255,255,255,.09)}
.btn:focus-visible,a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid #60a5fa;outline-offset:3px}
/* Karty: cienka krawędź zamiast ciężkich ramek */
.card,.steps li{background:rgba(15,23,42,.55);border-color:var(--edge);border-radius:16px}
.card p{font-size:.98rem}
.feat p,.rule p{color:#a7afbd}
.fi{border-radius:10px}
.sec{padding:96px 0}
.sec.alt{background:#0a0f1e;border-color:var(--edge)}
.sec-head p{font-size:1.05rem}
@media (max-width:860px){.sec{padding:64px 0}}

/* ===== HOME: hero z przebiegiem (n8n /ai-agents + Ameba capability stage) ===== */
.hero.hero-split{text-align:left;padding:72px 0 0}
.hero.hero-split::before{left:72%;top:-120px;width:820px;height:620px;background:radial-gradient(closest-side,rgba(37,99,235,.22),rgba(139,92,246,.10),transparent)}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center}
.hero-split h1{margin:0 0 20px;max-width:17ch;font-size:clamp(2.2rem,4.6vw,3.6rem)}
.hero-split .lead{margin:0;max-width:52ch}
.hero-split .cta-row{justify-content:flex-start;margin:32px 0 18px}
.hero-note{font-size:.9rem;color:#a7afbd}
.hero-note a{color:var(--sky);text-decoration:underline;text-underline-offset:3px}
.inst{position:relative;background:linear-gradient(180deg,#0d1427,#0a0f1e);border:1px solid var(--edge2);border-radius:16px;padding:18px;box-shadow:0 30px 60px -24px rgba(2,6,23,.9),0 0 0 1px rgba(37,99,235,.08)}
.inst-top{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:2px 4px 14px;border-bottom:1px solid var(--edge);margin-bottom:14px;font-family:var(--mono);font-size:.72rem;letter-spacing:.07em;text-transform:uppercase;color:#a7afbd}
.inst-top b{color:#e5e7eb;font-weight:500}
.inst-steps{list-style:none;display:grid;gap:0;margin:0;padding:0}
.inst-steps li{position:relative;display:grid;grid-template-columns:36px 1fr auto;gap:12px;align-items:start;padding:12px 6px}
.inst-steps li+li::before{content:"";position:absolute;left:23px;top:-10px;height:22px;width:1px;background:linear-gradient(var(--edge2),rgba(37,99,235,.6))}
.inst-ic{display:grid;place-items:center;width:36px;height:36px;border-radius:10px;background:rgba(255,255,255,.04);border:1px solid var(--edge2);color:var(--sky)}
.inst-ic svg{width:18px;height:18px}
.inst-steps strong{display:block;color:#f3f4f6;font-weight:600;font-size:.95rem;line-height:1.3}
.inst-steps small{display:block;color:#9aa3b2;font-size:.84rem;line-height:1.45;margin-top:2px}
.chip{font-family:var(--mono);font-size:.66rem;letter-spacing:.07em;text-transform:uppercase;padding:4px 8px;border-radius:999px;border:1px solid var(--edge2);color:#cbd5e1;white-space:nowrap;margin-top:6px}
.chip.ai{border-color:rgba(139,92,246,.55);color:#ddd6fe}
.chip.you{border-color:rgba(110,231,183,.5);color:var(--mint)}
.inst-steps li.is-human{background:rgba(110,231,183,.06);border:1px solid rgba(110,231,183,.25);border-radius:12px;margin-top:4px}
.inst-foot{margin-top:12px;padding:12px 6px 2px;border-top:1px solid var(--edge);font-size:.82rem;color:#9aa3b2}
.proof-row{margin-top:64px;padding:22px 0 26px;border-top:1px solid var(--edge);display:flex;flex-wrap:wrap;align-items:center;gap:10px 26px}
.proof-row .lbl{font-family:var(--mono);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:#9aa3b2;margin-right:6px}
.proof-row a{color:#d1d5db;font-weight:500;font-size:.95rem;border-bottom:1px solid transparent}
.proof-row a:hover{color:#fff;border-color:var(--edge2)}
@media (max-width:960px){.hero-grid{grid-template-columns:1fr;gap:40px}.hero-split h1{max-width:none}}
@media (max-width:600px){.hero.hero-split{padding-top:40px}.hero-split .cta-row .btn{width:100%}.inst-steps li{grid-template-columns:32px 1fr}.inst-steps .chip{grid-column:2;justify-self:start;margin-top:0}.inst-ic{width:32px;height:32px}.inst-steps li+li::before{left:21px}.proof-row{margin-top:44px;gap:8px 18px}}

/* ===== Jasne pasmo dowodów (Ameba: lavender proof band) ===== */
.proof-band{background:var(--lav);color:var(--ink-body);border-top:1px solid var(--lav-rule);border-bottom:1px solid var(--lav-rule)}
.proof-band h2,.proof-band h3{color:var(--ink)}
.proof-band .sec-head p,.proof-band .feat p{color:var(--ink-body)}
.proof-band .eyebrow{color:#1d4ed8}
.proof-band .card{background:#fff;border:1px solid var(--lav-rule);box-shadow:0 1px 2px rgba(11,16,51,.05),0 18px 40px -28px rgba(11,16,51,.35)}
.proof-band .feat a{color:#1d4ed8;font-weight:600}
.proof-band .feat a:hover{color:var(--ink)}
.proof-band .fi.b{background:#dbeafe;color:#1e40af}.proof-band .fi.p{background:#ede9fe;color:#5b21b6}.proof-band .fi.g{background:#d1fae5;color:#065f46}
.proof-band .btn-ghost{background:#fff;color:var(--ink);border-color:#c7cbe0}
.proof-band .btn-ghost:hover{background:#f8f9fd}
.proof-band .card.feat:hover{border-color:#b8bfdc}

/* ===== Zamknięcie: pole kropek w rogach (Ameba: dotted closing invitation) ===== */
.contact{position:relative;overflow:hidden;background:#050a1a}
.contact::before,.contact::after{content:"";position:absolute;width:420px;height:300px;pointer-events:none;background:radial-gradient(circle,rgba(37,99,235,.55) 1.4px,transparent 1.7px) 0 0/14px 14px;opacity:.5}
.contact::before{left:0;top:0;-webkit-mask-image:radial-gradient(ellipse at 0 0,#000 0%,transparent 70%);mask-image:radial-gradient(ellipse at 0 0,#000 0%,transparent 70%)}
.contact::after{right:0;bottom:0;-webkit-mask-image:radial-gradient(ellipse at 100% 100%,#000 0%,transparent 70%);mask-image:radial-gradient(ellipse at 100% 100%,#000 0%,transparent 70%)}
.contact>.wrap{position:relative;z-index:1}

/* ===== Podstrony zastosowań: hero z przebiegiem, mocniejsze przed i po ===== */
@media (min-width:961px){.uc-hero .hero-grid{grid-template-columns:1.1fr .9fr}}
.uc-hero .crumbs{margin-bottom:18px}
.ba .card{padding:28px}
.ba .ba-before{background:rgba(15,23,42,.35);border:1px dashed rgba(245,158,11,.35)}
.ba .ba-before ol{color:#a7afbd}
.ba .ba-after{background:linear-gradient(180deg,rgba(37,99,235,.10),rgba(15,23,42,.6) 60%);border:1px solid rgba(96,165,250,.45)}
.ba .ba-after h3{color:#fff}
.ba-before .proc-name{color:#fcd34d}.ba-after .proc-name{color:var(--mint)}
.case-box{border-color:rgba(96,165,250,.35)}

/* ===== Audyt AI: formularz zaraz pod hero ===== */
.audyt-hero-note{margin-top:14px}
/* Jedna szerokość treści na wszystkich stronach (audyt-ai.css miał .wrap 100%) */
.wrap{max-width:min(1200px,100%)}
@media (max-width:600px){.badge{font-size:.68rem;letter-spacing:.04em;padding:6px 12px}}


/* ===== HOME: karta ceny w dwóch połówkach (układ UX Pilot, styl Refero) ===== */
#sprint, #cena, #etapy, #proces, #zasady, #panel-info, #uslugi, #strony, #wycena, #kontakt{scroll-margin-top:88px}
.price-split{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--edge2);border-radius:16px;overflow:hidden;background:linear-gradient(180deg,#0d1427,#0a0f1e);box-shadow:0 30px 60px -24px rgba(2,6,23,.9),0 0 0 1px rgba(37,99,235,.08)}
.price-split-l,.price-split-r{padding:40px 36px}
.price-split-l{border-right:1px solid var(--edge)}
.price-split .eyebrow{margin:0 0 10px;color:var(--sky)}
.price-split .big{font-size:clamp(2.2rem,5vw,3.1rem);font-weight:650;color:#fff;letter-spacing:-.03em;line-height:1.08;margin:0 0 16px}
.price-split .big span{font-size:.42em;font-weight:600;color:#9aa3b2}
.price-split .ticks{margin:8px 0 28px}
.price-split .ticks li{color:#d1d5db}
.price-split .btn{width:100%}
.pack-title{margin:0 0 22px;font-size:1.15rem;font-weight:600;color:#f3f4f6}
.pack-grid{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:18px 24px;margin:0;padding:0}
.pack-grid strong{display:block;color:#f3f4f6;font-weight:600;font-size:.95rem;margin-bottom:2px}
.pack-grid span{display:block;color:#9aa3b2;font-size:.84rem;line-height:1.45}
.pack-note{margin:28px 0 0;padding:14px 16px;border:1px dashed var(--edge2);border-radius:12px;font-size:.82rem;color:#9aa3b2;line-height:1.5}
.price-compare{margin:28px 0 0;text-align:center;color:#9aa3b2;font-size:.95rem;line-height:1.5}
.price-compare strong{color:#e5e7eb;font-weight:600}
@media (max-width:860px){
  .price-split{grid-template-columns:1fr}
  .price-split-l{border-right:0;border-bottom:1px solid var(--edge)}
  .price-split-l,.price-split-r{padding:28px 22px}
  .pack-grid{grid-template-columns:1fr}
}

/* ===== HOME: dwa duże kafelki usług + zwarta lista ===== */
.svc-lead{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:28px;align-items:stretch}
.svc-lead-card{display:flex;flex-direction:column;padding:32px 28px;height:100%}
.svc-lead-card h3{font-size:1.35rem}
.svc-lead-card .pr{margin-top:auto;padding-top:16px;font-size:1.15rem;color:var(--mint);font-weight:600}
.svc-lead-card .btn{margin-top:18px;align-self:flex-start}
.svc-list{list-style:none;margin:0;padding:0;border:1px solid var(--edge);border-radius:16px;overflow:hidden;background:rgba(15,23,42,.35)}
.svc-list li{display:grid;grid-template-columns:1fr auto;gap:24px;align-items:center;padding:20px 24px;border-top:1px solid var(--edge)}
.svc-list li:first-child{border-top:0}
.svc-list h3{margin:0 0 4px;font-size:1.02rem;color:#f3f4f6}
.svc-list p{margin:0;color:#9aa3b2;font-size:.92rem}
.svc-list .pr{margin:0;padding:0;color:var(--mint);font-weight:600;white-space:nowrap;font-size:.95rem}
.svc-cta{margin-top:20px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 24px;padding:24px 28px}
.svc-cta h3{margin:0 0 4px}
.svc-cta p{margin:0;color:#9aa3b2}
@media (max-width:860px){
  .svc-lead{grid-template-columns:1fr}
  .svc-lead-card .btn{width:100%}
  .svc-list li{grid-template-columns:1fr;gap:8px;align-items:start}
  .svc-cta{flex-direction:column;align-items:stretch}
  .svc-cta .cta-pair .btn{flex:1}
}

/* ===== HOME: jeden proces (etapy sprintu + nasz proces) ===== */
.flow-pre{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:0 0 8px;padding:0}
.flow-pre li{display:grid;grid-template-columns:36px 1fr;gap:14px;align-items:start;padding:22px 22px;border:1px solid var(--edge);border-radius:16px;background:rgba(15,23,42,.55)}
.flow-pre .n,.steps .n{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;border:1px solid rgba(37,99,235,.55);color:#fff;font-weight:600;font-family:var(--mono);font-size:.8rem;background:rgba(37,99,235,.12)}
.flow-pre h3,.steps h3{margin:0 0 6px;font-size:1.02rem}
.flow-pre p{margin:0;color:#9aa3b2;font-size:.9rem}
.flow-sub{font-family:var(--mono);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--sky);font-weight:500;margin:32px 0 14px}
.steps.compact{gap:12px}
.steps.compact li{padding:20px 16px}
.steps.compact p{font-size:.86rem}
.flow-after{margin:24px 0 0;text-align:center;color:#9aa3b2;font-size:.95rem;line-height:1.5}
@media (max-width:860px){
  .flow-pre{grid-template-columns:1fr}
  .steps.compact{grid-template-columns:1fr}
}

/* ===== HOME: zasady + panel w jednej sekcji ===== */
.rules-row{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:0 0 36px;padding:0;list-style:none}
.rules-row .card{padding:20px 18px}
.rules-row h3{margin:8px 0 6px;font-size:1rem}
.rules-row p{margin:0;color:#9aa3b2;font-size:.88rem}
.panel-feats{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:0 32px;margin:0;padding:0;border-top:1px solid var(--edge)}
.panel-feats li{display:grid;grid-template-columns:36px 1fr;gap:14px;align-items:start;padding:18px 4px;border-bottom:1px solid var(--edge)}
.panel-feats h3{margin:0 0 4px;font-size:.98rem}
.panel-feats p{margin:0;color:#9aa3b2;font-size:.88rem}
@media (max-width:1100px){.rules-row{grid-template-columns:repeat(2,1fr)}}
@media (max-width:600px){
  .rules-row{grid-template-columns:1fr}
  .panel-feats{grid-template-columns:1fr}
}

/* ===== Stopka w 4 kolumnach, jasna po ciemnym zamknięciu (Ameba) ===== */
.foot{background:var(--lav);color:var(--ink-body);border-top:1px solid var(--lav-rule);padding:56px 0 0;font-size:.9rem}
.foot .logo{color:var(--ink);margin-bottom:14px}
.foot a{color:var(--ink)}
.foot a:hover,.foot .linkbtn:hover{color:#1d4ed8}
.foot-brand{margin-bottom:36px;max-width:52ch}
.foot-brand p{margin:0;color:var(--ink-body);line-height:1.55}
.foot-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:32px 40px;padding-bottom:40px}
.foot-grid h3{font-family:var(--mono);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;font-weight:500;color:#1d4ed8;margin:0 0 14px}
.foot-grid ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.foot-grid li{margin:0}
.foot-grid p{margin:0 0 8px;color:var(--ink-body)}
.foot-legal{border-top:1px solid var(--lav-rule);padding:16px 0 20px;color:#5b6080;font-size:.82rem}
.foot-legal p{margin:0}
@media (max-width:860px){.foot{padding-top:40px}.foot-grid{grid-template-columns:1fr 1fr;gap:28px 24px}}
@media (max-width:600px){.foot-grid{grid-template-columns:1fr}}
