/* Petabyte Connect site. Fonts are served from this origin on purpose: loading them from Google would send every
   visitor's IP address to Google, on the page that explains our privacy. */
@font-face{font-family:'Barlow Condensed';font-weight:600;font-display:swap;src:url(fonts/barlow-condensed-600-latin.woff2) format('woff2')}
@font-face{font-family:'Barlow Condensed';font-weight:700;font-display:swap;src:url(fonts/barlow-condensed-700-latin.woff2) format('woff2')}
@font-face{font-family:'Barlow Condensed';font-weight:800;font-display:swap;src:url(fonts/barlow-condensed-800-latin.woff2) format('woff2')}
@font-face{font-family:'Inter Tight';font-weight:300 700;font-display:swap;src:url(fonts/inter-tight-latin.woff2) format('woff2')}
@font-face{font-family:'JetBrains Mono';font-weight:500;font-display:swap;src:url(fonts/jetbrains-mono-500-latin.woff2) format('woff2')}

:root{
  --navy:#06173a;--navy2:#0b2a63;--blue:#0a55e0;--cyan:#16e0d2;--ice:#eef4ff;--ink:#0a1530;--muted:#51607f;--line:#d6e0f5;--card:#fff;
  --grad:linear-gradient(135deg,#0033a0 0%,#0a62f5 55%,#13e2d2 100%);
  --display:'Barlow Condensed','Arial Narrow',Impact,sans-serif;
  --body:'Inter Tight',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --mono:'JetBrains Mono',ui-monospace,Consolas,monospace;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--ice);color:var(--ink);font:400 17px/1.6 var(--body);-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:var(--blue)}
a:focus-visible,summary:focus-visible{outline:3px solid var(--cyan);outline-offset:3px;border-radius:4px}
.wrap{max-width:1120px;margin:0 auto;padding:0 20px}
.mono{font-family:var(--mono);font-weight:500;font-size:12px;letter-spacing:.08em;text-transform:uppercase}

/* top bar + nav */
.bar{background:var(--navy);color:#bcd0f5}
.bar .wrap{display:flex;justify-content:space-between;gap:16px;align-items:center;min-height:38px;flex-wrap:wrap;padding-top:6px;padding-bottom:6px}
.bar b{color:var(--cyan);font-weight:500}
.dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--cyan);margin-right:8px;vertical-align:1px}
.nav{background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:5}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;min-height:68px;gap:16px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--ink);font:800 26px/1 var(--display);letter-spacing:.02em;text-transform:uppercase}
.brand img{width:40px;height:40px;border-radius:10px}
.nav ul{display:flex;gap:26px;list-style:none;margin:0;padding:0}
.nav ul a{color:var(--ink);text-decoration:none;font-weight:500;font-size:15px}
.nav ul a:hover{color:var(--blue)}

