:root{
  --ink:#0d1828;
  --muted:#546577;
  --line:#dbe3e6;
  --paper:#ffffff;
  --wash:#f5fbf9;
  --green:#88f261;
  --ice:#c9f2ff;
  --blue:#223b57;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,Arial,Helvetica,sans-serif;color:var(--ink);background:
  radial-gradient(circle at 80% 5%,rgba(136,242,97,.22),transparent 30%),
  radial-gradient(circle at 20% 30%,rgba(201,242,255,.55),transparent 35%),
  linear-gradient(180deg,#f8fbfb,#eef8f3 55%,#fff);
}
body:before{content:"";position:fixed;inset:0;pointer-events:none;background:repeating-linear-gradient(115deg,transparent 0 70px,rgba(116,210,235,.13) 72px,transparent 76px);opacity:.55}
.site-header{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:16px clamp(18px,5vw,60px);background:rgba(255,255,255,.82);backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:14px;text-decoration:none;color:var(--ink)}
.brand strong{display:block;font-size:1.2rem}.brand small{letter-spacing:.24em;color:var(--muted)}
.flag-badge{width:44px;height:44px;border-radius:14px;background:#fff;border:1px solid #dbe3e6;display:grid;place-items:center;box-shadow:0 6px 20px rgba(0,0,0,.06)}
.flag-badge span,.micro-flag,.flag-line{display:block;background:linear-gradient(#b43b44 0 12%,#fff 12% 24%,#b43b44 24% 36%,#fff 36% 48%,#b43b44 48% 60%,#fff 60% 72%,#b43b44 72% 84%,#fff 84% 100%);position:relative}
.flag-badge span{width:30px;height:21px;border-radius:2px;overflow:hidden}.flag-badge span:before,.micro-flag:before{content:"";position:absolute;left:0;top:0;background:#314c78;width:42%;height:52%}
.nav{display:flex;gap:22px;align-items:center}.nav a{text-decoration:none;color:var(--blue);font-weight:700;font-size:.94rem}
.menu-toggle{display:none}
.hero{min-height:86vh;display:grid;grid-template-columns:1.15fr .85fr;gap:40px;align-items:center;padding:clamp(50px,8vw,100px) clamp(22px,6vw,80px)}
.eyebrow{text-transform:uppercase;letter-spacing:.24em;font-weight:900;color:#476174;font-size:.85rem;display:flex;gap:14px;align-items:center}.micro-flag{width:44px;height:26px;border-radius:5px;overflow:hidden;opacity:.65}
h1{font-size:clamp(4.7rem,14vw,12rem);line-height:.78;margin:20px 0;font-weight:950;letter-spacing:-.09em}
h2{font-size:clamp(2.1rem,5vw,4.8rem);line-height:.95;margin:0 0 18px;letter-spacing:-.055em}
h3{font-size:1.35rem;margin:8px 0 10px}p{font-size:1.08rem;line-height:1.7;color:var(--muted)}.lead{font-size:clamp(1.3rem,3vw,2.25rem);line-height:1.25;color:#24384a}.definition{max-width:760px}
.actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:28px}.button{border:0;border-radius:999px;padding:16px 25px;font-weight:900;text-decoration:none;display:inline-block;color:var(--ink);box-shadow:0 8px 18px rgba(0,0,0,.07)}.primary{background:var(--green)}.secondary{background:white;border:1px solid var(--line)}
.spin-panel{background:rgba(255,255,255,.7);border:1px solid var(--line);border-radius:34px;padding:34px;text-align:center;box-shadow:0 20px 55px rgba(16,32,51,.08)}
.coin-scene{height:310px;display:grid;place-items:center;perspective:1000px}.coin{width:230px;height:230px;border-radius:50%;border:8px solid #e8f3f0;background:transparent;position:relative;transform-style:preserve-3d;transition:transform .25s ease;cursor:grab;box-shadow:0 24px 60px rgba(0,0,0,.18)}.coin:active{cursor:grabbing}.coin-face{position:absolute;inset:0;border-radius:50%;display:grid;place-items:center;text-align:center;backface-visibility:hidden;font-weight:950;letter-spacing:.05em}.front{background:linear-gradient(145deg,#102033,#294460);color:white}.back{background:linear-gradient(145deg,var(--green),var(--ice));transform:rotateY(180deg);color:#102033;font-size:1.15rem}
.section{padding:clamp(55px,8vw,95px) clamp(22px,6vw,80px);position:relative}.quiet{background:rgba(255,255,255,.58);border-block:1px solid var(--line)}.section-heading{max-width:900px;margin-bottom:30px}
.path{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}.path div,.card,.crm-map div,.browser{background:rgba(255,255,255,.86);border:1px solid var(--line);border-radius:24px;padding:24px;box-shadow:0 10px 30px rgba(16,32,51,.06)}.path b{display:block;font-size:1.2rem}.path span{display:block;margin-top:10px;color:var(--muted);line-height:1.45}
.grid{display:grid;gap:18px}.four{grid-template-columns:repeat(4,1fr)}.three{grid-template-columns:repeat(3,1fr)}.card span{font-weight:950;color:#7ca0a8;letter-spacing:.18em}.feature a{font-weight:900;color:var(--blue)}
.split{display:grid;grid-template-columns:1fr 1fr;gap:34px;align-items:center}.modernization-box{display:grid;gap:18px}.browser{min-height:170px;position:relative;overflow:hidden}.browser:before{content:"";display:block;height:24px;background:linear-gradient(90deg,#ddd,#eee);border-radius:18px;margin-bottom:22px}.browser b{font-size:1.7rem;display:block}.old{filter:grayscale(.8);opacity:.72}.new{background:linear-gradient(145deg,#fff,#effff0)}
.crm-map{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.crm-map div{font-weight:900;text-align:center}
.contact{display:grid;grid-template-columns:1fr 1fr;gap:34px}.contact form{background:white;border:1px solid var(--line);border-radius:28px;padding:24px;box-shadow:0 14px 40px rgba(16,32,51,.08)}label{display:block;font-weight:800;margin-bottom:14px}input,textarea{display:block;width:100%;margin-top:8px;border:1px solid var(--line);border-radius:14px;padding:14px;font:inherit}textarea{min-height:120px}
.footer{display:grid;gap:8px;place-items:center;text-align:center;background:#102033;color:white;padding:42px}.footer span{color:#c8d8e0}.flag-line{width:90px;height:12px;border-radius:4px;overflow:hidden;opacity:.9}
@media(max-width:850px){
  .hero,.split,.contact{grid-template-columns:1fr}.four,.three,.path,.crm-map{grid-template-columns:1fr}.nav{display:none;position:absolute;top:76px;right:18px;background:white;border:1px solid var(--line);border-radius:22px;padding:16px;box-shadow:0 12px 30px rgba(0,0,0,.12);flex-direction:column;align-items:flex-start}.nav.open{display:flex}.menu-toggle{display:block;border:1px solid var(--line);border-radius:999px;background:white;padding:12px 18px;font-weight:900;color:#1670c9}h1{font-size:5.6rem}.hero{padding-top:46px}.coin{width:200px;height:200px}.coin-scene{height:250px}
}


/* Final logo/header refinement */
.site-header{
  min-height:96px;
}
.logo-brand{
  gap:0;
}
.logo-wrap{
  position:relative;
  display:block;
  width:clamp(230px, 34vw, 390px);
  border-radius:18px;
  overflow:hidden;
  box-shadow:0 10px 28px rgba(16,32,51,.10);
  background:#0d1828;
  border:1px solid rgba(13,24,40,.12);
}
.logo-wrap img{
  display:block;
  width:100%;
  height:auto;
}
.corner-flag{
  position:absolute;
  top:8px;
  right:8px;
  width:30px;
  height:20px;
  border-radius:3px;
  overflow:hidden;
  opacity:.88;
  box-shadow:0 1px 6px rgba(0,0,0,.22);
  background:linear-gradient(#b43b44 0 12%,#fff 12% 24%,#b43b44 24% 36%,#fff 36% 48%,#b43b44 48% 60%,#fff 60% 72%,#b43b44 72% 84%,#fff 84% 100%);
}
.corner-flag:before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  width:42%;
  height:54%;
  background:#314c78;
}
.eyebrow{
  padding-left:0;
}
.footer{
  background:#102033;
}
.footer .flag-line,
.flag-line,
.micro-flag{
  display:none!important;
}
.home-hero .definition{
  font-size:clamp(1.35rem,3.3vw,2.35rem);
  line-height:1.32;
  color:#263f52;
  max-width:900px;
}
@media(max-width:850px){
  .site-header{
    min-height:88px;
    align-items:center;
  }
  .logo-wrap{
    width:210px;
    border-radius:14px;
  }
  .corner-flag{
    width:25px;
    height:16px;
    top:6px;
    right:6px;
  }
  .nav{top:92px}
  .home-hero .definition{
    font-size:1.8rem;
  }
}
@media(max-width:520px){
  .logo-wrap{
    width:178px;
  }
  .menu-toggle{
    padding:10px 15px;
  }
}