*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#f5f5f1;color:#111820;font-family:"DM Sans",Arial,sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font:inherit}.site-header{height:64px;position:absolute;z-index:20;top:0;left:0;right:0;padding:0 6.7vw;display:grid;grid-template-columns:120px minmax(0,1fr) 180px 32px;column-gap:22px;align-items:center;color:#fff;overflow:visible}.brand{font-size:27px;font-weight:700;letter-spacing:-.07em}.main-nav{display:flex;justify-content:center;align-items:center;gap:34px;min-width:0;white-space:nowrap;overflow:hidden}.main-nav a{font-size:9px;text-transform:none}.company{text-align:left;justify-self:end;width:180px;font:8px/1.25 "DM Mono",monospace;letter-spacing:.13em;white-space:nowrap;position:relative;z-index:25}.company strong{font-size:9px}.menu-btn{margin-left:0;width:27px;height:25px;justify-self:end;position:relative;z-index:25;padding:0;border:0;background:none;display:flex;flex-direction:column;justify-content:center;gap:5px}.menu-btn span{height:2px;background:#fff;width:24px;display:block}
.hero{height:363px;min-height:0;position:relative;overflow:hidden;background:#071726;color:#fff}.hero-media{position:absolute;inset:0;background:url("assets/hero.webp") right center/auto 100% no-repeat, linear-gradient(90deg,#061522 0%,#071a2b 42%,#102c44 100%);transform:scale(1.02)}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(2,13,25,.94) 0%,rgba(2,13,25,.78) 29%,rgba(2,13,25,.12) 59%,rgba(2,13,25,.04) 100%)}.hero-copy{position:absolute;left:8.35%;top:92px;width:405px}.eyebrow,.section-label,.side-index,.text-link,.round-link,.future-cta,.chips{font-family:"DM Mono",monospace;letter-spacing:.13em}.eyebrow{font-size:8px;margin-bottom:31px}.hero h1{margin:0;line-height:.84;letter-spacing:-.06em}.hero h1 span{display:block}.nu-word{font-size:78px;font-weight:700}.hero h1 .sans{font-size:31px;font-weight:500;margin-top:3px}.hero h1 .serif{font:italic 400 34px/.93 "Instrument Serif",Georgia,serif;letter-spacing:-.045em;margin-top:1px}.hero-copy>p{font-size:9px;line-height:1.45;max-width:360px;margin:14px 0 14px;color:#f3f4f5}.round-link{display:flex;align-items:center;gap:13px;font-size:8px;font-weight:500}.round-link span{width:30px;height:30px;border:1px solid currentColor;border-radius:50%;display:grid;place-items:center;font-family:Arial;font-size:15px;letter-spacing:0}.side-index{position:absolute;right:4.5%;top:50%;transform:translateY(-50%);display:grid;gap:17px;font-size:8px}.side-index:before{content:"";position:absolute;left:-13px;top:-12px;bottom:-12px;width:1px;background:rgba(255,255,255,.7)}.side-index span{opacity:.55}
.section-label{display:flex;align-items:center;gap:11px;font-size:8px;letter-spacing:.18em}.section-label b{font-weight:500;letter-spacing:0}.section-label i{width:45px;height:1px;background:#9fa5aa}.section-label.light{color:#fff}.section-label.light i{background:#77808a}
.vision{height:188px;position:relative;overflow:hidden;background:#f5f5f1;padding:18px 4.2%}.vision-grid{margin:15px 0 0 5.5%;display:grid;grid-template-columns:285px 255px;gap:40px;position:relative;z-index:2}.vision h2{margin:0;font-size:28px;line-height:.96;letter-spacing:-.055em}.vision-text{font-size:9px;line-height:1.38}.vision-text p{margin:0 0 10px}.vision-image{position:absolute;right:6.5%;top:0;width:52%;height:100%;background:url("assets/vision-exact.jpg") right center/cover no-repeat}.vision-list{position:absolute;right:4.3%;bottom:28px;display:flex;flex-direction:column;font:8px/1.9 "DM Mono",monospace;letter-spacing:.13em}.vision-list i{width:30px;height:2px;background:#1768ff;margin-bottom:8px}
.areas{height:190px;background:#0b0f14;color:#fff;padding:16px 4.2%;display:grid;grid-template-columns:70px 345px 1fr;gap:20px}.areas-intro{padding-top:19px}.areas-intro h2{font-size:29px;line-height:.95;letter-spacing:-.055em;margin:0}.areas-intro p{font-size:8px;line-height:1.4;color:#d0d5d9;max-width:330px;margin:10px 0}.text-link{font-size:7px;letter-spacing:.14em}.area-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;padding-top:0}.area-cards article{position:relative;height:158px;overflow:hidden;background:#17202b}.card-image{position:absolute;inset:0;background-size:cover;background-position:center}.card-image.one{background-image:url("assets/vision-source.jpg")}.card-image.two{background-image:url("assets/lattice.jpg")}.card-image.three{background-image:url("assets/prosthetic.jpg")}.area-cards article:after{content:"";position:absolute;inset:42% 0 0;background:linear-gradient(transparent,rgba(0,0,0,.9))}.card-copy{position:absolute;z-index:2;left:14px;right:10px;bottom:11px}.card-copy small{font:8px "DM Mono",monospace}.card-copy h3{font-size:15px;line-height:.95;margin:7px 0 0;letter-spacing:-.04em}
.approach{height:190px;background:#f5f5f1;padding:16px 4.2%;display:grid;grid-template-columns:70px 345px 1fr;gap:20px}.approach-intro{padding-top:19px}.approach-intro h2{font-size:28px;line-height:.93;letter-spacing:-.055em;margin:0}.approach-intro p{font-size:8px;line-height:1.4;max-width:300px;margin:9px 0}.dark{margin-top:7px}.process{display:grid;grid-template-columns:1fr 15px 1fr 15px 1fr 15px 1fr;align-items:end;gap:7px;padding-top:0}.process article{position:relative;height:162px;display:grid;grid-template-columns:1fr auto;grid-template-rows:22px 1fr;overflow:hidden;border:1px solid rgba(0,0,0,.12)}.process article small{padding:7px 8px;font:8px "DM Mono",monospace}.process article strong{padding:7px 8px;font-size:11px;line-height:.95}.process article img{grid-column:1/-1;width:100%;height:122px;object-fit:cover;opacity:.85}.process>b{font-size:15px;font-weight:400;text-align:center;padding-bottom:70px}
.future{height:180px;min-height:180px;background:#071a2b;color:#fff;position:relative;overflow:hidden;padding:17px 4.2%;display:grid;grid-template-columns:70px 320px 1fr;gap:20px}.future-copy{padding-top:13px;z-index:4;min-width:0}.future-copy h2{font-size:27px;line-height:.94;letter-spacing:-.055em;margin:0 0 14px;position:relative;z-index:5}.future-copy p{font-size:8px;line-height:1.35;max-width:315px;margin:0;position:relative;z-index:5}.future-image{position:absolute;right:0;top:0;width:46%;height:100%;background:url("assets/bone.jpg") center/cover}.future:after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,#071a2b 0%,#071a2b 36%,rgba(7,26,43,.4) 61%,rgba(7,26,43,0) 100%)}.future .section-label,.future .future-copy{position:relative;z-index:4}.future-cta{position:absolute;right:4.2%;bottom:23px;z-index:4;border:1px solid rgba(255,255,255,.65);border-radius:25px;padding:8px 11px;font-size:7px}.future-cta span{margin-left:15px;font-size:13px}
.possibilities{background:#1268ee;color:#fff;min-height:360px;padding:30px 8.4% 55px}.possibilities-wrap{margin:70px 0 0 5.5%;display:grid;grid-template-columns:1fr 300px;gap:35px}.possibilities h2{font-size:66px;line-height:.8;letter-spacing:-.075em;margin:0}.possibilities h2 em{font:italic 400 1em/.8 "Instrument Serif",Georgia,serif}.possibilities p{font-size:10px;line-height:1.45}.chips{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:7px}.chips span{border:1px solid rgba(255,255,255,.55);border-radius:20px;padding:7px 10px;font-size:7px}
footer{background:#071a2b;color:#fff;padding:40px 8.4% 16px}.footer-main{display:grid;grid-template-columns:1fr 1fr 1fr;min-height:100px;align-items:start;font-size:9px;line-height:1.4}.footer-brand{font-size:62px;font-weight:700;letter-spacing:-.08em}.footer-main a{text-align:right}.footer-bottom{border-top:1px solid rgba(255,255,255,.25);padding-top:12px;display:flex;justify-content:space-between;font:7px "DM Mono",monospace;letter-spacing:.12em;color:#b8c1c9}
@media(min-width:1400px){.hero{height:363px}.hero-copy{top:67px}.nu-word{font-size:80px}.hero h1 .sans,.hero h1 .serif{font-size:36px}.vision{height:188px}.areas,.approach{height:190px}.future{height:140px}}
@media(max-width:900px){.site-header{padding:0 5vw}.main-nav{display:none}.company{display:none}.hero-copy{left:7vw}.vision-grid,.areas,.approach{grid-template-columns:1fr}.vision{height:520px}.vision-image{position:absolute;bottom:0;top:auto;right:0;width:70%;height:55%}.vision-list{right:6%;bottom:18px}.areas{height:auto;min-height:600px}.area-cards{grid-template-columns:1fr;margin-top:25px}.approach{height:auto;min-height:620px}.process{grid-template-columns:1fr 20px 1fr;grid-auto-rows:auto}.process>article:nth-of-type(3),.process>article:nth-of-type(4),.process>b:nth-of-type(3){display:none}.process>b:nth-of-type(2){display:none}.future{height:480px;display:block}.future-copy p{position:static;margin-top:18px}.future-image{width:70%;height:280px;bottom:0;top:auto}.possibilities-wrap{grid-template-columns:1fr;margin-left:0}.possibilities h2{font-size:58px}.footer-main{grid-template-columns:1fr;gap:20px}.footer-main a{text-align:left}}
@media(max-width:560px){
  .site-header{
    height:72px;
    padding:0 24px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    background:rgba(4,18,31,.12);
  }
  .site-header .brand{font-size:34px}
  .site-header .main-nav,
  .site-header .company{display:none}
  .site-header .menu-btn{
    display:flex;
    margin:0;
    width:42px;
    height:38px;
    padding:6px 0;
    gap:6px;
    justify-content:center;
    align-items:flex-end;
    cursor:pointer;
    z-index:100;
  }
  .site-header .menu-btn span{width:32px;height:2px;transition:transform .25s ease,opacity .25s ease}
  body.menu-open .menu-btn span:nth-child(1){transform:translateY(8px) rotate(45deg)}
  body.menu-open .menu-btn span:nth-child(2){opacity:0}
  body.menu-open .menu-btn span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}

  .hero{
    height:760px;
    min-height:760px;
  }
  .hero-media{
    background-image:url("assets/hero-mobile.webp");
    background-size:cover;
    background-position:center center;
  }
  .hero-shade{
    background:
      linear-gradient(180deg,rgba(3,14,25,.42) 0%,rgba(3,14,25,.18) 32%,rgba(3,14,25,.48) 72%,rgba(3,14,25,.86) 100%),
      linear-gradient(90deg,rgba(3,14,25,.78) 0%,rgba(3,14,25,.18) 80%);
  }
  .hero-copy{
    left:24px;
    right:24px;
    top:150px;
    width:auto;
  }
  .eyebrow{
    font-size:7px;
    line-height:1.4;
    margin-bottom:40px;
    white-space:nowrap;
  }
  .hero h1{line-height:.88}
  .nu-word{font-size:78px}
  .hero h1 .sans{
    font-size:43px;
    margin-top:6px;
    letter-spacing:-.06em;
  }
  .hero h1 .serif{
    font-size:47px;
    line-height:.88;
    margin-top:4px;
  }
  .hero-copy>p{
    font-size:11px;
    line-height:1.48;
    max-width:355px;
    margin:24px 0 22px;
  }
  .round-link{font-size:8px}
  .round-link span{width:42px;height:42px}

  /* The page numbers are already part of the supplied banner on the right.
     Hide the HTML copy on mobile to avoid duplication. */
  .side-index{display:none}

  /* Mobile menu panel */
  body.menu-open::before{
    content:"";
    position:fixed;
    inset:0;
    z-index:80;
    background:rgba(2,12,22,.72);
    backdrop-filter:blur(5px);
  }
  body.menu-open::after{
    content:"";
    position:fixed;
    top:0;
    right:0;
    bottom:0;
    width:min(82vw,360px);
    z-index:85;
    background:#071a2b;
    box-shadow:-20px 0 50px rgba(0,0,0,.28);
  }
  body.menu-open .site-header::after{
    content:"VISION\A TECHNOLOGY\A POSSIBILITIES\A APPROACH\A GALLERY\A FUTURE";
    white-space:pre;
    position:fixed;
    top:150px;
    right:0;
    width:min(82vw,360px);
    padding:0 38px;
    z-index:90;
    color:#fff;
    font:500 16px/3 "DM Sans",sans-serif;
    letter-spacing:.01em;
  }

  .vision{
    padding:24px 24px;
    height:620px;
  }
  .vision-grid{margin:30px 0 0;display:block}
  .vision h2{font-size:39px;line-height:.94}
  .vision-text{margin-top:22px;max-width:330px;font-size:10px}
  .vision-image{width:100%;height:285px;bottom:0;right:0}
  .vision-list{display:none}

  .areas,.approach{
    display:block;
    padding:24px;
    height:auto;
    min-height:0;
  }
  .areas-intro,.approach-intro{padding-top:28px}
  .areas-intro h2,.approach-intro h2{font-size:39px}
  .area-cards{grid-template-columns:1fr;margin-top:30px}
  .area-cards article{height:240px}
  .process{display:block;padding-top:25px}
  .process article{height:205px;margin-bottom:12px;display:grid}
  .process>b{display:none!important}

  .future{
    height:540px;
    min-height:540px;
    padding:24px;
    display:block;
  }
  .future-copy{padding-top:28px}
  .future-copy h2{font-size:39px}
  .future-copy p{font-size:10px;max-width:320px}
  .future-image{width:100%;height:280px;bottom:0;top:auto}
  .future-cta{right:24px;bottom:20px}

  .possibilities{padding:28px 24px 55px}
  .possibilities-wrap{display:block;margin:65px 0 0}
  .possibilities h2{font-size:56px}
  .possibilities p{font-size:11px;margin-top:25px}
  .chips{margin-top:28px}

  footer{padding:40px 24px 18px}
  .footer-main{display:block}
  .footer-main>*{margin-bottom:22px}
  .footer-main a{text-align:left}
  .footer-bottom{display:block}
  .footer-bottom>*{display:block;margin-top:10px}
}

.mobile-menu{
  display:none;
}
@media(max-width:560px){
  .mobile-menu{
    display:block;
    position:fixed;
    top:0;
    right:0;
    width:min(82vw,360px);
    height:100vh;
    padding:145px 38px 40px;
    background:#071a2b;
    z-index:90;
    transform:translateX(105%);
    transition:transform .28s ease;
    box-shadow:-20px 0 50px rgba(0,0,0,.28);
  }
  body.menu-open .mobile-menu{transform:translateX(0)}
  .mobile-menu nav{display:flex;flex-direction:column;gap:0}
  .mobile-menu a{
    color:#fff;
    font:500 16px/1 "DM Sans",sans-serif;
    padding:16px 0;
    border-bottom:1px solid rgba(255,255,255,.12);
  }
  body.menu-open::before{
    content:"";
    position:fixed;
    inset:0;
    z-index:80;
    background:rgba(2,12,22,.72);
    backdrop-filter:blur(5px);
  }
  body.menu-open .mobile-menu{z-index:90}
}

/* Nu Ltd full-name branding; keep original layout and responsive menu */
.brand{font-size:25px;letter-spacing:-.065em;white-space:nowrap}
.nu-word{font-size:68px;letter-spacing:-.065em;white-space:nowrap}
.footer-brand{font-size:55px;white-space:nowrap}
@media(max-width:560px){.site-header .brand{font-size:27px}.nu-word{font-size:65px}.footer-brand{font-size:50px}}
@media(max-width:380px){.nu-word{font-size:58px}.footer-brand{font-size:44px}}