
  :root{
    --color-primary:#18181B;
    --color-primary-deep:#0B0B0D;
    --color-primary-soft:#26262B;
    --color-on-primary:#FFFFFF;
    --color-secondary:#3F3F46;
    --color-accent:#2563EB;
    --color-accent-soft:#93C5FD;
    --color-on-accent:#FFFFFF;
    --color-background:#FAFAFA;
    --color-foreground:#09090B;
    --color-card:#FFFFFF;
    --color-muted:#E8ECF0;
    --color-muted-foreground:#475569;
    --color-border:#E4E4E7;
    --font-heading:'Lexend', sans-serif;
    --font-body:'Source Sans 3', sans-serif;
    --ease-soft: cubic-bezier(.22,.61,.36,1);
  }
  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{margin:0; background:var(--color-background); color:var(--color-foreground); font-family:var(--font-body); line-height:1.6;}
  h1,h2,h3,h4{font-family:var(--font-heading); font-weight:600; letter-spacing:-0.01em; margin:0 0 .5em;}
  a{color:var(--color-accent); text-decoration:none;}
  .wrap{max-width:1120px; margin:0 auto; padding:0 24px;}
  .accent-word{color:var(--color-accent);}
  .visually-hidden{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap;}

  /* ---------- graphite pattern background (shared: hero + CTA) ---------- */
  .graphite-field{
    position:relative;
    background:linear-gradient(150deg, var(--color-primary-deep) 0%, var(--color-primary) 55%, var(--color-primary-soft) 100%);
    color:var(--color-on-primary);
    overflow:hidden;
  }
  .graphite-field::before{
    content:"";
    position:absolute; inset:0;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cpath d='M0 0H120V120' fill='none' stroke='%23FFFFFF' stroke-opacity='0.05' stroke-width='1'/%3E%3Cpath d='M0 60H120M60 0V120' fill='none' stroke='%23FFFFFF' stroke-opacity='0.035' stroke-width='1'/%3E%3C/svg%3E");
    background-size:120px 120px;
    pointer-events:none;
  }
  .graphite-field::after{
    content:"";
    position:absolute; inset:0;
    background:radial-gradient(ellipse 80% 60% at 30% 0%, rgba(37,99,235,0.14), transparent 60%);
    pointer-events:none;
  }
  .graphite-field > .wrap{position:relative; z-index:1;}

  /* ---------- header / nav with dropdowns ---------- */
  header.site-header{background:var(--color-primary); border-bottom:1px solid rgba(255,255,255,0.08); position:relative; z-index:50;}
  header.site-header .wrap{display:flex; align-items:center; justify-content:space-between; padding:18px 24px;}
  .logo{font-family:var(--font-heading); font-weight:700; font-size:20px; letter-spacing:-0.02em; color:#fff;}
  .logo span{color:var(--color-accent-soft);}
  nav.main-nav{display:flex; align-items:center;}
  nav.main-nav > ul{display:flex; align-items:center; list-style:none; margin:0; padding:0; gap:4px;}
  nav.main-nav > ul > li{position:relative;}
  nav.main-nav > ul > li > a{
    display:flex; align-items:center; gap:5px; color:rgba(255,255,255,0.78); text-decoration:none;
    padding:10px 14px; font-size:14px; font-weight:500; border-radius:6px; transition:color .2s var(--ease-soft), background .2s var(--ease-soft);
  }
  nav.main-nav > ul > li > a:hover, nav.main-nav > ul > li:focus-within > a{color:#fff; background:rgba(255,255,255,0.06);}
  nav.main-nav .caret{width:9px; height:9px; border-right:1.5px solid currentColor; border-bottom:1.5px solid currentColor; transform:rotate(45deg) translateY(-2px); transition:transform .2s var(--ease-soft);}
  nav.main-nav li:hover .caret, nav.main-nav li:focus-within .caret{transform:rotate(225deg) translateY(1px);}

  .dropdown{
    position:absolute; top:100%; left:0; margin-top:6px; min-width:260px;
    background:#fff; border:1px solid var(--color-border); border-radius:10px; box-shadow:0 16px 40px rgba(15,15,17,0.16);
    padding:10px; opacity:0; visibility:hidden; transform:translateY(6px);
    transition:opacity .2s var(--ease-soft), transform .2s var(--ease-soft), visibility .2s;
  }
  nav.main-nav li:hover .dropdown, nav.main-nav li:focus-within .dropdown{opacity:1; visibility:visible; transform:translateY(0);}
  .dropdown.mega{min-width:560px; columns:2; column-gap:6px;}
  .dropdown a{
    display:flex; align-items:center; gap:9px; padding:8px 10px; border-radius:7px; color:var(--color-foreground);
    font-size:13.5px; break-inside:avoid; transition:background .15s var(--ease-soft), color .15s var(--ease-soft);
  }
  .dropdown a:hover{background:var(--color-background); color:var(--color-accent);}
  .dropdown .flag-icon{width:18px; height:13px; flex:none; border-radius:2px; box-shadow:0 0 0 1px rgba(0,0,0,0.08);}
  .dropdown .see-all{margin-top:4px; padding-top:8px; border-top:1px solid var(--color-border); font-weight:600; color:var(--color-accent);}

  /* ---------- flag pill (shared component) ---------- */
  .flag-icon{width:20px; height:15px; border-radius:2px; flex:none; display:inline-block; box-shadow:0 0 0 1px rgba(0,0,0,0.08);}
  .juris-pill{
    display:inline-flex; align-items:center; gap:9px; padding:9px 16px 9px 10px; border:1px solid var(--color-border); border-radius:999px;
    color:var(--color-foreground); text-decoration:none; font-size:14px; font-weight:500; background:var(--color-card);
    transition:border-color .2s var(--ease-soft), color .2s var(--ease-soft), background .2s var(--ease-soft), transform .2s var(--ease-soft);
  }
  .juris-pill:hover{border-color:var(--color-accent); color:var(--color-accent); background:#EFF4FE; transform:translateY(-1px);}
  .juris-grid{display:flex; flex-wrap:wrap; gap:10px;}

  /* ---------- buttons ---------- */
  .btn{display:inline-block; padding:14px 28px; border-radius:6px; font-weight:600; font-size:15px; text-decoration:none; transition:background .25s var(--ease-soft), transform .2s var(--ease-soft);}
  .btn-primary{background:var(--color-accent); color:var(--color-on-accent);}
  .btn-primary:hover{background:#1D4ED8; transform:translateY(-1px);}
  .btn-outline{background:transparent; color:#fff; border:1px solid rgba(255,255,255,0.3); margin-left:12px; transition:border-color .25s var(--ease-soft), transform .2s var(--ease-soft);}
  .btn-outline:hover{border-color:#fff; transform:translateY(-1px);}

  .hero{padding:88px 0 100px;}
  .hero .eyebrow{color:var(--color-accent-soft); text-transform:uppercase; letter-spacing:.12em; font-size:12px; font-weight:600; margin-bottom:16px;}
  .hero h1{font-size:44px; max-width:760px; color:#fff;}
  .hero p.lead{font-size:18px; color:#D4D4D8; max-width:640px; margin:20px 0 32px;}

  /* ---------- trust bar ---------- */
  .trust-bar{background:var(--color-card); border-bottom:1px solid var(--color-border);}
  .trust-bar .wrap{display:flex; justify-content:space-between; padding:36px 24px;}
  .trust-item{flex:1; text-align:center; padding:0 20px; position:relative;}
  .trust-item + .trust-item::before{content:""; position:absolute; left:0; top:8px; bottom:8px; width:1px; background:var(--color-border);}
  .trust-num{font-family:var(--font-heading); font-size:36px; font-weight:600; color:var(--color-primary); display:block; line-height:1;}
  .trust-num .accent-word{color:var(--color-accent);}
  .trust-label{display:block; margin-top:8px; font-size:12.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--color-muted-foreground);}

  section{padding:80px 0;}
  .section-label{color:var(--color-accent); text-transform:uppercase; font-size:12px; font-weight:700; letter-spacing:.1em; margin-bottom:12px;}
  section h2{font-size:30px; max-width:640px;}
  .section-lead{color:var(--color-muted-foreground); font-size:16px; max-width:680px; margin:16px 0 36px;}
  .vertical-section:nth-of-type(even){background:var(--color-card); border-top:1px solid var(--color-border); border-bottom:1px solid var(--color-border);}
  .vertical-head{display:flex; align-items:flex-end; justify-content:space-between; flex-wrap:wrap; gap:16px; margin-bottom:28px;}
  .vertical-head .see-hub{font-weight:600; font-size:14px;}

  .split{display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:start;}
  .split p{color:var(--color-muted-foreground); font-size:15.5px;}

  .card-grid{display:grid; grid-template-columns:repeat(auto-fit, minmax(260px,1fr)); gap:24px;}
  .card{
    position:relative; background:var(--color-card); border:1px solid var(--color-border); border-radius:10px; padding:28px 28px 28px 32px;
    transition:transform .25s var(--ease-soft), box-shadow .25s var(--ease-soft), border-color .25s var(--ease-soft);
  }
  .card::before{content:""; position:absolute; left:0; top:14px; bottom:14px; width:3px; border-radius:2px; background:var(--color-accent); transform:scaleY(0); transform-origin:top; transition:transform .3s var(--ease-soft);}
  .card:hover{transform:translateY(-4px); box-shadow:0 16px 32px rgba(15,15,17,0.10); border-color:#DCE3EC;}
  .card:hover::before{transform:scaleY(1);}
  .card .icon{width:30px; height:30px; color:var(--color-secondary); margin-bottom:16px; transition:color .25s var(--ease-soft);}
  .card:hover .icon{color:var(--color-accent);}
  .card h3{font-size:17px; margin-bottom:8px;}
  .card p{color:var(--color-muted-foreground); font-size:14.5px; margin:0;}

  .cta{text-align:center; padding:80px 0;}
  .cta h2{color:#fff; font-size:28px;}
  .cta p{color:#D4D4D8; max-width:520px; margin:12px auto 28px;}

  footer.site-footer{padding:44px 0 28px; color:var(--color-muted-foreground); font-size:13px; border-top:1px solid var(--color-border); background:var(--color-card);}
  footer.site-footer .wrap{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px;}
  footer.site-footer .legal-links a{color:var(--color-muted-foreground); margin-left:20px; font-size:13px;}
  footer.site-footer .legal-links a:hover{color:var(--color-accent);}

  /* ---------- scroll reveal ---------- */
  .reveal{opacity:0; transform:translateY(12px); transition:opacity .5s var(--ease-soft), transform .5s var(--ease-soft);}
  .reveal.is-visible{opacity:1; transform:translateY(0);}
  @media (prefers-reduced-motion: reduce){
    .reveal{opacity:1; transform:none; transition:none;}
    .card, .btn, .juris-pill{transition:none;}
  }
  @media (max-width: 860px){
    nav.main-nav{display:none;}
    .split{grid-template-columns:1fr;}
    .trust-bar .wrap{flex-direction:column; gap:20px;}
    .trust-item + .trust-item::before{display:none;}
  }
