/* ── ClaimVise.ai — Shared Site Styles ──────────────────────────── */
/* Include this in every page via <link rel="stylesheet" href="/shared.css"> */

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
:root {
  --navy:   #04111E; --navy2: #081C2E; --navy3: #0A2236;
  --teal:   #00C4B8; --teal2: #00E8DA;
  --green:  #00E599; --pink: #FF4F8B; --gold: #F5C518;
  --purple: #A78BFA; --orange: #FF8C42; --blue: #3B9EFF;
  --white:  #FFFFFF; --text: #C8DDE8; --muted: #6B8FA0;
  --border: rgba(0,196,184,0.15); --card: rgba(8,28,46,0.8);
  --font-display: 'Syne', sans-serif; --font-body: 'DM Sans', sans-serif;
  --radius: 16px; --radius-sm: 8px;
}
html { scroll-behavior: smooth; overflow-x: hidden; }
body { overflow-x: hidden; }
body { font-family: var(--font-body); background: var(--navy); color: var(--text); line-height: 1.6; overflow-x: hidden; }
a { color: inherit; text-decoration: none; }
body::before { content:''; position:fixed; inset:0; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.03'/%3E%3C/svg%3E"); opacity:0.4; pointer-events:none; z-index:0; }
body::after { content:''; position:fixed; inset:0; background-image: linear-gradient(rgba(0,196,184,0.04) 1px,transparent 1px), linear-gradient(90deg,rgba(0,196,184,0.04) 1px,transparent 1px); background-size:60px 60px; pointer-events:none; z-index:0; }
.orb { position:fixed; border-radius:50%; filter:blur(120px); pointer-events:none; z-index:0; opacity:0.12; }
.orb-1 { width:500px;height:500px;background:var(--teal);top:-150px;left:-100px;animation:orbFloat 20s ease-in-out infinite alternate; }
.orb-2 { width:400px;height:400px;background:var(--green);bottom:-100px;right:-100px;animation:orbFloat 25s ease-in-out infinite alternate-reverse; }
@keyframes orbFloat { from{transform:translate(0,0) scale(1)} to{transform:translate(40px,30px) scale(1.1)} }
.container { max-width:1200px; margin:0 auto; padding:0 24px; position:relative; z-index:1; }
section { position:relative; z-index:1; }
nav { position:fixed;top:0;left:0;right:0;z-index:1000;padding:16px 0;transition:all 0.3s ease; }
nav.scrolled { background:rgba(4,17,30,0.92);backdrop-filter:blur(20px);border-bottom:1px solid var(--border);padding:12px 0; }
.nav-inner { display:flex;align-items:center;justify-content:space-between;max-width:1200px;margin:0 auto;padding:0 24px; }
.logo { display:flex;align-items:center;gap:10px;font-family:var(--font-display);font-weight:800;font-size:1.3rem;color:var(--white); }
.logo-icon { width:36px;height:36px;border-radius:8px;background:var(--teal);display:flex;align-items:center;justify-content:center;font-size:0.75rem;font-weight:800;color:var(--navy);letter-spacing:-0.5px; }
.logo span { color:var(--teal); }
.nav-links { display:flex;align-items:center;gap:32px; }
.nav-links a { font-size:0.9rem;color:var(--text);transition:color 0.2s;font-weight:400; }
.nav-links a:hover { color:var(--teal); }
.nav-cta { display:flex;align-items:center;gap:12px; }
.btn-ghost { padding:8px 20px;border-radius:8px;border:1px solid var(--border);font-size:0.875rem;color:var(--text);transition:all 0.2s;font-family:var(--font-body);cursor:pointer;background:transparent; }
.btn-ghost:hover { border-color:var(--teal);color:var(--teal); }
.btn-primary { padding:10px 22px;border-radius:8px;background:var(--teal);color:var(--navy);font-size:0.875rem;font-weight:700;transition:all 0.2s;font-family:var(--font-display);cursor:pointer;border:none;white-space:nowrap; }
.btn-primary:hover { background:var(--teal2);transform:translateY(-1px);box-shadow:0 8px 24px rgba(0,196,184,0.3); }
.hamburger { display:none;flex-direction:column;gap:5px;cursor:pointer;padding:4px; }
.hamburger span { display:block;width:24px;height:2px;background:var(--text);border-radius:2px;transition:all 0.3s; }
.mobile-menu { display:none;position:fixed;inset:0;background:rgba(4,17,30,0.98);z-index:999;flex-direction:column;align-items:center;justify-content:center;gap:32px; }
.mobile-menu.open { display:flex; }
.mobile-menu a { font-family:var(--font-display);font-size:1.5rem;font-weight:700;color:var(--text);transition:color 0.2s; }
.mobile-menu a:hover { color:var(--teal); }
.mobile-close { position:absolute;top:24px;right:24px;font-size:1.5rem;color:var(--muted);cursor:pointer;background:none;border:none; }
.page-hero { padding:140px 0 80px; }
.section-label { font-family:var(--font-display);font-size:0.75rem;font-weight:700;letter-spacing:3px;text-transform:uppercase;color:var(--teal);margin-bottom:16px;display:block; }
.section-title { font-family:var(--font-display);font-size:clamp(2rem,3.5vw,2.8rem);font-weight:800;color:var(--white);line-height:1.1;margin-bottom:16px; }
.section-sub { font-size:1.05rem;color:var(--muted);line-height:1.7; }
.btn-lg { padding:14px 28px;border-radius:10px;background:var(--teal);color:var(--navy);font-size:1rem;font-weight:700;font-family:var(--font-display);transition:all 0.25s;cursor:pointer;border:none;display:inline-flex;align-items:center;gap:8px; }
.btn-lg:hover { background:var(--teal2);transform:translateY(-2px);box-shadow:0 12px 32px rgba(0,196,184,0.35); }
.btn-lg-outline { padding:14px 28px;border-radius:10px;border:1px solid var(--border);background:transparent;color:var(--text);font-size:1rem;font-weight:400;font-family:var(--font-body);transition:all 0.25s;cursor:pointer;display:inline-flex;align-items:center;gap:8px; }
.btn-lg-outline:hover { border-color:var(--teal);color:var(--teal); }
footer { border-top:1px solid var(--border);padding:60px 0 32px; }
.footer-grid { display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:40px;margin-bottom:48px; }
.footer-brand p { font-size:0.9rem;color:var(--muted);line-height:1.7;margin-top:14px;max-width:280px; }
.footer-col h5 { font-family:var(--font-display);font-size:0.82rem;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--text);margin-bottom:16px; }
.footer-col a { display:block;font-size:0.875rem;color:var(--muted);margin-bottom:10px;transition:color 0.2s; }
.footer-col a:hover { color:var(--teal); }
.footer-bottom { display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--border);padding-top:24px;flex-wrap:wrap;gap:16px; }
.footer-bottom p { font-size:0.82rem;color:var(--muted); }
.footer-domains { display:flex;gap:16px; }
.footer-domains a { font-size:0.78rem;color:var(--muted);transition:color 0.2s; }
.footer-domains a:hover { color:var(--teal); }
.reveal { opacity:0;transform:translateY(32px);transition:opacity 0.7s ease,transform 0.7s ease; }
.reveal.visible { opacity:1;transform:translateY(0); }
.reveal-delay-1 { transition-delay:0.1s; }
.reveal-delay-2 { transition-delay:0.2s; }
.reveal-delay-3 { transition-delay:0.3s; }
@media(max-width:1024px){ .footer-grid{grid-template-columns:1fr 1fr;} }
@media(max-width:768px){ .nav-links{display:none;} .nav-cta .btn-ghost{display:none;} .nav-cta .btn-primary{display:none;} .hamburger{display:flex;} .footer-grid{grid-template-columns:1fr;} .footer-bottom{flex-direction:column;align-items:flex-start;} }

