:root{font:15px/1.45 Arial,Helvetica,sans-serif;color:#0b2042;background:#fff}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0}a{color:inherit}button,input{font:inherit}a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid #00d5e8;outline-offset:3px}.shell{max-width:824px;margin:0 auto;background:#fff;min-height:100vh;box-shadow:0 0 25px #092c421a}.header{height:63px;background:#031b39;display:flex;align-items:center;padding:0 35px;gap:20px;color:#fff}.brand{display:block;flex:none;width:244px;height:52px;background:url('/eye-health-approved.jpg') -34px -5px/822px auto no-repeat;overflow:hidden}.brand span{position:absolute;clip:rect(0,0,0,0)}.nav{display:flex;align-items:center;justify-content:space-between;flex:1;gap:11px}.nav a{text-decoration:none;font-size:10px;white-space:nowrap}.nav a:hover,.nav a.active{color:#54def4;border-bottom:2px solid #47d9ee;padding-bottom:6px}.hero{height:278px;background:#032048;color:#fff;position:relative;overflow:hidden}.hero-img{position:absolute;top:0;right:0;width:57%;height:100%;background-repeat:no-repeat;z-index:0}.hero-copy{padding:26px 39px;position:relative;z-index:1;width:54%;pointer-events:none}.hero-copy>*{pointer-events:auto}.kicker{color:#64e5ef;font-weight:600;letter-spacing:3.2px;font-size:10px}.hero h1{margin:9px 0 13px;font-size:clamp(43px,6vw,57px);line-height:1.02;letter-spacing:-1px}.hero h1 em{font-style:normal;color:#40e1f2}.hero p{font-size:17px;line-height:1.25;margin:11px 0;max-width:350px}.cta{display:inline-flex;text-decoration:none;align-items:center;border:0;border-radius:30px;padding:10px 18px;margin-top:9px;color:#062342;font-size:12px;font-weight:700;background:#4fe1ef}.cta:hover{background:#a1f8ff}.chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:13px;color:#e4fbff;font-size:10px}.chips span{padding:5px 9px;border:1px solid #47a5c5;border-radius:20px}.main{padding:16px 35px}.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}.card{min-width:0;display:flex;flex-direction:column;overflow:hidden;border-radius:9px;background:#fff;box-shadow:0 3px 20px #1143751b}.photo{height:111px;background-repeat:no-repeat;background-color:#114b78;flex-shrink:0}.card-copy{padding:16px 13px 13px;display:flex;flex-direction:column;flex:1}.card h2{font-size:15px;line-height:1.2;margin:0 0 8px}.card p{font-size:12px;color:#41516b;margin:0 0 14px;flex:1;line-height:1.38}.card a{font-size:12px;color:#0085be;text-decoration:none;font-weight:600}.card a:hover{text-decoration:underline}.tag{align-self:flex-start;background:#e3f3fc;border-radius:20px;color:#1c5989;font-size:10px;padding:4px 11px;margin-bottom:10px}.wide{background:#e4f4ff;border-radius:11px;padding:20px;margin-top:17px}.wide h2{margin:0 0 6px;font-size:22px;line-height:1.2}.wide p{font-size:12px;color:#405775;margin:0 0 12px}.minirow{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.minirow>div{padding:10px;border-right:1px solid #b8d6eb;font-size:12px}.minirow>div:last-child{border:0}.minirow strong{display:block;margin-bottom:3px}.founder{display:flex;align-items:center;gap:21px;padding:21px 34px;background:linear-gradient(95deg,#e5f6ff,#fff)}.founder img{width:177px;height:132px;object-fit:cover;object-position:center 18%;border-radius:8px}.founder .eyebrow{letter-spacing:2px;color:#108fc0;font-size:10px}.founder h2{font-size:20px;margin:5px 0 2px;line-height:1.2}.founder p{font-size:12px;color:#405471;margin:8px 0}.founder a{color:#0086bb;font-size:12px;text-decoration:none}.contact{display:flex;justify-content:space-between;gap:20px;padding:17px 37px;background:linear-gradient(110deg,#031b39,#105b95);color:white}.contact h2{font-size:20px;margin:1px 0}.contact p{font-size:11px;margin:4px 0}.contact a{font-size:12px;color:white}.copyright{display:flex;justify-content:space-between;align-items:center;background:#031830;color:#a8b8cc;padding:9px 30px;font-size:10px;gap:10px}.copyright .smallbrand{letter-spacing:4px;color:white}.search{display:flex;background:#fff;border-radius:40px;max-width:380px;padding:4px;margin:12px 0}.search input{flex:1;min-width:0;border:0;background:transparent;padding:11px 15px;outline-offset:2px}.search button{border:0;width:39px;height:39px;border-radius:50%;background:#4de0ee;cursor:pointer}.filters{display:flex;justify-content:space-between;flex-wrap:wrap;gap:7px;margin-bottom:14px}.filters button{padding:8px 12px;border-radius:22px;background:#f5fbff;border:1px solid #cfe1ef;color:#18456c;font-size:11px;cursor:pointer}.filters button.selected{background:#0792d0;border-color:#0792d0;color:white}.detail{background:#f3fbff;border:1px solid #bcdae9;padding:18px;border-radius:12px;margin-top:15px;line-height:1.6}.detail[hidden]{display:none}.article{display:flex;align-items:center;justify-content:space-between;gap:15px;border-radius:8px;background:#fff;padding:16px;box-shadow:0 3px 13px #0a335e1a}.article b{font-size:14px}.article a{border:1px solid #1099c5;border-radius:30px;padding:10px 15px;text-decoration:none;white-space:nowrap;font-size:12px;color:#087bac}.label{font-size:9px;letter-spacing:2px;color:#1495b7;display:block}.disclaimer{font-size:11px;padding:12px 16px;text-align:center;color:#435674;background:#eaf6ff}.inset{font-size:12px;color:#557084}.home-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.home-grid .photo{height:115px}.home-grid .card-copy{padding:11px}.home-grid h2{font-size:13px}.home-grid p{font-size:11px}.home-grid a{font-size:11px}.hide{display:none!important}
@media(max-width:700px){.shell{max-width:100%;}.header{height:auto;min-height:67px;padding:8px 15px;flex-wrap:wrap;gap:5px}.brand{width:225px}.nav{width:100%;flex:auto;overflow-x:auto;justify-content:flex-start;gap:16px;padding:7px 0}.hero-copy{width:70%;padding:25px 20px}.hero-img{opacity:.7;width:60%}.hero h1{font-size:46px}.main{padding:15px}.founder{padding:20px}.contact{padding:18px}.home-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:490px){.hero-copy{width:100%;background:linear-gradient(90deg,#041c3fe8,#041c3f54)}.hero-img{width:100%;opacity:.4}.hero h1{font-size:41px}.hero p{font-size:15px}.cards{grid-template-columns:1fr}.photo{height:155px}.minirow{grid-template-columns:1fr}.minirow>div{border-right:0;border-bottom:1px solid #b8d6eb}.founder{flex-direction:column;align-items:flex-start}.contact{flex-direction:column}.article{flex-direction:column;align-items:flex-start}.home-grid{grid-template-columns:1fr}.copyright{flex-direction:column;align-items:flex-start}}

/* Fidelity pass: the original screenshots determine section geometry and typography. */
.shell{max-width:1024px}
.header{height:76px;padding:0 44px;gap:34px}
.brand{width:292px;height:58px;background-image:url('/approved-homepage.jpg');background-position:-44px -12px;background-size:1024px 1536px}
.nav a{font-size:12px}
.hero{height:430px}
.hero-copy{padding:36px 50px;width:54%}
.hero h1{font-size:clamp(50px,6.3vw,70px)}
.hero p{font-size:21px;line-height:1.35}
.hero-img{width:61%;height:100%;filter:none;mask-image:linear-gradient(90deg,transparent 0%,black 18%);-webkit-mask-image:linear-gradient(90deg,transparent 0%,black 18%)}
.main{padding:23px 44px}
.cards{gap:17px}
.photo{height:145px}
.card-copy{padding:18px 17px}
.card h2{font-size:18px}
.card p{font-size:14px;line-height:1.43}
.card a{font-size:14px}
.home-grid{gap:15px}
.home-grid .photo{height:140px}
.home-grid .card h2{font-size:17px}
.home-grid .card p{font-size:14px}
.home-grid .card a{font-size:14px}
.home-grid .card-copy{padding:17px}
.founder{min-height:330px;gap:30px;padding:18px 44px}
.founder img{width:305px;height:305px;object-fit:cover;object-position:center top;border-radius:0}
.founder h2{font-size:29px}
.founder p{font-size:16px}
.contact{padding:30px 48px}
.contact h2{font-size:26px}.contact p{font-size:14px}.contact a{font-size:15px}
.copyright{padding:15px 40px}
.shell:has(#topic-search){max-width:822px}
.shell:has(#topic-search) .header{height:62px;padding:0 36px;gap:20px}
.shell:has(#topic-search) .brand{width:230px;height:49px;background:url('/eye-health-approved.jpg') -35px -8px/822px 1240px no-repeat}
.shell:has(#topic-search) .nav a{font-size:10px}
.shell:has(#topic-search) .hero{height:278px}
.shell:has(#topic-search) .hero-copy{padding:27px 40px}
.shell:has(#topic-search) .hero h1{font-size:55px}
.shell:has(#topic-search) .hero p{font-size:18px}
.shell:has(#topic-search) .main{padding:15px 36px}
.shell:has(#topic-search) .photo{height:110px}
.shell:has(#topic-search) .card-copy{padding:17px 15px}
.shell:has(#topic-search) .card h2{font-size:16px}
.shell:has(#topic-search) .card p{font-size:12px}
.shell:has(#topic-search) .founder{min-height:0}
.shell:not(:has(.home-grid)):not(:has(#topic-search)){max-width:824px}
.shell:not(:has(.home-grid)):not(:has(#topic-search)) .header{height:62px;padding:0 36px;gap:20px}
.shell:not(:has(.home-grid)):not(:has(#topic-search)) .brand{width:230px;height:49px;background:url('/research-approved.jpg') -35px -8px/824px 1244px no-repeat}
.shell:not(:has(.home-grid)):not(:has(#topic-search)) .nav a{font-size:10px}
.shell:not(:has(.home-grid)):not(:has(#topic-search)) .hero{height:277px}
.shell:not(:has(.home-grid)):not(:has(#topic-search)) .hero-copy{padding:26px 39px}
.shell:not(:has(.home-grid)):not(:has(#topic-search)) .hero h1{font-size:54px}
.shell:not(:has(.home-grid)):not(:has(#topic-search)) .hero p{font-size:18px}
.shell:not(:has(.home-grid)):not(:has(#topic-search)) .main{padding:16px 36px}
.shell:not(:has(.home-grid)):not(:has(#topic-search)) .photo{height:110px}
.shell:not(:has(.home-grid)):not(:has(#topic-search)) .card-copy{padding:17px 15px}
.shell:not(:has(.home-grid)):not(:has(#topic-search)) .card h2{font-size:16px}
.shell:not(:has(.home-grid)):not(:has(#topic-search)) .card p{font-size:12px}
.shell:not(:has(.home-grid)):not(:has(#topic-search)) .founder{padding:17px 35px;min-height:0}
.shell:not(:has(.home-grid)):not(:has(#topic-search)) .founder img{width:180px;height:135px}
.shell:not(:has(.home-grid)):not(:has(#topic-search)) .founder h2{font-size:20px}
.shell:not(:has(.home-grid)):not(:has(#topic-search)) .founder p{font-size:12px}
@media(max-width:750px){.shell{width:100%}.header,.shell:has(#topic-search) .header,.shell:not(:has(.home-grid)):not(:has(#topic-search)) .header{height:auto;min-height:62px;padding:10px 16px}.hero-copy,.shell:has(#topic-search) .hero-copy{padding:26px 22px}.nav{width:100%;overflow-x:auto;flex:1 0 100%;padding:8px 0}.main,.shell:has(#topic-search) .main,.shell:not(:has(.home-grid)):not(:has(#topic-search)) .main{padding:16px}.founder{padding:20px}.home-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:490px){.hero,.shell:has(#topic-search) .hero,.shell:not(:has(.home-grid)):not(:has(#topic-search)) .hero{height:auto;min-height:330px}.hero-img{opacity:.38;width:100%}.hero-copy{width:100%;padding:28px 20px}.hero h1,.shell:has(#topic-search) .hero h1{font-size:45px}.cards,.home-grid{grid-template-columns:1fr}.founder img{width:210px;height:210px}.nav a{font-size:12px}}

/* October 27 visual QA corrections: prevent clipping and align page headers. */
.header{gap:14px;justify-content:space-between}
.nav{min-width:0;gap:clamp(7px,1.05vw,13px);flex-wrap:wrap;justify-content:flex-end}
.nav a{line-height:1.5;white-space:nowrap}
.hero{min-height:430px;height:auto}
.hero-copy{min-height:430px;height:auto;display:flex;flex-direction:column;justify-content:center}
.hero-copy p{overflow-wrap:break-word;max-width:100%;font-size:clamp(16px,1.8vw,20px)}
.hero-copy h1{overflow-wrap:break-word}
.home-grid .card{min-width:0;overflow:hidden}
.home-grid .card h2,.home-grid .card p{overflow-wrap:break-word}
.home-grid .photo{background-color:#12436c}
.shell:not(:has(.home-grid)):not(:has(#topic-search)) .hero{min-height:300px;height:auto}
.shell:not(:has(.home-grid)):not(:has(#topic-search)) .hero-copy{min-height:300px;width:61%;padding:22px 33px}
.shell:not(:has(.home-grid)):not(:has(#topic-search)) .hero-copy p{font-size:16px;line-height:1.35}
.shell:not(:has(.home-grid)):not(:has(#topic-search)) .header{gap:10px}
.shell:not(:has(.home-grid)):not(:has(#topic-search)) .nav{gap:7px}
.shell:not(:has(.home-grid)):not(:has(#topic-search)) .nav a{font-size:10px}
@media(min-width:751px){.home-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:750px){
 .header,.shell:has(#topic-search) .header,.shell:not(:has(.home-grid)):not(:has(#topic-search)) .header{display:flex;flex-wrap:wrap;height:auto}
 .header .nav{width:100%;min-width:0;flex:1 0 100%;display:flex;justify-content:flex-start;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:thin}
 .hero,.shell:not(:has(.home-grid)):not(:has(#topic-search)) .hero{min-height:340px}
 .hero-copy,.shell:not(:has(.home-grid)):not(:has(#topic-search)) .hero-copy{min-height:340px;width:min(100%,600px);padding:27px 21px;background:linear-gradient(90deg,#041b3bf2,#041b3bb5 65%,transparent)}
 .hero-img{opacity:.48}
}
@media(max-width:490px){
 .hero,.shell:not(:has(.home-grid)):not(:has(#topic-search)) .hero{min-height:350px}
 .hero-copy,.shell:not(:has(.home-grid)):not(:has(#topic-search)) .hero-copy{min-height:350px;width:100%}
 .hero-copy h1,.shell:not(:has(.home-grid)):not(:has(#topic-search)) .hero h1{font-size:clamp(34px,10vw,45px);line-height:1.07}
 .hero-copy p{font-size:15px!important;line-height:1.4!important}
 .chips{flex-wrap:wrap}
 .home-grid{grid-template-columns:1fr}
}
