/* ============================================================
   CPluto AI — styles.css
   Brand: navy #0B1D33 · cyan #0EA5C6 · teal #00C2DE · gold #E8B54A
   ============================================================ */
:root{
  --navy:#0B1D33; --navy2:#10243E; --ink:#1E293B; --slate:#51636F;
  --cyan:#0EA5C6; --cyan-d:#0E7C9E; --teal:#00C2DE; --gold:#E8B54A;
  --bg:#F6FAFC; --card:#FFFFFF; --line:#DCE8EF;
  --disp:'Sora',sans-serif; --body:'Inter',sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:var(--body);color:var(--ink);background:var(--bg);line-height:1.6;-webkit-font-smoothing:antialiased}
h1,h2,h3,.disp{font-family:var(--disp)}
a{color:inherit;text-decoration:none}
img,svg{max-width:100%}
.wrap{max-width:1180px;margin:0 auto;padding:0 24px}
.eyebrow{display:inline-block;font-size:.78rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--cyan-d);margin-bottom:14px}
.sec{padding:88px 0}
.sec-h{max-width:720px;margin-bottom:52px}
.sec-h h2{font-size:clamp(1.7rem,3.4vw,2.5rem);line-height:1.2;color:var(--navy);letter-spacing:-.01em}
.sec-h p{margin-top:14px;color:var(--slate);font-size:1.05rem}
.btn{display:inline-flex;align-items:center;gap:8px;font-family:var(--body);font-weight:600;font-size:.95rem;padding:13px 26px;border-radius:10px;border:0;cursor:pointer;transition:transform .15s ease,box-shadow .15s ease}
.btn:hover{transform:translateY(-2px)}
.btn:focus-visible{outline:3px solid var(--teal);outline-offset:2px}
.btn-primary{background:var(--cyan);color:#fff;box-shadow:0 6px 18px rgba(14,165,198,.35)}
.btn-ghost{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.45)}
.btn-navy{background:var(--navy);color:#fff}

/* Scroll reveal */
.reveal{opacity:0;transform:translateY(18px);transition:opacity .55s ease,transform .55s ease}
.reveal.in{opacity:1;transform:none}

/* ---------- Nav ---------- */
.nav{position:sticky;top:0;z-index:60;background:rgba(11,29,51,.92);backdrop-filter:blur(10px);border-bottom:1px solid rgba(255,255,255,.08)}
.nav-in{display:flex;align-items:center;justify-content:space-between;height:68px}
.logo{display:flex;align-items:center;gap:10px;color:#fff;font-family:var(--disp);font-weight:700;font-size:1.15rem}
.logo img{width:34px;height:34px}
.nav-links{display:flex;align-items:center;gap:28px;font-size:.92rem;color:#C6D6E2}
.nav-links a:hover{color:#fff}
.nav-cta{display:flex;gap:12px}
.nav-cta .btn{padding:10px 18px;font-size:.88rem}
.burger{display:none;background:none;border:0;color:#fff;font-size:1.6rem;cursor:pointer}
.m-menu{display:none;background:var(--navy);padding:14px 24px 22px;border-top:1px solid rgba(255,255,255,.08)}
.m-menu a{display:block;padding:11px 0;color:#C6D6E2;font-size:.98rem}
.m-menu .btn{width:100%;justify-content:center;margin-top:8px}

/* ---------- Hero ---------- */
.hero{background:radial-gradient(1100px 560px at 85% -10%,rgba(14,165,198,.25),transparent 60%),linear-gradient(180deg,var(--navy) 0%,var(--navy2) 100%);color:#fff;padding:92px 0 78px;overflow:hidden}
.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:56px;align-items:center}
.hero h1{font-size:clamp(1.9rem,3.9vw,2.9rem);line-height:1.18;letter-spacing:-.015em}
.hero h1 em{font-style:normal;color:var(--teal)}
.hero-sub{margin:22px 0 30px;color:#B9CBD9;font-size:1.08rem;max-width:560px}
.hero-sub strong{color:#fff}
.hero-cta{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:30px}
.hero-badges{display:flex;flex-wrap:wrap;gap:10px}
.badge{font-size:.78rem;font-weight:600;color:#AFC8D8;border:1px solid rgba(255,255,255,.18);border-radius:999px;padding:6px 13px}
.hero-panel{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);border-radius:18px;padding:28px}
.hero-panel h3{font-size:.82rem;letter-spacing:.13em;text-transform:uppercase;color:var(--teal);margin-bottom:18px}
.stat-row{display:grid;grid-template-columns:1fr 1fr;gap:18px 22px}
.stat .num{font-family:var(--disp);font-weight:800;font-size:2rem;color:#fff}
.stat .num span{color:var(--teal)}
.stat .lbl{font-size:.8rem;color:#A6BCCB;margin-top:2px}
.ticker{margin-top:24px;border-top:1px solid rgba(255,255,255,.12);padding-top:16px;font-size:.85rem;color:#C6D6E2;min-height:26px}
.ticker b{color:var(--teal)}

/* ---------- Problem ---------- */
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.p-card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:26px 24px}
.p-card .ic{font-size:1.5rem}
.p-card h3{font-size:1.02rem;color:var(--navy);margin:12px 0 8px}
.p-card p{font-size:.9rem;color:var(--slate)}
.callout{margin-top:44px;background:var(--navy);color:#fff;border-radius:14px;padding:26px 30px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px}
.callout p{font-size:1.05rem}
.callout p b{color:var(--teal)}

/* ---------- How ---------- */
.band-tint{background:#EDF5F9}
.steps{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;margin-bottom:56px}
.step{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:22px 18px;position:relative}
.step .n{position:absolute;top:14px;right:16px;font-family:var(--disp);font-weight:800;color:#E1EDF3;font-size:1.6rem}
.step .ic{font-size:1.4rem}
.step h3{font-size:.95rem;color:var(--navy);margin:10px 0 6px}
.step p{font-size:.8rem;color:var(--slate)}
.how-rows{display:grid;gap:14px}
.how-row{display:grid;grid-template-columns:1fr auto;gap:22px;align-items:center;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:22px 26px}
.how-row h4{font-size:1rem;color:var(--navy);margin-bottom:6px}
.how-row p{font-size:.9rem;color:var(--slate);max-width:760px}
.how-tag{font-size:.75rem;font-weight:700;color:var(--cyan-d);background:#E4F5F9;border-radius:999px;padding:6px 14px;white-space:nowrap}

/* ---------- Capabilities ---------- */
.cap-band{background:var(--navy);color:#fff}
.cap-band .sec-h h2{color:#fff}
.cap-band .sec-h p{color:#B9CBD9}
.cap-band .eyebrow{color:var(--teal)}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.cap{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);border-radius:14px;padding:26px 24px}
.cap .ic{font-size:1.4rem}
.cap h3{font-size:1.02rem;margin:12px 0 8px}
.cap p{font-size:.88rem;color:#B9CBD9}

/* ---------- Industries ---------- */
.tabs{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:34px}
.tab{font-family:var(--body);font-weight:600;font-size:.88rem;background:var(--card);border:1.5px solid var(--line);color:var(--slate);border-radius:999px;padding:11px 18px;cursor:pointer;transition:.15s}
.tab[aria-selected="true"]{background:var(--navy);border-color:var(--navy);color:#fff}
.tab:focus-visible{outline:3px solid var(--teal);outline-offset:2px}
.ind-panel{display:none;grid-template-columns:1.05fr .95fr;gap:26px}
.ind-panel.active{display:grid}
.ind-note{grid-column:1/-1;font-size:.85rem;color:var(--slate);background:#EDF5F9;border:1px solid var(--line);border-radius:10px;padding:10px 16px}
.ind-col{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:28px}
.ind-col h3{font-size:.82rem;letter-spacing:.12em;text-transform:uppercase;margin-bottom:18px}
.ind-col.ch h3{color:#C23B3B}
.ind-col.im h3{color:#1B8A5A}
.ch-list{list-style:none;display:grid;gap:12px}
.ch-list li{font-size:.92rem;color:var(--ink);padding-left:22px;position:relative}
.ch-list li::before{content:"•";position:absolute;left:4px;color:#C23B3B;font-weight:800}
.im-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.im{background:#F0FAF5;border:1px solid #D6EEE2;border-radius:12px;padding:16px 14px;text-align:center}
.im .v{font-family:var(--disp);font-weight:800;color:#1B8A5A;font-size:1.12rem}
.im .l{font-size:.72rem;color:var(--slate);margin-top:4px;line-height:1.35}
.cxo{grid-column:1/-1;background:var(--navy);color:#fff;border-radius:12px;padding:14px 22px;font-size:.85rem;text-align:center}
.cxo b{color:var(--teal)}

/* ---------- Outcomes ---------- */
.out-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:16px}
.out{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:24px 16px;text-align:center}
.out .v{font-family:var(--disp);font-weight:800;font-size:1.9rem;color:var(--cyan-d)}
.out .t{font-size:.85rem;font-weight:600;color:var(--navy);margin-top:4px}
.out .d{font-size:.74rem;color:var(--slate);margin-top:4px}

/* ---------- Contact ---------- */
.contact{background:linear-gradient(180deg,var(--navy) 0%,var(--navy2) 100%);color:#fff}
.contact .sec-h h2{color:#fff}
.contact .sec-h p{color:#B9CBD9}
.contact .eyebrow{color:var(--teal)}
.c-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:42px;align-items:start}
.c-opt{display:flex;gap:16px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);border-radius:14px;padding:20px 22px;margin-bottom:14px}
.c-opt .ic{font-size:1.3rem}
.c-opt h3{font-size:1rem;margin-bottom:4px}
.c-opt p{font-size:.85rem;color:#B9CBD9}
.c-direct{margin-top:26px}
.c-direct h4{font-size:.8rem;letter-spacing:.12em;text-transform:uppercase;color:var(--teal);margin-bottom:12px}
.c-direct a{display:block;font-size:.95rem;color:#DCE9F2;padding:5px 0}
.c-direct a:hover{color:#fff}
.form-card{background:#fff;color:var(--ink);border-radius:18px;padding:34px;box-shadow:0 24px 60px rgba(0,0,0,.35)}
.form-card h3{font-family:var(--disp);color:var(--navy);font-size:1.3rem}
.form-card>div>p{font-size:.88rem;color:var(--slate);margin:6px 0 22px}
.f-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.f-field{display:flex;flex-direction:column;gap:6px}
.f-field.full{grid-column:1/-1}
.f-field label{font-size:.8rem;font-weight:600;color:var(--navy)}
.f-field label span{color:#C23B3B}
.f-field input,.f-field select,.f-field textarea{font-family:var(--body);font-size:.92rem;color:var(--ink);background:#F6FAFC;border:1.5px solid var(--line);border-radius:10px;padding:12px 14px;width:100%}
.f-field textarea{min-height:96px;resize:vertical}
.f-field input:focus,.f-field select:focus,.f-field textarea:focus{outline:none;border-color:var(--cyan);background:#fff;box-shadow:0 0 0 3px rgba(14,165,198,.15)}
.f-field ::placeholder{color:#9AB0BC}
.form-note{font-size:.75rem;color:var(--slate);margin-top:12px}
.f-success{display:none;text-align:center;padding:34px 10px}
.f-success .tick{width:58px;height:58px;border-radius:50%;background:#1B8A5A;color:#fff;display:grid;place-items:center;font-size:1.6rem;margin:0 auto 16px}
.f-success h3{color:var(--navy)}
.f-success p{font-size:.9rem;color:var(--slate);margin:10px 0 18px}
.f-error{display:none;margin-top:12px;font-size:.85rem;color:#C23B3B;background:#FBEDED;border:1px solid #F0CFCF;border-radius:10px;padding:10px 14px}

/* ---------- Footer ---------- */
.footer{background:#081524;color:#9FB4C2;padding:64px 0 34px;font-size:.88rem}
.f-cols{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:36px;margin-bottom:42px}
.footer h4{color:#fff;font-size:.82rem;letter-spacing:.1em;text-transform:uppercase;margin-bottom:14px}
.footer a{display:block;padding:4px 0}
.footer a:hover{color:#fff}
.f-tag{margin-top:14px;max-width:320px}
.f-bottom{border-top:1px solid rgba(255,255,255,.1);padding-top:24px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;font-size:.8rem}
.f-motto{color:var(--teal);font-weight:600}

/* ---------- Modal ---------- */
.modal{position:fixed;inset:0;z-index:100;display:none;align-items:center;justify-content:center;padding:20px;background:rgba(8,16,28,.7);backdrop-filter:blur(4px)}
.modal.open{display:flex}
.modal-card{background:#fff;border-radius:18px;max-width:640px;width:100%;max-height:92vh;overflow:auto;padding:34px;position:relative}
.modal-x{position:absolute;top:14px;right:16px;background:none;border:0;font-size:1.5rem;color:var(--slate);cursor:pointer}
.modal-card h3{font-family:var(--disp);color:var(--navy);font-size:1.35rem}
.modal-card>div>p{font-size:.9rem;color:var(--slate);margin:6px 0 18px}
.intent-chips{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:22px}
.chip{font-family:var(--body);font-weight:600;font-size:.83rem;border:1.5px solid var(--line);background:#F6FAFC;color:var(--slate);border-radius:999px;padding:9px 16px;cursor:pointer}
.chip[aria-pressed="true"]{background:var(--navy);border-color:var(--navy);color:#fff}

/* ---------- Responsive ---------- */
@media (max-width:960px){
  .grid-4,.steps{grid-template-columns:repeat(2,1fr)}
  .hero-grid,.ind-panel,.c-grid{grid-template-columns:1fr}
  .out-grid{grid-template-columns:repeat(3,1fr)}
  .grid-3{grid-template-columns:repeat(2,1fr)}
  .f-cols{grid-template-columns:1fr 1fr}
  .nav-links,.nav-cta{display:none}
  .burger{display:block}
}
@media (max-width:560px){
  .grid-4,.steps,.grid-3,.f-grid{grid-template-columns:1fr}
  .out-grid,.im-grid{grid-template-columns:repeat(2,1fr)}
  .sec{padding:64px 0}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .btn:hover{transform:none}
  .reveal{opacity:1;transform:none;transition:none}
}