/* ── Logo spacing fix ───────────────────────────────────────────────── */
.logo { letter-spacing: -0.02em; }
.logo-text { letter-spacing: -0.02em; white-space: nowrap; }

/* ── Inner page responsive — covers all screen sizes ────────────────── */
/* 1440px — Large laptop */
@media (max-width: 1440px) {
  .container { padding: 0 32px; }
}
/* 1024px — Small laptop / iPad landscape */
@media (max-width: 1024px) {
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 32px; }
  .page-hero { padding: 120px 0 60px; }
  .section-title { font-size: clamp(1.6rem, 3.5vw, 2.4rem); }
  /* Legal pages — narrower content column */
  .legal-wrap { padding: 120px 32px 80px; }
}
/* 768px — Tablet portrait / large phone */
@media (max-width: 768px) {
  .nav-links { display: none; }
  .nav-cta .btn-ghost { display: none; }
  .nav-cta .btn-primary { display: none; }
  .hamburger { display: flex; }
  .page-hero { padding: 100px 0 48px; }
  .section-title { font-size: clamp(1.5rem, 5vw, 2rem); }
  .section-sub { font-size: 0.95rem; }
  .footer-grid { grid-template-columns: 1fr; gap: 28px; }
  .footer-bottom { flex-direction: column; align-items: flex-start; gap: 12px; }
  .footer-domains { flex-wrap: wrap; gap: 12px; }
  .btn-lg { width: 100%; justify-content: center; text-align: center; }
  .btn-lg-outline { width: 100%; justify-content: center; text-align: center; }
  .legal-wrap { padding: 88px 20px 60px; }
}
/* 480px — Standard phones */
@media (max-width: 480px) {
  .container { padding: 0 16px; }
  .page-hero { padding: 88px 0 36px; }
  .section-title { font-size: clamp(1.3rem, 6vw, 1.6rem); }
  .logo { font-size: 1.1rem; }
  .logo-icon { width: 30px; height: 30px; font-size: 0.68rem; }
  .legal-wrap { padding: 80px 16px 48px; max-width: 100%; }
  .footer-col a { font-size: 0.82rem; }
}
/* 360px — Small phones */
@media (max-width: 360px) {
  .section-title { font-size: 1.3rem; }
  .btn-lg { padding: 12px 16px; font-size: 0.9rem; }
  .logo-icon { width: 28px; height: 28px; }
}