/* hero */
.hero{background:var(--grad);color:#fff;overflow:hidden}
.hero .wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center;padding-top:64px;padding-bottom:0}
.tag{display:inline-block;border:1px solid rgba(255,255,255,.55);padding:6px 12px;margin-bottom:22px}
h1.big{font:800 clamp(54px,9vw,112px)/.9 var(--display);text-transform:uppercase;margin:0 0 22px;letter-spacing:.005em}
h1.big span{color:#06173a}
.lead{font-size:20px;max-width:30em;color:#e8f2ff;margin:0 0 28px}
.cta{display:flex;gap:14px;flex-wrap:wrap;align-items:center;margin-bottom:56px}
.btn{display:inline-block;background:#fff;color:var(--navy);font:700 15px/1 var(--mono);text-transform:uppercase;letter-spacing:.06em;padding:16px 22px;text-decoration:none;border-radius:4px}
.btn.ghost{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.6)}
.soon{font-family:var(--mono);font-weight:500;font-size:13px;letter-spacing:.06em;text-transform:uppercase;border:1px dashed rgba(255,255,255,.7);padding:15px 18px;border-radius:4px}
.hero figure{margin:0;align-self:end}
.phone{border-radius:44px;border:10px solid #0a1228;background:#0a1228;box-shadow:0 30px 60px rgba(3,12,40,.45);overflow:hidden}
.phone img{width:100%;height:auto;display:block}
.hero .phone{max-width:330px;margin:0 auto;border-bottom:0;border-bottom-left-radius:0;border-bottom-right-radius:0}

/* trust strip */
.strip{background:var(--navy);color:#fff}
.strip .wrap{display:grid;grid-template-columns:repeat(4,1fr);gap:0;padding-top:0;padding-bottom:0}
.strip div{padding:22px 18px;border-left:1px solid rgba(255,255,255,.14)}
.strip div:first-child{border-left:0}
.strip b{display:block;font:800 34px/1 var(--display);text-transform:uppercase;color:var(--cyan)}
.strip span{font-size:14px;color:#bcd0f5}

/* sections */
section{padding:84px 0}
h2{font:800 clamp(38px,5vw,60px)/.95 var(--display);text-transform:uppercase;margin:12px 0 16px;color:var(--navy)}
.eyebrow{color:var(--blue)}
.sub{color:var(--muted);max-width:38em;margin:0 0 40px;font-size:18px}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;counter-reset:s}
.step{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:26px;position:relative}
.step::before{counter-increment:s;content:"0" counter(s);font:800 54px/1 var(--display);color:var(--cyan);display:block;margin-bottom:8px;-webkit-text-stroke:0}
.step h3{font:700 26px/1.05 var(--display);text-transform:uppercase;margin:0 0 8px}
.step p{margin:0;color:var(--muted)}
.feat{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.f{background:var(--card);border:1px solid var(--line);border-top:4px solid var(--blue);border-radius:10px;padding:24px}
.f:nth-child(3n+2){border-top-color:var(--cyan)}
.f h3{font:700 24px/1.05 var(--display);text-transform:uppercase;margin:0 0 8px;color:var(--navy)}
.f p{margin:0;color:var(--muted);font-size:16px}
.shots{background:#fff;border-block:1px solid var(--line)}
.shotrow{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;align-items:start}
.shotrow figure{margin:0;text-align:center}
.shotrow .phone{max-width:290px;margin:0 auto 14px}
.shotrow figcaption{font:700 22px/1.1 var(--display);text-transform:uppercase;color:var(--navy)}
.shotrow figcaption small{display:block;font:400 15px/1.4 var(--body);text-transform:none;color:var(--muted);margin-top:4px}
.private{background:var(--navy);color:#fff}
.private h2{color:#fff}.private .sub{color:#bcd0f5}
.private ul{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,1fr);gap:14px 28px}
.private li{padding-left:28px;position:relative;color:#e8f0ff}
.private li::before{content:"";position:absolute;left:0;top:.5em;width:12px;height:12px;border-radius:50%;background:var(--cyan)}
.private a{color:var(--cyan)}
details{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:0 22px;margin-bottom:12px}
summary{cursor:pointer;font:700 22px/1.2 var(--display);text-transform:uppercase;padding:18px 0;color:var(--navy);list-style-position:outside}
details p{margin:0 0 18px;color:var(--muted)}

/* footer */
footer{background:#041028;color:#9fb4de;padding:44px 0;font-size:15px}
footer .wrap{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}
footer a{color:#cfe0ff;margin-right:18px}
footer .brand{color:#fff;font-size:22px}

/* legal and support pages */
.pagehead{background:var(--grad);color:#fff;padding:56px 0 46px}
.pagehead h1{font:800 clamp(46px,7vw,84px)/.92 var(--display);text-transform:uppercase;margin:10px 0 0}
.prose{padding:48px 0 80px}
.prose .wrap{max-width:760px}
.prose h2{font:700 30px/1.05 var(--display);margin:2em 0 .4em;color:var(--navy)}
.prose h3{font:700 22px/1.2 var(--display);text-transform:uppercase;margin:1.6em 0 .2em;color:var(--navy)}
.prose p,.prose li{color:#26324f}
.prose code{background:#e1ebff;padding:1px 6px;border-radius:4px;font-size:.92em}
.callout{background:#fff;border:1px solid var(--line);border-left:6px solid var(--cyan);border-radius:8px;padding:18px 22px;margin:22px 0}

@media (max-width:860px){
  .hero .wrap{grid-template-columns:1fr;padding-top:44px}
  .hero .phone{max-width:280px}
  .strip .wrap{grid-template-columns:1fr 1fr}
  .strip div:nth-child(3){border-left:0}
  .steps,.feat,.shotrow{grid-template-columns:1fr}
  .private ul{grid-template-columns:1fr}
  .nav ul{gap:16px}.nav ul li:nth-child(1),.nav ul li:nth-child(2){display:none}
  section{padding:60px 0}
  .bar .hide-s{display:none}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}