/* AnyVelo brand skin: navy, blue and cyan taken from the logo. Loaded after style.css and only overrides it. */
:root{--navy:#0c2440;--navy-2:#123a68;--deep:#08162a;--blue:#1a6fd0;--cyan:#11c4ed;--mint:#3ddcc0;--ice:#a9dff2;--soft:#eef4fa;--card-shadow:0 10px 30px #0c244016}
html{scroll-padding-top:90px}
body{background:#fff;color:var(--navy)}
::selection{background:var(--cyan);color:var(--navy)}

/* header */
header{position:sticky;top:0;z-index:20;max-width:none;margin:0;background:var(--navy);border-bottom:3px solid var(--cyan);
  padding:14px max(28px,calc((100vw - 1240px)/2));box-shadow:0 6px 24px #08162a33}
.brand{color:#fff;font-size:26px;letter-spacing:-1px}
.brand-logo{width:40px;height:40px;border-radius:10px;box-shadow:0 0 14px #11c4ed66}
nav{gap:26px}
nav a{color:#cfe8f5;position:relative;padding:6px 0;transition:color .15s}
nav a:hover{color:var(--cyan)}
nav a:not(:last-child)::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--cyan);transform:scaleX(0);transform-origin:left;transition:transform .2s}
nav a:not(:last-child):hover::after{transform:scaleX(1)}
nav a:last-child{background:linear-gradient(135deg,var(--cyan),var(--mint));color:var(--navy);padding:9px 20px;font-weight:700}
nav a:last-child:hover{color:var(--navy);filter:brightness(1.06)}
header select{background:#0f2f57;color:#fff;border:1px solid #2c5285;border-radius:8px}
header select:focus-visible{outline-color:var(--cyan)}

/* hero */
.hero{margin-top:32px;padding:64px 56px;border-radius:28px;color:#fff;position:relative;overflow:hidden;
  background:radial-gradient(1100px 520px at 88% 8%,#1c5f9f55,transparent 60%),radial-gradient(700px 400px at 5% 100%,#11c4ed22,transparent 60%),linear-gradient(135deg,var(--deep),var(--navy) 55%,var(--navy-2));
  box-shadow:0 24px 60px #0c244033}
.hero h1{color:#fff}
.hero .eyebrow{background:#11c4ed26;color:var(--cyan);border:1px solid #11c4ed55}
.hero .intro{color:#c9dff0}
.hero .small{color:var(--ice)}
.hero .button{background:linear-gradient(135deg,var(--cyan),var(--mint));color:var(--navy);box-shadow:0 8px 26px #11c4ed40}
.hero .button:hover{background:linear-gradient(135deg,#5fdcf5,var(--mint));box-shadow:0 10px 30px #11c4ed66}
.hero-visual{background:#ffffff0d;border:1px solid #ffffff26;box-shadow:0 0 0 1px #11c4ed22,0 20px 50px #08162a66}
.visual-head{color:var(--ice)}
.hero-visual figcaption{background:#0c2440cc;color:#cfe8f5;border-top:1px solid #ffffff1f}
.visual-pill{background:#11c4ed26;border:1px solid #11c4ed66;color:var(--cyan)}

/* sections */
.platforms{background:var(--soft);border-color:#d3e2f1;margin-top:28px}
.platforms strong{color:var(--navy);position:relative}
.platforms strong::after{content:"";display:block;height:3px;border-radius:2px;margin-top:3px;background:linear-gradient(90deg,var(--blue),var(--cyan))}
.eyebrow{color:var(--blue)}
h2{color:var(--navy)}
.features article{background:#fff;border-color:#d3e2f1;box-shadow:var(--card-shadow);transition:transform .2s,box-shadow .2s,border-color .2s}
.features article:hover{transform:translateY(-4px);border-color:var(--cyan);box-shadow:0 16px 36px #1a6fd026}
.feature-icon{background:linear-gradient(135deg,var(--blue),var(--cyan));color:#fff;box-shadow:0 6px 16px #1a6fd040}
.security{background:radial-gradient(600px 300px at 100% 0,#11c4ed26,transparent 60%),linear-gradient(135deg,var(--deep),var(--navy));border:1px solid #1d4877}
.security .eyebrow{color:var(--cyan)}
.shield{color:var(--cyan)}
.plan-card{border-color:#d3e2f1}
.plan-card.selected{border-color:var(--blue)}
.plan-card.selected:before{background:linear-gradient(90deg,var(--blue),var(--cyan))}
.plan-card li:before{color:var(--cyan)}
.plan-select{border-color:#9db6d3;color:var(--blue)}
.plan-card.selected .plan-select{background:linear-gradient(135deg,var(--blue),#1558a8);border-color:var(--blue)}
.connection-quota{background:#e2f1fb;color:#0f4585}
.package-calculator{background:var(--soft)}
.package-calculator output{color:var(--blue)}
.downloads .badge{background:#e2f1fb;color:#0f4585}
.download-list a.badge{background:linear-gradient(135deg,var(--blue),#1558a8);color:#fff}
.download-list a.badge:hover{background:linear-gradient(135deg,#1558a8,#0f4585)}
button:not(.plan-select),.button{cursor:pointer}

/* footer */
footer{max-width:none;margin:64px 0 0;background:var(--navy);color:#cfe8f5;border-top:3px solid var(--cyan);
  padding:32px max(28px,calc((100vw - 1240px)/2))}
footer p{color:#a9c4d8}
footer .brand{font-size:22px}
:focus-visible{outline:3px solid var(--cyan)}

@media(max-width:760px){
  header{padding:12px 18px;position:static}
  .hero{padding:34px 22px;border-radius:20px;margin-top:20px}
  nav a:last-child{padding:8px 14px}
  footer{padding:24px 18px}
}
@media(prefers-reduced-motion:reduce){.features article,nav a::after{transition:none}.features article:hover{transform:none}}
.security h2{color:#fff}
.skip-link{position:absolute;left:-9999px;top:8px;background:var(--cyan);color:var(--navy);padding:8px 14px;border-radius:8px;z-index:50}
.skip-link:focus{left:12px}