.section { padding: var(--section-space) 0; }.soft-section { background: var(--canvas); }.dark-section { color: #fff; background: var(--navy); }.dark-section h2 { color:#fff; }.dark-section .section-heading p { color:#a9b8c6; }
.hero { position: relative; min-height: 760px; padding: 10rem 0 6rem; overflow: hidden; background: radial-gradient(circle at 80% 10%, rgba(41,184,211,.12), transparent 25%), linear-gradient(180deg,#f7fbff 0%,#fff 80%); }
.hero::before { position:absolute; inset:0; content:""; opacity:.32; background-image:linear-gradient(rgba(15,61,97,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(15,61,97,.06) 1px,transparent 1px); background-size:48px 48px; mask-image:linear-gradient(to bottom,#000,transparent 76%); }
.hero .container { position:relative; z-index:1; }.hero h1 span { color: var(--blue); }.hero-copy { max-width: 710px; margin: 1.7rem 0 2rem; font-size: clamp(1.06rem,2vw,1.25rem); }.hero-actions { display:flex; flex-wrap:wrap; gap:.75rem; }.hero-note { display:flex; align-items:center; gap:.6rem; margin-top:1.5rem; color:#718091; font-size:.78rem; }.status-dot { width:7px; height:7px; border-radius:50%; background:var(--success); box-shadow:0 0 0 4px rgba(19,138,104,.12); }
.process-visual { padding:1rem; border:1px solid rgba(10,23,36,.1); border-radius:var(--radius-lg); background:rgba(255,255,255,.8); box-shadow:0 35px 100px rgba(7,27,46,.14); backdrop-filter:blur(12px); }.visual-top { display:flex; align-items:center; justify-content:space-between; padding:.35rem .35rem 1rem; color:#536476; font-size:.67rem; font-weight:650; text-transform:uppercase; letter-spacing:.08em; }.live-pill { padding:.25rem .55rem; color:var(--success); border-radius:20px; background:#e8f7f2; font-size:.56rem; }.fragment-stack { display:grid; gap:.55rem; }.fragment { display:grid; grid-template-columns:36px 1fr auto; gap:.8rem; align-items:center; padding:.65rem .8rem; border:1px solid var(--line); border-radius:10px; background:#fff; box-shadow:0 5px 18px rgba(7,27,46,.04); }.file-icon { display:grid; width:32px; height:32px; place-items:center; color:#196b43; border-radius:7px; background:#e5f5ec; font-size:.65rem; font-weight:800; }.file-icon.mail { color:#446c9e; background:#eaf2fc; }.file-icon.doc { color:#995f25; background:#fff1df; }.fragment b,.fragment small { display:block; }.fragment b { font-size:.7rem; }.fragment small { color:#8491a0; font-size:.55rem; }.fragment em { color:#718091; font-size:.65rem; font-style:normal; }.flow-line { display:grid; grid-template-columns:1fr auto 1fr; gap:.7rem; align-items:center; margin:.9rem 0; color:var(--blue); font-size:.52rem; letter-spacing:.12em; }.flow-line span { height:1px; background:linear-gradient(90deg,transparent,#a9c7ed); }.flow-line span:last-child { background:linear-gradient(90deg,#a9c7ed,transparent); }.system-card { padding:1rem; color:#eaf3fa; border-radius:14px; background:var(--navy); }.system-head { display:flex; align-items:center; gap:.7rem; padding-bottom:.8rem; border-bottom:1px solid rgba(255,255,255,.12); font-size:.65rem; }.system-head span { display:flex; gap:3px; }.system-head i { width:5px; height:5px; border-radius:50%; background:#6a8399; }.system-head i:nth-child(2){ background:var(--cyan); }.kpi-grid { display:grid; grid-template-columns:1fr 1fr; gap:.6rem; margin:1rem 0; }.kpi-grid>div { padding:.7rem; border:1px solid rgba(255,255,255,.1); border-radius:9px; background:rgba(255,255,255,.05); }.kpi-grid small,.kpi-grid strong,.kpi-grid span { display:block; }.kpi-grid small { color:#8fa5b8; font-size:.52rem; }.kpi-grid strong { margin:.15rem 0; font-size:1.3rem; }.kpi-grid span { color:#899dad; font-size:.5rem; }.kpi-grid .trend { color:#5cceb0; }.bars { display:flex; height:62px; align-items:end; gap:8px; padding:.4rem .2rem 0; border-bottom:1px solid rgba(255,255,255,.12); }.bars i { width:100%; height:var(--h); border-radius:3px 3px 0 0; background:linear-gradient(#39c0db,#0e75a9); }
.problem-section { background:#fff; }.problem-flow { display:grid; grid-template-columns:1fr auto 1fr auto 1fr; align-items:stretch; }.problem-flow article { padding:2rem; border:1px solid var(--line); border-radius:var(--radius); }.problem-flow h3 { margin:1.4rem 0; }.flow-arrow { display:grid; width:60px; place-items:center; color:#9cabb9; font-size:1.3rem; }.step-number { display:grid; width:38px; height:38px; place-items:center; color:var(--blue); border-radius:10px; background:#eaf2fc; font-size:.7rem; font-weight:750; }.step-number.danger { color:var(--danger); background:#fcebea; }.step-number.success { color:#fff; background:var(--success); }.problem-flow .accent-card { color:#fff; border-color:var(--navy); background:var(--navy); box-shadow:var(--shadow); }.accent-card h3 { color:#fff; }.check-list { display:grid; gap:.65rem; margin:0; padding:0; list-style:none; }.check-list li { position:relative; padding-left:1.4rem; color:#bdd0de; font-size:.85rem; }.check-list li::before { position:absolute; left:0; content:"✓"; color:#5ed5b4; }.muted-list li { color:#637486; }.muted-list li::before { content:"—"; color:#9ba8b5; }
.capability-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }.vertical-cloud { display:flex; max-width:1000px; flex-wrap:wrap; justify-content:center; gap:.8rem; margin:0 auto; }.vertical-cloud span { padding:.8rem 1.15rem; border:1px solid var(--line); border-radius:50px; color:#435466; background:#fff; box-shadow:0 6px 20px rgba(7,27,46,.04); font-size:.88rem; transition:color .25s,border-color .25s,transform .25s; }.vertical-cloud span:hover { transform:translateY(-2px); color:var(--blue); border-color:#abc9ee; }
.solutions-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }.section-action { display:flex; align-items:center; justify-content:space-between; gap:2rem; margin-top:3rem; padding-top:2rem; border-top:1px solid var(--line-dark); }.section-action p { margin:0; color:#9fb0c0; }
.method-timeline { display:grid; grid-template-columns:repeat(6,1fr); margin:0; padding:0; list-style:none; }.method-timeline li { position:relative; padding:0 1rem 0 0; }.method-timeline li::before { position:absolute; z-index:-1; top:18px; left:0; width:100%; height:1px; content:""; background:var(--line); }.method-timeline li:last-child::before { width:20px; }.method-timeline li>span { display:grid; width:38px; height:38px; place-items:center; margin-bottom:1.4rem; color:var(--blue); border:1px solid #bbd3f0; border-radius:50%; background:#fff; font-size:.65rem; font-weight:750; }.method-timeline h3 { font-size:1rem; }.method-timeline p { font-size:.79rem; line-height:1.5; }
.outcomes-section { background:linear-gradient(135deg,#f3f7fb,#f8fbfd); }.outcomes-section .section-heading { margin:0; }.outcome-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:.7rem; }.outcome-grid span { position:relative; padding:1.25rem 1.25rem 1.25rem 3rem; border:1px solid var(--line); border-radius:12px; background:#fff; font-weight:620; box-shadow:var(--shadow-sm); }.outcome-grid span::before { position:absolute; top:50%; left:1.25rem; color:var(--success); content:"✓"; transform:translateY(-50%); }
.evidence-board { display:grid; min-height:500px; grid-template-columns:190px 1fr; overflow:hidden; border:1px solid #cad7e2; border-radius:var(--radius-lg); background:#f7f9fb; box-shadow:var(--shadow); }.board-sidebar { display:flex; flex-direction:column; gap:.35rem; padding:1.6rem 1rem; color:#92a5b7; background:var(--navy); }.board-sidebar b { margin:0 0 2rem .6rem; color:#fff; font-size:.72rem; letter-spacing:.15em; }.board-sidebar span { padding:.65rem .75rem; border-radius:7px; font-size:.7rem; }.board-sidebar .active { color:#fff; background:rgba(41,184,211,.17); }.board-main { padding:2rem; }.board-head { display:flex; justify-content:space-between; align-items:start; }.board-head small { color:var(--blue); font-size:.58rem; font-weight:750; letter-spacing:.1em; }.board-head h3 { margin-top:.35rem; font-size:1.4rem; }.board-head>span { padding:.35rem .6rem; color:var(--success); border-radius:20px; background:#e8f5f1; font-size:.58rem; }.board-kpis { display:grid; grid-template-columns:repeat(3,1fr); gap:.8rem; margin:1.3rem 0; }.board-kpis>div { padding:1rem; border:1px solid var(--line); border-radius:10px; background:#fff; }.board-kpis small,.board-kpis strong,.board-kpis em { display:block; }.board-kpis small { color:#738292; font-size:.63rem; }.board-kpis strong { margin:.25rem 0; font-size:1.5rem; }.board-kpis em { color:var(--success); font-size:.56rem; font-style:normal; }.chart-area { padding:1.1rem; border:1px solid var(--line); border-radius:12px; background:#fff; }.chart-title { display:flex; justify-content:space-between; font-size:.65rem; }.chart-title span { color:#8794a1; }.chart-area svg { margin-top:.5rem; }.chart-grid { fill:none; stroke:#e9edf1; stroke-width:1; }.area { fill:url(#area); }.chart-line { fill:none; stroke:var(--cyan); stroke-width:3; }.proof-tags { display:flex; flex-wrap:wrap; gap:.4rem; margin-top:.6rem; }.proof-tags span { padding:.36rem .6rem; color:#536577; border:1px solid var(--line); border-radius:20px; background:#fff; font-size:.56rem; }
.contact-cta { padding:0 0 var(--section-space); }.cta-panel { display:grid; grid-template-columns:1fr auto; gap:4rem; align-items:center; padding:clamp(2.3rem,5vw,4.5rem); color:#fff; border-radius:var(--radius-lg); background:radial-gradient(circle at 85% 15%,rgba(41,184,211,.3),transparent 28%),var(--navy); box-shadow:var(--shadow); }.cta-panel h2 { max-width:720px; color:#fff; }.cta-panel p { max-width:720px; margin:0; color:#adc0ce; }.cta-panel .btn { min-width:235px; }
.site-footer { padding:4rem 0 1.5rem; color:#a9b9c7; background:#061522; }.footer-top { display:flex; align-items:start; justify-content:space-between; gap:3rem; padding-bottom:2.5rem; border-bottom:1px solid var(--line-dark); }.light-brand { color:#fff; }.footer-top p { max-width:440px; margin:0; color:#8fa2b2; font-size:.9rem; }.footer-bottom { display:grid; grid-template-columns:1fr auto; gap:3rem; padding:2.5rem 0; }.footer-bottom>div { display:flex; flex-direction:column; gap:.55rem; font-size:.75rem; }.footer-bottom strong { color:#e7eef4; }.footer-bottom nav { display:grid; grid-template-columns:repeat(2,auto); gap:.6rem 2.5rem; font-size:.75rem; }.footer-bottom nav a:hover { color:#fff; }.copyright { padding-top:1.25rem; border-top:1px solid var(--line-dark); font-size:.7rem; }
@media(max-width:991.98px){ .hero { padding-top:8.5rem; }.process-visual { max-width:560px; margin:auto; }.problem-flow { grid-template-columns:1fr; gap:.8rem; }.flow-arrow { width:auto; height:35px; transform:rotate(90deg); }.capability-grid,.solutions-grid { grid-template-columns:repeat(2,1fr); }.method-timeline { grid-template-columns:repeat(2,1fr); gap:2rem 1rem; }.outcomes-section .section-heading { margin-bottom:2rem; }.cta-panel { grid-template-columns:1fr; gap:2rem; }.cta-panel .btn { width:max-content; }.evidence-board { grid-template-columns:145px 1fr; }}
@media(max-width:767.98px){ .section { padding:4.5rem 0; }.hero { min-height:auto; padding:8rem 0 4.5rem; }.hero-actions .btn { width:100%; }.hero-note { align-items:start; }.capability-grid,.solutions-grid { grid-template-columns:1fr; }.feature-card { min-height:250px; }.section-action { flex-direction:column; align-items:start; }.section-action .btn { width:100%; }.method-timeline { grid-template-columns:1fr; gap:0; }.method-timeline li { display:grid; grid-template-columns:44px 1fr; gap:1rem; padding-bottom:1.7rem; }.method-timeline li::before { z-index:-1; top:0; left:18px; width:1px !important; height:100%; }.method-timeline li>span { margin:0; }.outcome-grid { grid-template-columns:1fr; }.evidence-board { min-height:0; grid-template-columns:1fr; }.board-sidebar { display:none; }.board-main { padding:1rem; }.board-kpis { grid-template-columns:1fr 1fr; }.board-kpis>div:last-child { grid-column:1/-1; }.cta-panel { padding:2rem 1.25rem; border-radius:18px; }.cta-panel .btn { width:100%; }.footer-top,.footer-bottom { grid-template-columns:1fr; flex-direction:column; }.footer-bottom nav { grid-template-columns:1fr; }.mini-ui { height:200px; }}
@media(max-width:420px){ .container { width:min(100% - 1.25rem,1200px); }.row { margin-right:0; margin-left:0; }.row>* { padding-right:0; padding-left:0; }.process-visual { padding:.7rem; }.fragment { grid-template-columns:32px 1fr auto; }.kpi-grid { grid-template-columns:1fr 1fr; }.board-head>span { display:none; }.chart-title span { display:none; } }