/* ==========================================================================
   InsureTech, Inc. — enterprise landing (static reproduction of the
   Next.js/Tailwind reference). Dark obsidian/slate base, cyan/emerald accents.
   ========================================================================== */

:root{
  --slate-950:#020617; --slate-900:#0f172a; --slate-850:#111c33; --slate-800:#1e293b;
  --slate-700:#334155; --slate-600:#475569; --slate-500:#64748b; --slate-400:#94a3b8;
  --slate-300:#cbd5e1; --slate-200:#e2e8f0; --slate-100:#f1f5f9;
  --cyan-300:#67e8f9; --cyan-400:#22d3ee; --cyan-500:#06b6d4;
  --blue-400:#60a5fa; --blue-500:#3b82f6; --blue-600:#2563eb; --blue-800:#1e40af; --blue-950:#172554;
  --emerald-400:#34d399; --amber-400:#fbbf24; --purple-400:#c084fc; --pink-400:#f472b6;
  --maxw:1180px;
  --font:"Inter","Plus Jakarta Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body{
  margin:0; font-family:var(--font); background:var(--slate-950); color:var(--slate-100);
  line-height:1.6; font-size:16px; -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
::selection{ background:var(--cyan-500); color:#fff; }
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
h1,h2,h3,h4{ margin:0; line-height:1.15; letter-spacing:-.02em; }
p{ margin:0; }
svg{ display:block; }

.wrap{ width:100%; max-width:var(--maxw); margin:0 auto; padding:0 24px; }
.mono-eyebrow{ font-size:.72rem; font-weight:600; text-transform:uppercase; letter-spacing:.18em; color:var(--cyan-400); }

/* ---------- buttons ---------- */
.btn{ display:inline-flex; align-items:center; justify-content:center; gap:.5em; font-weight:600;
  font-size:.95rem; border-radius:12px; padding:.85em 1.5em; cursor:pointer; border:1px solid transparent;
  transition:.18s ease; white-space:nowrap; }
.btn svg{ width:18px; height:18px; }
.btn-cyan{ background:linear-gradient(90deg,var(--cyan-500),var(--blue-600)); color:var(--slate-950);
  font-weight:700; box-shadow:0 10px 24px -8px rgba(6,182,212,.5); }
.btn-cyan:hover{ filter:brightness(1.08); transform:translateY(-1px); }
.btn-solid-cyan{ background:var(--cyan-500); color:var(--slate-950); font-weight:600;
  box-shadow:0 6px 16px -8px rgba(6,182,212,.5); }
.btn-solid-cyan:hover{ background:var(--cyan-400); }
.btn-ghost{ background:rgba(15,23,42,.5); color:var(--slate-200); border-color:var(--slate-700); }
.btn-ghost:hover{ border-color:var(--slate-500); background:var(--slate-900); }
.btn-slate{ background:var(--slate-800); color:var(--slate-100); border-color:var(--slate-700); }
.btn-slate:hover{ background:var(--slate-700); }

/* ---------- top notification bar ---------- */
.topbar{ border-bottom:1px solid var(--slate-800); background:rgba(15,23,42,.6);
  backdrop-filter:blur(8px); text-align:center; padding:9px 16px; font-size:.75rem;
  font-weight:500; color:var(--slate-400); }
.topbar .dot{ width:8px; height:8px; border-radius:50%; background:var(--emerald-400);
  display:inline-block; margin-right:.5em; box-shadow:0 0 0 0 rgba(52,211,153,.6);
  animation:pulse 2s infinite; vertical-align:middle; }
@keyframes pulse{ 0%{ box-shadow:0 0 0 0 rgba(52,211,153,.5);} 70%{ box-shadow:0 0 0 8px rgba(52,211,153,0);} 100%{ box-shadow:0 0 0 0 rgba(52,211,153,0);} }

/* ---------- nav ---------- */
.nav{ position:sticky; top:0; z-index:50; border-bottom:1px solid rgba(30,41,59,.8);
  background:rgba(2,6,23,.8); backdrop-filter:blur(12px); }
.nav-inner{ display:flex; align-items:center; justify-content:space-between; height:76px; }
.brand{ display:flex; align-items:center; gap:12px; }
.brand .mark{ width:40px; height:40px; border-radius:12px; flex:none;
  background:linear-gradient(45deg,var(--cyan-500),var(--blue-600)); display:grid; place-items:center;
  box-shadow:0 8px 20px -8px rgba(6,182,212,.5); }
.brand .mark svg{ width:22px; height:22px; color:#fff; }
.brand .name{ font-size:1.25rem; font-weight:800; color:#fff; line-height:1.1; display:block; }
.brand .name .r{ color:var(--cyan-400); }
.brand .tag{ font-size:.58rem; letter-spacing:.2em; text-transform:uppercase; color:var(--slate-400); font-weight:600; }
.nav-links{ display:flex; align-items:center; gap:34px; list-style:none; margin:0; padding:0;
  font-size:.9rem; font-weight:500; color:var(--slate-300); }
.nav-links a:hover{ color:var(--cyan-400); }
.nav-cta{ display:flex; align-items:center; gap:14px; }
.nav-toggle{ display:none; background:none; border:0; color:#fff; cursor:pointer; padding:6px; }
@media(max-width:900px){
  .nav-links{ display:none; position:absolute; top:76px; left:0; right:0; flex-direction:column;
    align-items:stretch; gap:0; background:var(--slate-950); border-bottom:1px solid var(--slate-800); }
  .nav-links.open{ display:flex; }
  .nav-links a{ padding:14px 24px; }
  .nav-toggle{ display:block; }
  .nav-cta .btn{ padding:.7em 1.1em; font-size:.85rem; }
}

/* ---------- hero ---------- */
.hero{ position:relative; padding:80px 0 112px; overflow:hidden; }
.hero .blobs{ position:absolute; inset:0; z-index:-1; display:flex; align-items:center; justify-content:center; }
.hero .blob{ position:absolute; border-radius:50%; filter:blur(90px); }
.hero .blob.a{ width:600px; height:600px; background:rgba(6,182,212,.10); transform:translateY(-96px); }
.hero .blob.b{ width:500px; height:500px; background:rgba(37,99,235,.10); transform:translateX(190px); }
.badge{ display:inline-flex; align-items:center; gap:8px; padding:6px 14px; border-radius:999px;
  border:1px solid var(--slate-800); background:var(--slate-900); font-size:.75rem; color:var(--slate-300);
  font-weight:500; margin-bottom:24px; }
.badge svg{ width:14px; height:14px; color:var(--cyan-400); }
.hero h1{ font-size:clamp(2.3rem,5.2vw,3.75rem); font-weight:800; color:#fff; line-height:1.08;
  max-width:56rem; margin-bottom:24px; }
.grad-text{ background:linear-gradient(90deg,var(--cyan-400),var(--blue-400)); -webkit-background-clip:text;
  background-clip:text; color:transparent; }
.hero .lede{ font-size:clamp(1.05rem,2.2vw,1.28rem); color:var(--slate-300); max-width:44rem; margin-bottom:32px; }
.hero .cta-row{ display:flex; flex-wrap:wrap; gap:16px; }
.hero-metrics{ margin-top:64px; padding-top:40px; border-top:1px solid rgba(30,41,59,.8);
  display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
@media(max-width:720px){ .hero-metrics{ grid-template-columns:repeat(2,1fr); } }
.metric .n{ font-size:clamp(1.6rem,3vw,1.9rem); font-weight:800; color:#fff; letter-spacing:-.02em; }
.metric .n.cyan{ color:var(--cyan-400); } .metric .n.blue{ color:var(--blue-400); }
.metric .l{ font-size:.72rem; text-transform:uppercase; letter-spacing:.08em; color:var(--slate-400); margin-top:4px; }

/* ---------- section scaffolding ---------- */
.section{ padding:96px 0; }
.section.tint{ background:rgba(15,23,42,.4); border-top:1px solid var(--slate-800); border-bottom:1px solid var(--slate-800); }
.sec-head{ max-width:42rem; margin-bottom:64px; }
.sec-head.center{ margin-left:auto; margin-right:auto; text-align:center; }
.sec-head h3{ font-size:clamp(1.7rem,3.4vw,2rem); font-weight:700; color:#fff; }
.sec-head p{ color:var(--slate-400); margin-top:12px; }

/* ---------- service cards ---------- */
.cards{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
@media(max-width:900px){ .cards{ grid-template-columns:repeat(2,1fr); } }
@media(max-width:620px){ .cards{ grid-template-columns:1fr; } }
.card{ background:rgba(15,23,42,.8); border:1px solid var(--slate-800); border-radius:16px; padding:32px;
  transition:.2s ease; }
.card:hover{ border-color:var(--slate-700); transform:translateY(-3px); }
.card .ico{ width:48px; height:48px; border-radius:10px; display:grid; place-items:center; margin-bottom:24px; transition:.2s; }
.card .ico svg{ width:24px; height:24px; }
.ico.blue{ background:rgba(59,130,246,.10); color:var(--blue-400); }
.ico.amber{ background:rgba(245,158,11,.10); color:var(--amber-400); }
.ico.cyan{ background:rgba(6,182,212,.10); color:var(--cyan-400); }
.ico.emerald{ background:rgba(52,211,153,.10); color:var(--emerald-400); }
.ico.purple{ background:rgba(192,132,252,.10); color:var(--purple-400); }
.ico.pink{ background:rgba(244,114,182,.10); color:var(--pink-400); }
.card h4{ font-size:1.2rem; font-weight:700; color:#fff; margin-bottom:12px; }
.card .desc{ font-size:.9rem; color:var(--slate-400); margin-bottom:16px; }
.card ul{ list-style:none; margin:0; padding:0; font-size:.8rem; color:var(--slate-300); }
.card li{ display:flex; align-items:center; gap:8px; margin:8px 0; }
.card li svg{ width:16px; height:16px; color:var(--emerald-400); flex:none; }

/* ---------- segment toggle ---------- */
.seg-tabs{ display:flex; justify-content:center; margin-bottom:32px; }
.seg-tabs .group{ display:inline-flex; gap:4px; background:var(--slate-900); padding:6px;
  border-radius:12px; border:1px solid var(--slate-800); }
.seg-tabs button{ padding:10px 20px; border-radius:8px; border:0; background:none; cursor:pointer;
  font:inherit; font-size:.88rem; font-weight:600; color:var(--slate-400); transition:.15s; }
.seg-tabs button:hover{ color:#fff; }
.seg-tabs button.active{ background:var(--cyan-500); color:var(--slate-950); box-shadow:0 4px 10px -4px rgba(6,182,212,.5); }
.seg-panel{ background:linear-gradient(180deg,var(--slate-900),var(--slate-950));
  border:1px solid var(--slate-800); border-radius:24px; padding:48px; }
@media(max-width:620px){ .seg-panel{ padding:28px; } }
.seg-panel h4{ font-size:1.5rem; font-weight:700; color:#fff; margin-bottom:16px; }
.seg-panel .desc{ color:var(--slate-300); max-width:48rem; margin-bottom:32px; }
.seg-bullets{ display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-bottom:32px; }
@media(max-width:620px){ .seg-bullets{ grid-template-columns:1fr; } }
.seg-bullets div{ display:flex; align-items:flex-start; gap:12px; font-size:.88rem; color:var(--slate-300); font-weight:500; }
.seg-bullets svg{ width:20px; height:20px; color:var(--cyan-400); flex:none; margin-top:1px; }
.seg-link{ display:inline-flex; align-items:center; gap:8px; color:var(--cyan-400); font-weight:600; font-size:.9rem; }
.seg-link:hover{ color:var(--cyan-300); }
.seg-link svg{ width:16px; height:16px; transition:transform .15s; }
.seg-link:hover svg{ transform:translateX(4px); }

/* ---------- institute callout ---------- */
.institute{ background:linear-gradient(90deg,rgba(23,37,84,.6),var(--slate-900));
  border:1px solid rgba(30,64,175,.4); border-radius:24px; padding:48px;
  display:flex; align-items:center; justify-content:space-between; gap:32px; flex-wrap:wrap; }
@media(max-width:820px){ .institute{ padding:32px; } }
.institute .pill{ display:inline-block; padding:5px 12px; border-radius:999px; background:rgba(59,130,246,.10);
  color:var(--blue-400); border:1px solid rgba(59,130,246,.2); font-size:.72rem; font-weight:600; margin-bottom:16px; }
.institute h3{ font-size:clamp(1.5rem,3vw,1.9rem); font-weight:700; color:#fff; margin-bottom:12px; }
.institute p{ color:var(--slate-300); font-size:.95rem; max-width:40rem; margin-bottom:16px; }
.institute blockquote{ border-left:2px solid var(--cyan-400); padding-left:16px; margin:16px 0 0;
  font-size:.8rem; font-style:italic; color:var(--slate-400); max-width:40rem; }

/* ---------- contact ---------- */
.contact-grid{ display:grid; grid-template-columns:5fr 7fr; gap:48px; }
@media(max-width:900px){ .contact-grid{ grid-template-columns:1fr; gap:32px; } }
.contact-info h3{ font-size:clamp(1.7rem,3.4vw,2rem); font-weight:700; color:#fff; margin-bottom:16px; }
.contact-info>p{ color:var(--slate-400); font-size:.9rem; margin-bottom:32px; }
.info-item{ display:flex; align-items:center; gap:12px; margin-bottom:16px; font-size:.9rem; color:var(--slate-300); }
.info-item .ii{ width:36px; height:36px; border-radius:10px; background:var(--slate-900); border:1px solid var(--slate-800);
  display:grid; place-items:center; color:var(--cyan-400); flex:none; }
.info-item .ii svg{ width:16px; height:16px; }
.info-item b{ color:#fff; display:block; font-weight:600; }
.form-card{ background:rgba(15,23,42,.6); border:1px solid var(--slate-800); border-radius:24px; padding:32px; }
.form-row{ display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-bottom:20px; }
@media(max-width:520px){ .form-row{ grid-template-columns:1fr; } }
.field label{ display:block; font-size:.72rem; font-weight:600; text-transform:uppercase; letter-spacing:.06em;
  color:var(--slate-400); margin-bottom:8px; }
.field input,.field select,.field textarea{ width:100%; background:var(--slate-950); border:1px solid var(--slate-800);
  border-radius:12px; padding:12px 16px; font:inherit; font-size:.9rem; color:#fff; transition:border-color .15s; }
.field select{ color:var(--slate-300); appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='%2394a3b8' stroke-width='2' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 14px center; padding-right:40px; }
.field textarea{ resize:vertical; min-height:110px; }
.field input::placeholder,.field textarea::placeholder{ color:var(--slate-500); }
.field input:focus,.field select:focus,.field textarea:focus{ outline:none; border-color:var(--cyan-400); }
.field.full{ margin-bottom:20px; }
.hp{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
.form-submit{ width:100%; }
.form-note{ font-size:.78rem; margin-top:14px; text-align:center; }
.form-note.ok{ color:var(--emerald-400); } .form-note.err{ color:#f87171; }

/* ---------- footer ---------- */
.footer{ border-top:1px solid var(--slate-900); background:var(--slate-950); padding:48px 0; }
.footer-inner{ display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap;
  font-size:.78rem; color:var(--slate-500); }
.footer-inner .white{ color:#fff; font-weight:600; }
.footer-links{ display:flex; align-items:center; gap:24px; }
.footer-links a:hover{ color:var(--slate-300); }
.footer-links span{ color:var(--slate-700); }

/* ---------- utils ---------- */
.hidden{ display:none !important; }
.skip-link{ position:absolute; left:-999px; }
.skip-link:focus{ left:12px; top:8px; background:var(--slate-800); color:#fff; padding:.5em 1em; border-radius:8px; z-index:100; }
