@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--bg:#040811;--panel:#0a1422;--text:#f8fafc;--muted:#9caabd;--yellow:#ffc400;--line:rgba(255,255,255,.085);--shadow:0 30px 90px rgba(0,0,0,.48)}
*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}
body{font-family:"Manrope",Arial,sans-serif;background:var(--bg);color:var(--text);line-height:1.65;overflow-x:hidden}
body:before{content:"";position:fixed;inset:-20%;z-index:-3;background:radial-gradient(circle at 78% 8%,rgba(255,196,0,.11),transparent 24%),radial-gradient(circle at 12% 55%,rgba(23,72,120,.18),transparent 29%);pointer-events:none}
body:after{content:"";position:fixed;inset:0;z-index:-2;background-image:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);background-size:70px 70px;mask-image:linear-gradient(to bottom,black,transparent 80%);pointer-events:none}
a{color:inherit}.container{width:min(1160px,92%);margin:auto}
.header{position:sticky;top:0;z-index:50;background:rgba(4,8,17,.78);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-bottom:1px solid rgba(255,255,255,.07)}
.nav{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:24px}.logo{display:flex;align-items:center;gap:10px;text-decoration:none;font-size:27px;font-weight:800;letter-spacing:-1px}.brand-logo{width:36px;height:36px;border-radius:10px;object-fit:cover;display:block;box-shadow:0 0 28px rgba(255,196,0,.18)}
.navlinks{display:flex;align-items:center;gap:26px}.navlinks a{text-decoration:none;color:#cfd8e3;font-size:13px;font-weight:600}.navlinks a:hover{color:var(--yellow)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:14px 22px;border-radius:14px;text-decoration:none;font-weight:800;border:1px solid transparent;transition:.22s ease}.btn-yellow{background:var(--yellow);color:#07101c;box-shadow:0 10px 30px rgba(255,196,0,.12)}.btn-yellow:hover{transform:translateY(-3px);box-shadow:0 17px 40px rgba(255,196,0,.24)}.btn-outline{border-color:var(--line);background:rgba(255,255,255,.025);color:#fff}.btn-outline:hover{border-color:rgba(255,196,0,.38);color:var(--yellow);transform:translateY(-2px)}
.hero{padding:90px 0 80px;min-height:760px;display:flex;align-items:center}.hero-grid{display:grid;grid-template-columns:.94fr 1.06fr;align-items:center;gap:60px}.eyebrow{display:inline-flex;padding:8px 13px;border-radius:999px;border:1px solid rgba(255,196,0,.24);background:rgba(255,196,0,.055);color:var(--yellow);font-size:10px;font-weight:800;letter-spacing:1.6px;margin-bottom:22px}h1{font-size:clamp(50px,6.5vw,84px);line-height:.96;letter-spacing:-4px}h1 span{color:var(--yellow)}.hero-copy p{color:var(--muted);font-size:17px;max-width:600px;margin:25px 0 31px}.actions{display:flex;gap:12px;flex-wrap:wrap}
.hero-art{position:relative;display:flex;justify-content:center}.hero-art:before{content:"";position:absolute;width:72%;height:72%;right:4%;top:14%;background:rgba(255,196,0,.16);filter:blur(80px);z-index:-1;border-radius:50%}.hero-art img{display:block;width:min(100%,590px);height:680px;object-fit:cover;object-position:center 34%;border-radius:34px;border:1px solid rgba(255,255,255,.10);box-shadow:var(--shadow);transition:transform .15s linear}
.trust{padding:5px 0 70px}.trust-row{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.trust-card{background:rgba(255,255,255,.025);border:1px solid var(--line);border-radius:18px;padding:18px 21px;box-shadow:0 10px 35px rgba(0,0,0,.12)}.trust-card strong{display:block;font-size:14px}.trust-card span{color:var(--muted);font-size:12px}
.section{padding:105px 0}.section.alt{background:linear-gradient(180deg,transparent,rgba(255,255,255,.018),transparent)}.heading{max-width:740px;margin:0 auto 54px;text-align:center}.heading .kicker,.copy .kicker{color:var(--yellow);font-size:10px;font-weight:800;letter-spacing:1.8px}.heading h2{font-size:clamp(35px,5vw,54px);line-height:1.06;letter-spacing:-2px;margin:10px 0 15px}.heading p{color:var(--muted)}
.features{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.card{position:relative;overflow:hidden;background:linear-gradient(145deg,rgba(13,25,41,.94),rgba(7,15,26,.94));border:1px solid var(--line);border-radius:22px;padding:30px;box-shadow:0 18px 55px rgba(0,0,0,.16);transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease}.card:after{content:"";position:absolute;width:130px;height:130px;right:-70px;top:-70px;border-radius:50%;background:rgba(255,196,0,.08);filter:blur(8px)}.card:hover{transform:translateY(-7px);border-color:rgba(255,196,0,.22);box-shadow:0 25px 65px rgba(0,0,0,.28)}.icon{font-size:28px;margin-bottom:16px;color:var(--yellow)}.card h3{font-size:19px;margin-bottom:8px}.card p{color:var(--muted);font-size:14px}
.split{display:grid;grid-template-columns:1fr 1fr;gap:78px;align-items:center}.split.reverse .copy{order:2}.split.reverse .visual{order:1}.copy h2{font-size:clamp(35px,5vw,57px);line-height:1.04;letter-spacing:-2px;margin:11px 0 18px}.copy p{color:var(--muted);margin-bottom:22px}.checks{list-style:none;display:grid;gap:11px}.checks li{display:flex;gap:10px;color:#dfe6ee;font-size:14px}.checks li:before{content:"✓";color:var(--yellow);font-weight:900}
.visual{position:relative;display:flex;justify-content:center}.visual:before{content:"";position:absolute;inset:10% 12%;z-index:-1;background:rgba(255,196,0,.10);filter:blur(70px);border-radius:50%}.visual img{width:min(100%,510px);height:620px;display:block;object-fit:cover;object-position:center top;border-radius:30px;border:1px solid var(--line);box-shadow:var(--shadow)}
.gallery{display:grid;grid-template-columns:1fr 1fr 1fr;gap:20px;align-items:start}.gallery img{width:100%;height:620px;object-fit:cover;object-position:center top;border-radius:26px;border:1px solid var(--line);box-shadow:0 25px 65px rgba(0,0,0,.32);transition:transform .3s ease,box-shadow .3s ease}.gallery img:nth-child(2){margin-top:70px}.gallery img:hover{transform:translateY(-8px) scale(1.01);box-shadow:0 35px 80px rgba(0,0,0,.42)}
.faq{max-width:860px;margin:auto;display:grid;gap:12px}details{background:rgba(10,20,34,.82);border:1px solid var(--line);border-radius:17px;padding:20px 22px}summary{cursor:pointer;font-weight:800}details p{color:var(--muted);margin-top:12px;font-size:14px}
.cta{padding:100px 0}.cta-box{position:relative;overflow:hidden;background:linear-gradient(135deg,#111e30,#08111d);border:1px solid rgba(255,196,0,.18);border-radius:32px;padding:62px;display:flex;align-items:center;justify-content:space-between;gap:35px;box-shadow:0 30px 90px rgba(0,0,0,.3)}.cta-box:after{content:"";position:absolute;width:360px;height:360px;border-radius:50%;right:-110px;top:-150px;background:rgba(255,196,0,.13);filter:blur(35px)}.cta h2,.cta p,.cta .actions{position:relative;z-index:1}.cta h2{font-size:clamp(36px,5vw,56px);line-height:1.04}.cta p{color:var(--muted);margin-top:10px}
.footer{padding:38px 0;border-top:1px solid var(--line);background:#03070e}.footer-row{display:flex;align-items:center;justify-content:space-between;gap:20px}.footer p{color:#748092;font-size:12px}.footer-links{display:flex;gap:18px;flex-wrap:wrap}.footer-links a{color:#aeb9c8;text-decoration:none;font-size:12px}.footer-links a:hover{color:var(--yellow)}
.legal{padding:90px 0}.legal-wrap{max-width:880px;margin:auto}.legal h1{font-size:clamp(42px,6vw,64px);margin-bottom:7px}.date{color:var(--yellow);margin-bottom:35px}.legal h2{font-size:25px;color:var(--yellow);margin:38px 0 12px}.legal p,.legal li{color:#b4c0cf}.legal ul{padding-left:22px;margin:10px 0 18px}.notice{background:#0b1727;border:1px solid rgba(255,196,0,.2);padding:18px;border-radius:16px;margin:20px 0;color:#dbe3ec}.form{max-width:760px;margin:auto}.field{margin-bottom:17px}.field label{display:block;margin-bottom:7px;font-weight:800}.field input,.field textarea{width:100%;padding:14px 15px;border-radius:12px;border:1px solid var(--line);background:#0a1422;color:#fff;outline:none;font:inherit}.field input:focus,.field textarea:focus{border-color:var(--yellow);box-shadow:0 0 0 3px rgba(255,196,0,.07)}.field textarea{min-height:180px;resize:vertical}.small{color:#758397;font-size:12px;margin-top:10px}
.reveal{opacity:0;transform:translateY(42px);transition:opacity .75s ease,transform .75s cubic-bezier(.2,.8,.2,1)}.reveal-left{opacity:0;transform:translateX(-55px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.8,.2,1)}.reveal-right{opacity:0;transform:translateX(55px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.8,.2,1)}.reveal.is-visible,.reveal-left.is-visible,.reveal-right.is-visible{opacity:1;transform:translate(0,0)}.delay-1{transition-delay:.08s}.delay-2{transition-delay:.16s}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal,.reveal-left,.reveal-right{opacity:1;transform:none;transition:none}}
@media(max-width:900px){.hero{padding-top:65px}.hero-grid,.split{grid-template-columns:1fr;gap:45px}.split.reverse .copy,.split.reverse .visual{order:initial}.features{grid-template-columns:1fr 1fr}.gallery{grid-template-columns:1fr 1fr}.gallery img{height:auto}.gallery img:nth-child(2){margin-top:0}.cta-box{padding:45px;display:block}.cta .actions{margin-top:25px}.visual img{height:auto;max-height:680px}}
@media(max-width:620px){.nav{min-height:64px}.navlinks{gap:11px}.navlinks a:nth-child(2),.navlinks a:nth-child(3),.navlinks a:nth-child(4){display:none}.nav>.btn{padding:11px 14px;font-size:12px}.hero{padding:58px 0 60px}h1{letter-spacing:-2.5px}.hero-copy p{font-size:16px}.hero-art img{height:auto;max-height:none;object-position:center}.features,.gallery,.trust-row{grid-template-columns:1fr}.section{padding:70px 0}.cta-box{padding:32px 24px}.footer-row{align-items:flex-start;flex-direction:column}}

.brand-showcase{padding:25px 0 20px}
.brand-showcase-card{position:relative;min-height:520px;overflow:hidden;border:1px solid var(--line);border-radius:32px;background:#050b14;box-shadow:var(--shadow)}
.brand-showcase-card>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 42%;opacity:.9}
.brand-showcase-card:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(4,8,17,.95) 0%,rgba(4,8,17,.70) 42%,rgba(4,8,17,.08) 78%)}
.brand-showcase-copy{position:relative;z-index:2;max-width:540px;padding:78px 65px}
.brand-showcase-copy .kicker{color:var(--yellow);font-size:10px;font-weight:800;letter-spacing:1.8px}
.brand-showcase-copy h2{font-size:clamp(34px,5vw,56px);line-height:1.04;letter-spacing:-2px;margin:11px 0 18px}
.brand-showcase-copy p{color:var(--muted);margin-bottom:25px}
.brand-showcase-card img{transition:transform 1.2s ease}
.brand-showcase-card:hover img{transform:scale(1.025)}
@media(max-width:700px){
.brand-showcase-card{min-height:680px}
.brand-showcase-card:after{background:linear-gradient(180deg,rgba(4,8,17,.15) 0%,rgba(4,8,17,.55) 38%,rgba(4,8,17,.96) 75%)}
.brand-showcase-copy{padding:34px 26px;margin-top:330px}
}

/* --- Hero image presentation: clearer app framing --- */
.hero-art{
  min-height:640px;
  align-items:center;
  padding:8px 0;
}
.hero-art:before{
  width:80%;
  height:76%;
  right:2%;
  top:12%;
}
.hero-art img{
  width:min(100%,620px);
  height:auto;
  max-height:720px;
  object-fit:contain;
  object-position:center;
  border-radius:30px;
  background:#ffc400;
  box-shadow:0 32px 90px rgba(0,0,0,.52);
}

/* --- Brand showcase: never crop the supplied promotional artwork --- */
.brand-showcase-card{
  min-height:650px;
  background:#ffc400;
}
.brand-showcase-card>img{
  object-fit:contain;
  object-position:center;
  background:#ffc400;
  opacity:1;
  padding:0;
}
.brand-showcase-card:after{
  background:linear-gradient(90deg,rgba(4,8,17,.96) 0%,rgba(4,8,17,.78) 35%,rgba(4,8,17,.12) 62%,rgba(4,8,17,0) 100%);
}
.brand-showcase-copy{
  max-width:500px;
  padding:80px 60px;
}
@media(max-width:900px){
  .hero-art{min-height:auto}
  .hero-art img{width:min(100%,560px);max-height:none}
  .brand-showcase-card{min-height:720px}
  .brand-showcase-card>img{object-fit:contain;object-position:center bottom}
  .brand-showcase-card:after{
    background:linear-gradient(180deg,rgba(4,8,17,.05) 0%,rgba(4,8,17,.25) 40%,rgba(4,8,17,.96) 76%);
  }
  .brand-showcase-copy{padding:35px 28px;margin-top:330px}
}
@media(max-width:620px){
  .hero-art img{border-radius:22px}
  .brand-showcase-card{min-height:680px}
  .brand-showcase-card>img{object-position:center bottom}
}

/* Refined hero treatment for the new global-connect artwork */
.hero-art{
  min-height:700px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0;
}
.hero-art:before{
  width:70%;
  height:62%;
  right:12%;
  top:22%;
  background:rgba(255,196,0,.13);
  filter:blur(95px);
}
.hero-art img{
  width:min(100%,560px);
  height:auto;
  max-height:760px;
  object-fit:contain;
  object-position:center;
  background:transparent;
  border:0;
  border-radius:30px;
  box-shadow:0 32px 100px rgba(0,0,0,.58);
}
@media(max-width:900px){
  .hero-art{min-height:auto}
  .hero-art img{width:min(100%,590px);max-height:none}
}

/* Refined brand showcase: keep artwork large and immersive */
.brand-showcase-card{
  min-height:720px;
  background:#ffc400;
}
.brand-showcase-card>img{
  object-fit:cover;
  object-position:center;
  width:100%;
  height:100%;
  padding:0;
  opacity:1;
  transform:none;
}
.brand-showcase-card:after{
  background:linear-gradient(90deg,
    rgba(4,8,17,.97) 0%,
    rgba(4,8,17,.82) 31%,
    rgba(4,8,17,.28) 56%,
    rgba(4,8,17,.02) 78%);
}
.brand-showcase-copy{
  max-width:520px;
  padding:86px 62px;
}
@media(max-width:900px){
  .brand-showcase-card{min-height:760px}
  .brand-showcase-card>img{object-fit:cover;object-position:center}
  .brand-showcase-card:after{
    background:linear-gradient(180deg,
      rgba(4,8,17,.02) 0%,
      rgba(4,8,17,.25) 38%,
      rgba(4,8,17,.96) 76%);
  }
  .brand-showcase-copy{padding:34px 28px;margin-top:350px}
}

/* Connection setup visual — larger, clearer, no awkward crop */
.split .visual img{
  width:min(100%,560px);
  height:auto;
  max-height:760px;
  object-fit:contain;
  object-position:center;
  background:transparent;
  border:0;
  border-radius:28px;
  box-shadow:0 30px 80px rgba(0,0,0,.48);
}
.split .visual:before{
  inset:12% 10%;
  background:rgba(255,196,0,.08);
  filter:blur(85px);
}
@media(max-width:900px){
  .split .visual img{
    width:min(100%,620px);
    max-height:none;
  }
}

/* Privacy / everyday connection showcase — immersive focal crop */
.brand-showcase-card{
  min-height:720px;
  background:#070d17;
}
.brand-showcase-card>img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:58% center;
  opacity:1;
  transform:scale(1.08);
  transform-origin:center;
  filter:saturate(1.03) contrast(1.02);
}
.brand-showcase-card:after{
  background:
    linear-gradient(90deg,
      rgba(4,8,17,.98) 0%,
      rgba(4,8,17,.88) 28%,
      rgba(4,8,17,.38) 51%,
      rgba(4,8,17,.08) 72%,
      rgba(4,8,17,0) 100%);
}
.brand-showcase-copy{
  position:relative;
  z-index:3;
  max-width:510px;
  padding:86px 62px;
}
@media(max-width:900px){
  .brand-showcase-card{
    min-height:720px;
  }
  .brand-showcase-card>img{
    object-position:62% center;
    transform:scale(1.06);
  }
  .brand-showcase-card:after{
    background:
      linear-gradient(180deg,
        rgba(4,8,17,.05) 0%,
        rgba(4,8,17,.22) 34%,
        rgba(4,8,17,.72) 58%,
        rgba(4,8,17,.98) 82%);
  }
  .brand-showcase-copy{
    padding:34px 28px;
    margin-top:350px;
  }
}
@media(max-width:620px){
  .brand-showcase-card{min-height:680px}
  .brand-showcase-card>img{
    object-position:60% center;
    transform:scale(1.04);
  }
  .brand-showcase-copy{margin-top:320px}
}
