:root{
  --ink:#0d2b30; --teal:#0f6d78; --teal-deep:#0a4a52; --mist:#e8f1f0;
  --paper:#fbfdfc; --line:#d3e2e0; --accent:#f2a341; --muted:#5b7377;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Segoe UI',-apple-system,system-ui,sans-serif;color:var(--ink);background:var(--paper);line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
.wrap{max-width:1160px;margin:0 auto;padding:0 28px}
h1,h2,h3{line-height:1.15;letter-spacing:-.02em;font-weight:650}

/* nav */
header{position:sticky;top:0;z-index:50;background:rgba(251,253,252,.88);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
nav{display:flex;align-items:center;justify-content:space-between;height:70px}
.brand{display:flex;align-items:center;gap:11px;font-weight:700;font-size:1.12rem;letter-spacing:-.01em}
.mark{width:30px;height:30px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#2aa5b0,var(--teal-deep));position:relative;flex:none}
.mark::after{content:"";position:absolute;inset:8px;border-radius:50%;background:var(--paper)}
.mark::before{content:"";position:absolute;left:50%;top:50%;width:6px;height:6px;border-radius:50%;background:var(--accent);transform:translate(-50%,-50%);z-index:2}
.navlinks{display:flex;gap:30px;align-items:center;font-size:.94rem;font-weight:550}
.navlinks a{color:var(--muted);transition:color .2s}
.navlinks a:hover,.navlinks a.active{color:var(--teal)}
.btn{display:inline-block;background:var(--teal);color:#fff;padding:11px 22px;border-radius:8px;font-weight:600;font-size:.92rem;transition:background .2s,transform .2s;cursor:pointer;border:0}
.btn:hover{background:var(--teal-deep);transform:translateY(-1px)}
/* nav CTA: solid, high-contrast so it's always visible */
.navlinks a.btn{background:var(--teal);color:#fff;box-shadow:0 2px 8px -2px rgba(15,109,120,.5)}
.navlinks a.btn:hover{background:var(--teal-deep);color:#fff}
/* button sitting on a green band */
.band .btn{background:#fff;color:var(--teal-deep)}
.band .btn:hover{background:var(--mist);color:var(--teal-deep)}
.btn.ghost{background:transparent;color:var(--teal);border:1.5px solid var(--line)}
.btn.ghost:hover{border-color:var(--teal);background:var(--mist)}
.menu-btn{display:none;background:none;border:0;font-size:1.5rem;color:var(--ink);cursor:pointer}

/* hero */
.hero{padding:84px 0 72px;background:linear-gradient(160deg,#fff 0%,var(--mist) 100%)}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center}
.eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:.78rem;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--teal);margin-bottom:20px}
.eyebrow::before{content:"";width:22px;height:2px;background:var(--accent)}
.hero h1{font-size:3.05rem;margin-bottom:20px}
.hero p.lead{font-size:1.16rem;color:var(--muted);max-width:40ch;margin-bottom:30px}
.hero-cta{display:flex;gap:14px;flex-wrap:wrap}
.retina{aspect-ratio:1;border-radius:22px;background:
   radial-gradient(circle at 62% 42%,#ffd27a 0%,#e8892b 8%,transparent 9%),
   radial-gradient(circle at 38% 55%,#5a1e12 0%,transparent 26%),
   radial-gradient(circle at 50% 50%,#c94f2c 0%,#8f2d18 60%,#5d1a0e 100%);
   box-shadow:0 30px 60px -20px rgba(10,74,82,.4);position:relative;overflow:hidden}
.retina::after{content:"";position:absolute;inset:0;background:
   repeating-radial-gradient(circle at 62% 42%,transparent 0 14px,rgba(255,180,90,.10) 14px 15px);mix-blend-mode:screen}
.retina .vessels{position:absolute;inset:0}
.retina .vessels path{stroke:#7a2415;stroke-width:2.2;fill:none;opacity:.55;stroke-linecap:round}
.ph-note{position:absolute;left:12px;bottom:12px;background:rgba(13,43,48,.72);color:#cfe6e4;font-size:.68rem;letter-spacing:.04em;padding:5px 9px;border-radius:6px;font-weight:600}

/* trust strip */
.strip{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:#fff}
.strip .wrap{display:flex;justify-content:space-between;gap:20px;padding:26px 28px;flex-wrap:wrap}
.stat b{display:block;font-size:1.55rem;color:var(--teal-deep);letter-spacing:-.02em}
.stat span{font-size:.85rem;color:var(--muted)}

/* sections */
section.pad{padding:76px 0}
.sec-head{max-width:62ch;margin-bottom:46px}
.sec-head h2{font-size:2.1rem;margin-bottom:14px}
.sec-head p{color:var(--muted);font-size:1.05rem}
.sec-head.centered{margin-left:auto;margin-right:auto;text-align:center}
.sec-head.centered .eyebrow{justify-content:center}
.sec-head.centered p{margin-left:auto;margin-right:auto}

.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:30px;transition:transform .2s,box-shadow .2s}
.card:hover{transform:translateY(-4px);box-shadow:0 18px 40px -22px rgba(15,109,120,.45)}
.card .ico{width:46px;height:46px;border-radius:11px;background:var(--mist);display:grid;place-items:center;margin-bottom:18px;color:var(--teal)}
.card h3{font-size:1.16rem;margin-bottom:9px}
.card p{color:var(--muted);font-size:.95rem}

.band{background:var(--teal-deep);color:#dff0ee}
.band h2{color:#fff}
.band .sec-head p{color:#a7ccc9}
.split{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center}
.feat-list{list-style:none;display:grid;gap:18px}
.feat-list li{display:flex;gap:14px;align-items:flex-start}
.feat-list .dot{flex:none;width:24px;height:24px;border-radius:50%;background:var(--accent);color:#3a2200;display:grid;place-items:center;font-size:.8rem;font-weight:800;margin-top:2px}
.feat-list h4{color:#fff;font-size:1.02rem;margin-bottom:2px}
.feat-list p{color:#a7ccc9;font-size:.92rem}
.band.light{background:var(--mist);color:var(--ink)}
.band.light h2{color:var(--ink)}
.band.light .feat-list h4{color:var(--ink)}
.band.light .feat-list p{color:var(--muted)}

/* device placeholder */
.device{aspect-ratio:4/3;border-radius:18px;background:linear-gradient(145deg,#12808c,#0a4a52);display:grid;place-items:center;box-shadow:inset 0 2px 30px rgba(0,0,0,.3);position:relative}
.device .body{width:56%;height:70%;background:#e9f2f1;border-radius:16px 16px 20px 20px;position:relative;box-shadow:0 20px 40px -12px rgba(0,0,0,.45)}
.device .lens{position:absolute;top:14%;left:50%;transform:translateX(-50%);width:42%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 40% 40%,#333,#000);border:5px solid #cfdedc}
.device .lens::after{content:"";position:absolute;inset:26%;border-radius:50%;background:radial-gradient(circle at 40% 40%,#2aa5b0,#0a4a52)}
.device .screen{position:absolute;bottom:12%;left:50%;transform:translateX(-50%);width:64%;height:30%;background:#0d2b30;border-radius:6px}
.device.phone .body{width:34%;border-radius:20px}
.device.phone .lens{width:52%;top:20%}
.device.phone .screen{height:44%;bottom:9%}

/* mission / vision */
.mv{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.mv .box{background:#fff;border:1px solid var(--line);border-left:4px solid var(--teal);border-radius:14px;padding:32px}
.mv .box h3{font-size:1.05rem;color:var(--teal);letter-spacing:.04em;text-transform:uppercase;font-size:.82rem;margin-bottom:12px;font-weight:700}
.mv .box p{font-size:1.02rem;color:var(--ink);line-height:1.55;margin-bottom:14px}
.mv .box p:last-child{margin-bottom:0}

/* gallery */
.gallery-wrap{position:relative}
.gallery{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;padding:6px 2px 18px;scroll-behavior:smooth}
.gallery::-webkit-scrollbar{height:8px}
.gallery::-webkit-scrollbar-thumb{background:var(--line);border-radius:20px}
.shot{flex:none;width:300px;scroll-snap-align:start}
.shot .frame{aspect-ratio:1;border-radius:14px;overflow:hidden;position:relative;background:
   radial-gradient(circle at 58% 44%,#ffd27a 0%,#e8892b 7%,transparent 8%),
   radial-gradient(circle at 50% 50%,#c94f2c 0%,#8f2d18 62%,#521608 100%);
   border:1px solid var(--line)}
.shot .frame.b{background:
   radial-gradient(circle at 44% 40%,#ffe1a0 0%,#e8892b 6%,transparent 7%),
   radial-gradient(circle at 50% 50%,#a83d22 0%,#6d2413 65%,#3d1109 100%)}
.shot .frame.c{background:
   radial-gradient(circle at 60% 56%,#ffcf7a 0%,#d9702b 7%,transparent 8%),
   radial-gradient(circle at 50% 50%,#c25a2e 0%,#7d2a17 60%,#4a1409 100%)}
.shot .frame svg path{stroke:#6a1e10;stroke-width:2;fill:none;opacity:.5}
.shot .frame .ph-note{font-size:.62rem}
.shot p{font-size:.86rem;color:var(--muted);margin-top:10px}
.gbtn{position:absolute;top:calc(50% - 30px);transform:translateY(-50%);width:44px;height:44px;border-radius:50%;border:0;background:rgba(255,255,255,.82);backdrop-filter:blur(4px);box-shadow:0 4px 16px -4px rgba(10,74,82,.4);color:var(--teal-deep);font-size:1.3rem;cursor:pointer;display:grid;place-items:center;z-index:3;transition:background .2s}
.gbtn:hover{background:#fff}
.gbtn.prev{left:-6px}
.gbtn.next{right:-6px}
/* real image inside gallery frame */
.shot .frame img{width:100%;height:100%;object-fit:cover;display:block}

/* home hero real image */
.retina.has-img{background:#fff}
.retina.has-img img{width:100%;height:100%;object-fit:cover;display:block;border-radius:22px}

/* product image carousel (Technology) */
.prodcar{position:relative}
.prodcar .track{display:flex;gap:0;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;border-radius:18px;box-shadow:0 20px 44px -20px rgba(10,74,82,.5)}
.prodcar .track::-webkit-scrollbar{display:none}
.prodcar .track{scrollbar-width:none}
.prodcar .slide{flex:none;width:100%;aspect-ratio:4/3;scroll-snap-align:center;background:#e9f0ef}
.prodcar .slide img{width:100%;height:100%;object-fit:contain;display:block;background:#eef3f2}
.prodcar .dots{display:flex;gap:8px;justify-content:center;margin-top:14px}
.prodcar .dots button{width:9px;height:9px;border-radius:50%;border:0;background:var(--line);cursor:pointer;padding:0;transition:background .2s}
.prodcar .dots button.on{background:var(--teal)}
.band .prodcar .slide,.band .prodcar .slide img{background:#0e5a63}

/* timeline */
.timeline{position:relative;margin-top:10px;padding-left:34px}
.timeline::before{content:"";position:absolute;left:9px;top:8px;bottom:8px;width:2px;background:var(--line)}
.tl-item{position:relative;padding:0 0 34px}
.tl-item:last-child{padding-bottom:0}
.tl-item::before{content:"";position:absolute;left:-30px;top:5px;width:16px;height:16px;border-radius:50%;background:#fff;border:3px solid var(--teal)}
.tl-item.done::before{background:var(--teal)}
.tl-tag{font-size:.74rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--teal)}
.tl-item h3{font-size:1.14rem;margin:6px 0 4px}
.tl-item .award{font-family:'SF Mono',ui-monospace,monospace;font-size:.86rem;color:var(--muted);margin-bottom:6px}
.tl-item p{color:var(--muted);font-size:.96rem;max-width:60ch}

/* publications */
.pub{background:#fff;border:1px solid var(--line);border-radius:14px;padding:24px 26px;margin-bottom:16px}
.pub .lbl{font-size:.72rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--accent);margin-bottom:8px}
.pub h4{font-size:1.06rem;line-height:1.4;font-weight:600}
.pub h4 a{color:var(--teal-deep);transition:color .2s}
.pub h4 a:hover{color:var(--teal);text-decoration:underline}
.pub .cite{margin-top:8px;font-size:.9rem;color:var(--muted)}
.pub .cite em{font-style:italic}

/* generic prose */
.prose{max-width:70ch}
.prose p{color:var(--muted);margin-bottom:16px;font-size:1.04rem}
.prose p strong{color:var(--ink)}
/* balanced two-column text section */
.two-col{display:grid;grid-template-columns:0.85fr 1.15fr;gap:52px;align-items:start}
.two-col-head h2{font-size:2rem;margin-bottom:14px;line-height:1.15}
.two-col-head p{color:var(--muted);font-size:1.05rem}
.two-col .prose{max-width:none}
.two-col .prose p:last-child{margin-bottom:0}
@media(max-width:860px){.two-col{grid-template-columns:1fr;gap:26px}}

/* final cta */
.final{padding:70px 0;text-align:center}
.final h2{font-size:2.1rem;margin-bottom:14px}
.final p{color:var(--muted);max-width:56ch;margin:0 auto 26px}

/* contact */
.field{display:grid;gap:6px}
.field label{font-size:.85rem;font-weight:600}
.field input,.field textarea{padding:12px;border:1px solid var(--line);border-radius:8px;font-size:1rem;font-family:inherit}
.field input:focus,.field textarea:focus{outline:0;border-color:var(--teal)}
.info-box{background:var(--mist);border-radius:16px;padding:32px}
.info-box h3{font-size:1.2rem;margin-bottom:18px}
.info-box p{color:var(--muted);margin-bottom:4px}
.info-box strong{color:var(--ink)}

/* footer */
footer{background:var(--ink);color:#9fb6b8;padding:52px 0 30px;font-size:.9rem}
.foot-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:36px;margin-bottom:30px}
footer .brand{color:#fff;margin-bottom:12px}
footer h5{color:#fff;font-size:.82rem;letter-spacing:.1em;text-transform:uppercase;margin-bottom:14px}
footer a{display:block;color:#9fb6b8;margin-bottom:8px;transition:color .2s}
footer a:hover{color:var(--accent)}
.disclaimer{border-top:1px solid #1e474c;padding-top:22px;margin-bottom:18px;font-size:.82rem;color:#7fa0a2;max-width:none;line-height:1.55}
.foot-base{display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;font-size:.82rem;color:#6f8e90}

@media(max-width:860px){
  .hero-grid,.split,.foot-grid,.mv,.cards{grid-template-columns:1fr}
  .hero h1{font-size:2.3rem}
  .navlinks{display:none}
  .menu-btn{display:block}
  .navlinks.open{display:flex;position:absolute;top:70px;left:0;right:0;flex-direction:column;background:#fff;padding:20px 28px;border-bottom:1px solid var(--line);gap:16px}
  .gbtn{display:none}
}

/* ---- Technology: light-path diagram ---- */
.diagram-card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:34px;box-shadow:0 18px 40px -26px rgba(15,109,120,.4)}
.diagram-head{max-width:60ch;margin-bottom:18px}
.diagram-head h3{font-size:1.4rem;margin:10px 0 8px}
.diagram-head p{color:var(--muted);font-size:1rem}
.lightpath{width:100%;height:auto;display:block;margin:6px 0}
.legend{display:flex;gap:26px;flex-wrap:wrap;margin-top:12px;font-size:.9rem;color:var(--muted)}
.legend .sw{display:inline-block;width:14px;height:14px;border-radius:3px;margin-right:7px;vertical-align:-2px}

/* ---- award links on timeline ---- */
.award-links{display:flex;gap:20px;flex-wrap:wrap;margin-top:10px}
.award-links a{font-size:.9rem;font-weight:600;color:var(--teal);transition:color .2s}
.award-links a:hover{color:var(--teal-deep);text-decoration:underline}

/* ---- About us: scrollable news box ---- */
.newsbox{max-height:420px;overflow-y:auto;border:1px solid var(--line);border-radius:16px;background:#fff;padding:6px 6px 6px 0}
.newsbox::-webkit-scrollbar{width:10px}
.newsbox::-webkit-scrollbar-thumb{background:var(--line);border-radius:20px}
.newsbox::-webkit-scrollbar-track{background:transparent}
.news-item{padding:22px 26px;border-bottom:1px solid var(--line)}
.news-item:last-child{border-bottom:0}
.news-date{font-size:.74rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--accent)}
.news-item h4{font-size:1.1rem;margin:6px 0 6px}
.news-item p{color:var(--muted);font-size:.95rem;margin-bottom:8px}
.news-item a{font-size:.9rem;font-weight:600;color:var(--teal)}
.news-item a:hover{color:var(--teal-deep);text-decoration:underline}

/* funding notes + award links */
.funding-note{font-size:.9rem;color:var(--muted);max-width:80ch;margin-top:16px;line-height:1.55}
.funding-note a{color:var(--teal);font-weight:600}
.funding-note a:hover{color:var(--teal-deep);text-decoration:underline}
.tl-item .award a{color:var(--teal);font-weight:600}
.tl-item .award a:hover{color:var(--teal-deep);text-decoration:underline}

/* leadership */
.leaders-wrap{position:relative}
.leaders{display:flex;gap:24px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;padding:6px 2px 18px}
.leaders::-webkit-scrollbar{height:8px}
.leaders::-webkit-scrollbar-thumb{background:var(--line);border-radius:20px}
.leader{flex:none;width:min(560px,86vw);scroll-snap-align:start;background:#fff;border:1px solid var(--line);border-radius:18px;padding:30px;display:grid;grid-template-columns:130px 1fr;gap:24px;align-items:start}
.leader .photo{width:130px;height:130px;border-radius:14px;background:linear-gradient(150deg,var(--mist),#cfe0de);display:grid;place-items:center;color:var(--teal-deep);overflow:hidden;border:1px solid var(--line)}
.leader .photo img{width:100%;height:100%;object-fit:cover}
.leader .photo svg{width:56px;height:56px;opacity:.55}
.leader h3{font-size:1.18rem;margin-bottom:3px;line-height:1.2}
.leader .role{color:var(--teal);font-weight:650;font-size:.9rem;margin-bottom:12px}
.leader .bio{color:var(--muted);font-size:.9rem;line-height:1.55;max-height:230px;overflow-y:auto;padding-right:8px}
.leader .bio::-webkit-scrollbar{width:6px}
.leader .bio::-webkit-scrollbar-thumb{background:var(--line);border-radius:20px}
.leader .bio p{margin-bottom:10px}
.leader .bio p:last-child{margin-bottom:0}
@media(max-width:620px){.leader{grid-template-columns:1fr;text-align:center}.leader .photo{margin:0 auto}.leader .bio{text-align:left}}