/* ================================================================
   AUDIT CYCLE PAGE — audit-cycle-page.css
   All classes prefixed acp-
   ================================================================ */

/* ===== HERO ===== */
.acp-hero{
  padding:140px 0 70px;position:relative;overflow:hidden;
  background:linear-gradient(175deg,#f8faff 0%,#fff 45%,#fafbfd 100%);
  text-align:center;
}
.acp-hero::before{
  content:'';position:absolute;inset:0;
  background:
    radial-gradient(ellipse 500px 400px at 20% 80%,rgba(37,99,235,.08),transparent),
    radial-gradient(ellipse 400px 350px at 80% 20%,rgba(99,102,241,.06),transparent);
}
.acp-hero-pill{display:inline-flex;align-items:center;gap:7px;padding:6px 18px;border-radius:100px;margin-bottom:20px;background:#fff;border:1px solid #e2e8f0;font-size:11px;font-weight:700;color:#2563eb;text-transform:uppercase;letter-spacing:.08em;box-shadow:0 1px 3px rgba(15,23,42,.04);position:relative}
.acp-hero-pill i{font-size:13px}
.acp-hero-h1{font-size:clamp(28px,4.5vw,48px);font-weight:800;line-height:1.12;margin-bottom:16px;letter-spacing:-.03em;color:#0f172a;position:relative}
.acp-hero-h1 em{font-style:normal;background:linear-gradient(135deg,#2563eb,#4f46e5);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.acp-hero-desc{font-size:15.5px;color:#64748b;line-height:1.75;max-width:560px;margin:0 auto;position:relative}

/* ===== SECTION HEADER ===== */
.acp-sh{text-align:center;margin-bottom:48px}
.acp-sh-tag{display:inline-flex;align-items:center;gap:6px;padding:5px 14px;border-radius:100px;margin-bottom:14px;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;background:#eff6ff;border:1px solid #dbeafe;color:#2563eb;box-shadow:0 1px 3px rgba(15,23,42,.04)}
.acp-sh h2{font-size:clamp(22px,3vw,32px);font-weight:800;color:#0f172a;margin-bottom:10px;letter-spacing:-.03em}
.acp-sh p{font-size:14.5px;color:#64748b;max-width:560px;margin:0 auto;line-height:1.7}

/* ===== CYCLE SECTION ===== */
.acp-cycle-sec{padding:80px 0;background:linear-gradient(175deg,#f8faff 0%,#fff 45%,#fafbfd 100%);position:relative}
.acp-cycle-sec::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 500px 450px at 85% 20%,rgba(37,99,235,.05),transparent),radial-gradient(ellipse 400px 400px at 10% 80%,rgba(99,102,241,.04),transparent),radial-gradient(ellipse 300px 300px at 50% 50%,rgba(16,185,129,.03),transparent);pointer-events:none}

/* ===== PHASE NAVIGATION ===== */
.acp-phase-nav{display:grid;grid-template-columns:repeat(5,1fr);gap:16px;position:relative;margin-bottom:40px}
.acp-phase-line-bg{position:absolute;top:36px;left:calc(10% + 8px);right:calc(10% + 8px);height:2px;background:#e2e8f0;z-index:0}
.acp-phase-line{position:absolute;top:36px;left:calc(10% + 8px);height:2px;background:linear-gradient(90deg,#2563eb,#60a5fa);border-radius:4px;z-index:0;transition:width .65s cubic-bezier(.4,0,.2,1);width:0}

.acp-phase{display:flex;flex-direction:column;align-items:center;text-align:center;cursor:pointer;position:relative;z-index:1;transition:all .3s}
.acp-phase:hover{transform:translateY(-3px)}

.acp-phase-circle{width:72px;height:72px;border-radius:50%;background:#fff;border:2px solid #e2e8f0;display:flex;align-items:center;justify-content:center;margin-bottom:12px;transition:all .4s;box-shadow:0 2px 8px rgba(15,23,42,.05);position:relative}
.acp-phase-circle svg{width:26px;height:26px;stroke:#94a3b8;stroke-width:1.5;fill:none;transition:.3s}

.acp-phase.active .acp-phase-circle{border-color:#2563eb;background:#eff6ff;box-shadow:0 0 0 5px rgba(37,99,235,.1),0 8px 24px rgba(37,99,235,.1)}
.acp-phase.active .acp-phase-circle svg{stroke:#1d4ed8}
.acp-phase.done .acp-phase-circle{border-color:#bfdbfe;background:#eff6ff}
.acp-phase.done .acp-phase-circle svg{stroke:#2563eb}

.acp-phase-num{position:absolute;top:-4px;right:-4px;width:22px;height:22px;border-radius:50%;background:#2563eb;color:#fff;font-size:10px;font-weight:800;display:flex;align-items:center;justify-content:center;opacity:0;transform:scale(0);transition:all .35s cubic-bezier(.34,1.56,.64,1)}
.acp-phase.active .acp-phase-num,.acp-phase.done .acp-phase-num{opacity:1;transform:scale(1)}
.acp-phase.done .acp-phase-num{background:#60a5fa}

.acp-phase h4{font-size:14px;font-weight:700;color:#0f172a;transition:color .3s}
.acp-phase.active h4{color:#1d4ed8}
.acp-phase.done h4{color:#1e3a8a}

/* ===== DETAIL PANEL ===== */
.acp-detail{background:#fff;border:1.5px solid #e2e8f0;border-radius:20px;box-shadow:0 8px 24px rgba(15,23,42,.07);overflow:hidden}

/* Header */
.acp-detail-header{padding:32px 36px 24px;border-bottom:1px solid #f0f1f5}
.acp-dh-top{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;margin-bottom:16px}
.acp-dh-left{flex:1}
.acp-dt-badge{display:inline-flex;align-items:center;gap:6px;padding:5px 14px;border-radius:100px;margin-bottom:12px;background:#eff6ff;border:1px solid #dbeafe;font-size:10px;font-weight:700;color:#2563eb;text-transform:uppercase;letter-spacing:.06em}
.acp-dt-badge i{font-size:11px}
.acp-detail-header h2{font-size:24px;font-weight:800;color:#0f172a;margin-bottom:8px;letter-spacing:-.02em}
.acp-detail-header .acp-dt-desc{font-size:14px;color:#64748b;line-height:1.7;max-width:640px}

/* Progress indicator */
.acp-dh-progress{flex-shrink:0;text-align:center;min-width:100px}
.acp-prog-ring{position:relative;width:72px;height:72px;margin:0 auto 6px}
.acp-prog-ring svg{width:100%;height:100%;transform:rotate(-90deg)}
.acp-prog-track{fill:none;stroke:#f0f1f5;stroke-width:5}
.acp-prog-fill{fill:none;stroke:#2563eb;stroke-width:5;stroke-linecap:round;transition:stroke-dashoffset .8s ease}
.acp-prog-center{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:16px;font-weight:800;color:#0f172a}
.acp-prog-label{font-size:9px;color:#94a3b8;text-transform:uppercase;letter-spacing:.06em;font-weight:600}

/* Knowledge docs */
.acp-dt-knowledge{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.acp-dt-doc{display:inline-flex;align-items:center;gap:5px;padding:5px 12px;border-radius:100px;background:#f1f5f9;border:1px solid #e2e8f0;font-size:10.5px;font-weight:600;color:#334155}
.acp-dt-doc i{font-size:10px;color:#2563eb}

/* Tabs */
.acp-tabs{display:flex;gap:0;border-bottom:1.5px solid #e2e8f0;padding:0 36px;background:#fafbfd}
.acp-tab{padding:14px 24px;font-size:12.5px;font-weight:600;color:#64748b;background:none;border:none;cursor:pointer;position:relative;display:flex;align-items:center;gap:7px;transition:color .2s;font-family:inherit}
.acp-tab i{font-size:13px}
.acp-tab:hover{color:#0f172a}
.acp-tab.active{color:#2563eb}
.acp-tab.active::after{content:'';position:absolute;bottom:-1.5px;left:0;right:0;height:2px;background:#2563eb;border-radius:2px 2px 0 0}

/* Tab Content */
.acp-tab-content{padding:28px 36px;min-height:200px}

/* Agents tab — numbered cards */
.acp-agent-list{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.acp-agent-card{display:flex;align-items:flex-start;gap:12px;padding:16px;background:#f8faff;border:1px solid #eef2ff;border-radius:12px;transition:all .2s}
.acp-agent-card:hover{background:#eff6ff;border-color:#dbeafe}
.acp-agent-num{width:28px;height:28px;border-radius:50%;background:#2563eb;color:#fff;font-size:11px;font-weight:800;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.acp-agent-card p{font-size:12.5px;color:#334155;line-height:1.55}

/* Tools tab — grid of tool cards */
.acp-tools-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px}
.acp-tool-card{display:flex;align-items:center;gap:10px;padding:14px 16px;background:#f8faff;border:1px solid #eef2ff;border-radius:12px;transition:all .2s}
.acp-tool-card:hover{background:#eff6ff;border-color:#dbeafe;transform:translateY(-2px);box-shadow:0 4px 12px rgba(37,99,235,.08)}
.acp-tool-ico{width:36px;height:36px;border-radius:8px;background:#eff6ff;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:14px;color:#2563eb}
.acp-tool-card h4{font-size:12.5px;font-weight:700;color:#0f172a}

/* Humans tab — checklist style */
.acp-human-list{display:flex;flex-direction:column;gap:10px;max-width:700px}
.acp-human-card{display:flex;align-items:flex-start;gap:12px;padding:14px 16px;background:#fffbeb;border:1px solid #fef3c7;border-radius:12px}
.acp-human-ico{width:28px;height:28px;border-radius:8px;background:#fef3c7;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:12px;color:#d97706}
.acp-human-card p{font-size:12.5px;color:#334155;line-height:1.55}

/* Footer — next phase */
.acp-detail-footer{padding:16px 36px;border-top:1px solid #f0f1f5;background:#fafbfd}
.acp-next-btn{display:flex;align-items:center;gap:12px;padding:12px 16px;background:#fff;border:1.5px solid #e2e8f0;border-radius:12px;cursor:pointer;transition:all .3s;width:fit-content}
.acp-next-btn:hover{background:#eff6ff;border-color:#bfdbfe}
.acp-next-ico{width:32px;height:32px;border-radius:50%;background:#2563eb;color:#fff;display:flex;align-items:center;justify-content:center;font-size:12px;flex-shrink:0}
.acp-next-text span{font-size:9px;color:#64748b;text-transform:uppercase;letter-spacing:.06em;font-weight:600}
.acp-next-text strong{display:block;font-size:12.5px;color:#0f172a;font-weight:700}
.acp-next-chevron{margin-left:8px;color:#94a3b8;font-size:13px}

/* ===== CTA ===== */
.acp-cta-sec{padding:80px 0;background:#f1f5f9}
.acp-cta-card{background:linear-gradient(135deg,#0f172a,#1e293b);border-radius:20px;padding:56px 48px;text-align:center;color:#fff;box-shadow:0 20px 60px rgba(15,23,42,.15);position:relative;overflow:hidden}
.acp-cta-card::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 30% 50%,rgba(37,99,235,.1),transparent 60%),radial-gradient(circle at 70% 50%,rgba(99,102,241,.08),transparent 60%)}
.acp-cta-card h2{font-size:clamp(20px,3vw,28px);font-weight:800;margin-bottom:10px;position:relative;letter-spacing:-.02em}
.acp-cta-card p{font-size:14.5px;color:rgba(255,255,255,.55);max-width:480px;margin:0 auto 28px;line-height:1.7;position:relative}
.acp-cta-btns{display:flex;gap:12px;justify-content:center;position:relative}
.acp-btn-p{padding:12px 28px;border-radius:8px;background:#2563eb;color:#fff;font-size:13.5px;font-weight:700;transition:all .25s;border:none;cursor:pointer}
.acp-btn-p:hover{background:#1d4ed8;transform:translateY(-1px)}
.acp-btn-o{padding:12px 28px;border-radius:8px;background:transparent;color:rgba(255,255,255,.7);font-size:13.5px;font-weight:600;border:1.5px solid rgba(255,255,255,.15);transition:all .25s;cursor:pointer}
.acp-btn-o:hover{border-color:rgba(255,255,255,.35);color:#fff}

/* ===== RESPONSIVE ===== */
@media(max-width:920px){
  .acp-phase-nav{grid-template-columns:repeat(5,1fr);gap:8px}
  .acp-phase-circle{width:56px;height:56px}
  .acp-phase-circle svg{width:20px;height:20px}
  .acp-phase h4{font-size:11px}
  .acp-agent-list{grid-template-columns:1fr}
  .acp-tools-grid{grid-template-columns:repeat(2,1fr)}
  .acp-dh-top{flex-direction:column}
}
@media(max-width:600px){
  .acp-phase-nav{grid-template-columns:repeat(5,1fr);gap:4px}
  .acp-phase-line-bg,.acp-phase-line{display:none}
  .acp-phase-circle{width:48px;height:48px}
  .acp-phase-circle svg{width:18px;height:18px}
  .acp-phase-num{width:18px;height:18px;font-size:9px}
  .acp-phase h4{font-size:10px}
  .acp-detail-header{padding:20px}
  .acp-tabs{padding:0 16px;overflow-x:auto}
  .acp-tab{padding:12px 16px;font-size:11px;white-space:nowrap}
  .acp-tab-content{padding:20px}
  .acp-detail-footer{padding:14px 20px}
  .acp-tools-grid{grid-template-columns:1fr 1fr}
  .acp-cta-card{padding:40px 24px}
  .acp-cta-btns{flex-direction:column;align-items:center}
}