/* Compliance Atlas kit — styles for the script-driven parts.
   Paste into Site settings > Custom code > Head (inside <style>), or host and <link> it.
   Everything static (cards, type, buttons) is built with Webflow classes in the Designer. */
:root{
  --atlas-brand:#591EFF; --atlas-brand-700:#3B0FB8; --atlas-brand-50:#F5F2FF; --atlas-brand-200:#D9CCFF;
  --atlas-ink:#181D27; --atlas-ink-2:#535862; --atlas-ink-3:#717680; --atlas-line:#E9EAEB; --atlas-soft:#FAFAFB;
  --atlas-land:#E6E8EC; --atlas-land-hover:#D3D6DC;
}

/* industry colour tints: put data-ic="{Industry slug}" on chips / icon boxes */
[data-ic=banking]{--ic:#1570EF;--ic-bg:#EFF8FF;--ic-b:#B2DDFF;--ic-fg:#175CD3}
[data-ic=fintech]{--ic:#7A5AF8;--ic-bg:#F4F3FF;--ic-b:#D9D6FE;--ic-fg:#5925DC}
[data-ic=crypto]{--ic:#F79009;--ic-bg:#FFFAEB;--ic-b:#FEDF89;--ic-fg:#B54708}
[data-ic=igaming]{--ic:#17B26A;--ic-bg:#ECFDF3;--ic-b:#ABEFC6;--ic-fg:#067647}
[data-ic=insurance]{--ic:#6172F3;--ic-bg:#EEF4FF;--ic-b:#C7D7FE;--ic-fg:#3538CD}
[data-ic=telecom]{--ic:#06AED4;--ic-bg:#ECFDFF;--ic-b:#A5F0FC;--ic-fg:#0E7090}
[data-ic=healthcare]{--ic:#EE46BC;--ic-bg:#FDF2FA;--ic-b:#FCCEEE;--ic-fg:#C11574}
[data-ic=ecommerce]{--ic:#F04438;--ic-bg:#FEF3F2;--ic-b:#FECDCA;--ic-fg:#B42318}
[data-ic=travel]{--ic:#EAAA08;--ic-bg:#FEFBE8;--ic-b:#FEEE95;--ic-fg:#A15C07}
[data-ic=government]{--ic:#4E5BA6;--ic-bg:#F8F9FC;--ic-b:#D5D9EB;--ic-fg:#363F72}
.atlas-chip[data-ic]{border-color:var(--ic-b);background:var(--ic-bg);color:var(--ic-fg)}
.atlas-chip[data-ic] .atlas-dot{background:var(--ic)}
.atlas-icon[data-ic]{background:linear-gradient(180deg,#fff,var(--ic-bg));border-color:var(--ic-b);color:var(--ic)}

/* region tabs + filtered lists */
[data-atlas-region-tab].is-active{background:#fff;color:var(--atlas-ink);box-shadow:0 1px 3px rgba(10,13,18,.1)}
.atlas-hidden{display:none!important}

/* ---------- map ---------- */
.atlas-map{position:relative;width:100%;aspect-ratio:1000/500;overflow:hidden;border-radius:16px;background:radial-gradient(120% 90% at 50% 40%,#fff 0%,var(--atlas-soft) 100%);touch-action:none;user-select:none;-webkit-user-select:none}
.atlas-map:focus-visible{outline:2px solid var(--atlas-brand);outline-offset:2px}
.atlas-map.is-zoomed{cursor:grab}.atlas-map.is-dragging{cursor:grabbing}
.atlas-map>svg{position:absolute;inset:0;width:100%;height:100%;display:block}
.atlas-ct{fill:var(--atlas-land);stroke:#fff;stroke-width:.7;vector-effect:non-scaling-stroke;stroke-linejoin:round;transition:fill .15s}
.atlas-ct.is-hl{fill:var(--atlas-land-hover)}
.atlas-ct.is-cov{fill:var(--fill,#591EFF);cursor:pointer}
.atlas-ct.is-cov.is-hl{fill:var(--atlas-brand-700)}
.atlas-map.is-filtered .atlas-ct.is-cov:not(.is-on){fill:#CDC2F5}
.atlas-mk{cursor:pointer;transition:opacity .2s}
.atlas-mk-hit{fill:transparent}
.atlas-mk-dot{fill:var(--fill,#591EFF);stroke:#fff;stroke-width:1.6;vector-effect:non-scaling-stroke}
.atlas-mk-ring{fill:none;stroke:var(--fill,#591EFF);stroke-width:1.2;vector-effect:non-scaling-stroke;opacity:.7;transform-box:fill-box;transform-origin:center;animation:atlas-ring 2.4s ease-out infinite}
.atlas-mk.is-hl .atlas-mk-dot{fill:var(--atlas-brand-700)}
.atlas-map.is-deep .atlas-mk:not(.is-tiny){opacity:0;pointer-events:none}
.atlas-map.is-filtered .atlas-mk:not(.is-on){opacity:.3}
@keyframes atlas-ring{0%{transform:scale(.5);opacity:.9}100%{transform:scale(1.8);opacity:0}}
.atlas-zoom{position:absolute;right:14px;top:14px;z-index:3;display:flex;flex-direction:column;background:#fff;border:1px solid var(--atlas-line);border-radius:10px;box-shadow:0 1px 3px rgba(10,13,18,.08);overflow:hidden}
.atlas-zoom button{width:36px;height:36px;display:grid;place-items:center;border:0;background:none;color:#414651;cursor:pointer;padding:0}
.atlas-zoom button+button{border-top:1px solid var(--atlas-line)}
.atlas-zoom button:hover{background:var(--atlas-soft)}
.atlas-zoom svg{width:15px;height:15px}
.atlas-key{position:absolute;left:14px;bottom:14px;z-index:3;display:flex;flex-wrap:wrap;gap:6px 14px;padding:8px 12px;background:rgba(255,255,255,.9);backdrop-filter:blur(6px);border:1px solid var(--atlas-line);border-radius:10px;font-size:12px;font-weight:500;color:var(--atlas-ink-2);pointer-events:none}
.atlas-key span{display:inline-flex;align-items:center;gap:6px}
.atlas-key i{width:10px;height:10px;border-radius:3px;display:inline-block}
.atlas-hint{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:4;padding:10px 14px;border-radius:10px;background:rgba(24,29,39,.82);color:#fff;font-size:14px;font-weight:500;opacity:0;pointer-events:none;transition:opacity .2s}
.atlas-hint.is-show{opacity:1}
.atlas-tip{position:absolute;left:0;top:0;z-index:5;width:232px;padding:12px;background:#fff;border:1px solid var(--atlas-line);border-radius:12px;box-shadow:0 12px 24px -6px rgba(10,13,18,.16);display:flex;flex-direction:column;gap:8px;pointer-events:none;font-size:12px;line-height:17px;color:var(--atlas-ink-2)}
.atlas-tip[hidden]{display:none}
.atlas-tip.is-small{width:auto;max-width:220px;padding:8px 10px;gap:2px}
.atlas-tip-row{display:flex;align-items:center;gap:8px;min-width:0}
.atlas-tip-row img{width:20px;height:14px;border-radius:3px;object-fit:cover;box-shadow:0 0 0 1px rgba(10,13,18,.08)}
.atlas-tip-row b{font-size:14px;line-height:20px;font-weight:600;color:var(--atlas-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.atlas-tip-reg{margin-left:auto;font-size:11px;color:var(--atlas-ink-3);white-space:nowrap}
.atlas-tip-stats{font-size:11.5px}
.atlas-tip p{margin:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.atlas-tip-cta{font-weight:600;color:var(--atlas-brand)}
.atlas-tip a{pointer-events:auto;font-weight:600;color:var(--atlas-brand);text-decoration:none}
@media (max-width:720px){.atlas-map{aspect-ratio:1000/620}.atlas-key{display:none}.atlas-zoom{right:8px;top:8px}}

/* ---------- globe ---------- */
.atlas-globe{position:absolute;left:50%;top:150px;width:1180px;height:1180px;max-width:none;transform:translateX(-50%);z-index:0;pointer-events:none;
  -webkit-mask-image:radial-gradient(closest-side,#000 62%,transparent 100%),linear-gradient(#000 40%,transparent 78%);-webkit-mask-composite:source-in;
  mask-image:radial-gradient(closest-side,#000 62%,transparent 100%),linear-gradient(#000 40%,transparent 78%);mask-composite:intersect}
.atlas-globe canvas{width:100%;height:100%;display:block}
@media (max-width:720px){.atlas-globe{width:760px;height:760px;top:230px}}

/* ---------- guide page ---------- */
[data-atlas-toc] a.is-active{border-left-color:var(--atlas-brand);color:#4A14E0;font-weight:600}
[data-atlas-checklist] li.is-locked{filter:blur(3.5px);color:#A4A7AE;cursor:pointer;user-select:none}
[data-atlas-body] h2{scroll-margin-top:110px}

/* unlock modal: give the modal wrapper data-atlas-modal and set it to display:none in the Designer */
[data-atlas-modal]{position:fixed;inset:0;z-index:1000;place-items:center;padding:16px}
[data-atlas-modal].is-open{display:grid!important}
[data-atlas-modal] .atlas-modal-bg{position:absolute;inset:0;background:rgba(12,14,30,.55);backdrop-filter:blur(4px)}
[data-atlas-modal] .atlas-modal-card{position:relative;width:100%;max-width:440px;max-height:100%;overflow:auto;animation:atlas-pop .18s ease-out}
@keyframes atlas-pop{from{opacity:0;transform:translateY(12px) scale(.98)}to{opacity:1;transform:none}}
.atlas-field-error{border-color:#FDA29B!important}
[data-atlas-form-error]{color:#D92D20;font-size:13px}
@media (prefers-reduced-motion:reduce){.atlas-mk-ring{animation:none}[data-atlas-modal] .atlas-modal-card{animation:none}}
