.retina3d{--navy: #07143f; --blue: #2452d6; --yellow: #f7bd22; --teal: #087f8c; --ink: #131927; --muted: #5d6675; --line: #dce3ec; --surface: #f3f6f9;}
.retina3d *{box-sizing: border-box;}

.retina3d{margin: 0px; font-family: Inter, Arial, sans-serif; color: var(--ink); line-height: 1.6; letter-spacing: 0px;}
.retina3d h1,.retina3d h2,.retina3d h3,.retina3d p{margin-top: 0px;}
.retina3d h1,.retina3d h2,.retina3d h3{line-height: 1.15;}
.retina3d a{color: inherit;}
.retina3d button,.retina3d input,.retina3d textarea,.retina3d select{font: inherit;}
.retina3d button,.retina3d a,.retina3d input,.retina3d select,.retina3d textarea,.retina3d summary{touch-action: manipulation;}
.retina3d :focus-visible{outline: 3px solid var(--teal); outline-offset: 4px;}
.retina3d [hidden]{display: none !important;}
.retina3d .container{width: min(1240px, 100% - 48px); margin: auto;}
.retina3d .skip{position: fixed; left: 10px; top: -100px; z-index: 10; background: white; padding: 12px;}
.retina3d .skip:focus{top: 10px;}
.retina3d .preview{padding: 8px 20px; text-align: center; background: rgb(255, 245, 217); color: rgb(103, 70, 0); font-size: 11px; font-weight: 800;}
.retina3d .preview span{font-weight: 400; margin-left: 15px;}
.retina3d header{background: white; border-bottom: 1px solid var(--line);}
.retina3d .header-inner{min-height: 90px; display: flex; align-items: center; gap: 40px;}
.retina3d .logo{width: 205px; height: auto; display: block;}
.retina3d .header-inner nav{display: flex; gap: 28px; margin-left: auto; font-size: 14px; font-weight: 600;}
.retina3d .header-inner nav a{text-decoration: none;}
.retina3d .header-inner nav a:hover{color: var(--blue);}
.retina3d .button{display: inline-flex; align-items: center; justify-content: center; gap: 18px; border: 1px solid var(--blue); background: var(--blue); color: white; padding: 14px 22px; min-height: 50px; border-radius: 6px; text-decoration: none; font-size: 14px; line-height: 1.4; font-weight: 700; cursor: pointer; text-align: center;}
.retina3d .button:hover{filter: brightness(0.93);}
.retina3d .yellow{background: var(--yellow); border-color: var(--yellow); color: var(--ink);}
.retina3d .small{min-height: 44px; padding: 11px 18px;}
.retina3d .hero{position: relative; background: var(--navy) url('hero.webp') center/cover no-repeat; color: white;}
.retina3d .hero-inner{min-height: 540px; padding-block: 65px 72px; display: flex; align-items: center;}
.retina3d .hero-copy{max-width: 610px; width: 50%;}
.retina3d .eyebrow{font-size: 11px; font-weight: 800; color: var(--teal); margin-bottom: 18px;}
.retina3d .hero .eyebrow{color: var(--yellow);}
.retina3d h1{font-size: 58px; font-weight: 800; margin-bottom: 23px;}
.retina3d h2{font-size: 36px; margin-bottom: 20px;}
.retina3d h3{font-size: 25px; margin-bottom: 16px;}
.retina3d .hero-lead{font-size: 21px; line-height: 1.5; margin-bottom: 20px;}
.retina3d .hero-detail{font-size: 15px; line-height: 1.7; max-width: 470px; color: rgb(225, 230, 242);}
.retina3d .actions{display: flex; gap: 26px; align-items: center; flex-wrap: wrap; margin-top: 30px;}
.retina3d .text-link{font-size: 14px; font-weight: 600; text-decoration: none; display: flex; gap: 13px;}
.retina3d .image-note{position: absolute; right: 24px; bottom: 8px; max-width: 420px; padding: 5px 9px; background: rgba(7, 20, 63, 0.8); color: rgb(255, 255, 255); font-size: 10px; margin: 0px;}
.retina3d .proof{border-bottom: 1px solid var(--line);}
.retina3d .proof-grid{display: grid; grid-template-columns: repeat(4, 1fr);}
.retina3d .proof-grid > div{display: flex; gap: 18px; align-items: center; padding: 24px 20px; border-right: 1px solid var(--line);}
.retina3d .proof-grid > div:first-child{border-left: 1px solid var(--line);}
.retina3d .num{color: var(--blue); font-weight: 800; font-size: 12px;}
.retina3d .proof p{font-size: 12px; color: var(--muted); line-height: 1.6; margin: 0px;}
.retina3d .proof strong{font-size: 13px; color: var(--ink);}
.retina3d .section{padding: 80px 0px; scroll-margin-top: 20px;}
.retina3d .section-heading{display: grid; grid-template-columns: 1fr 1fr; gap: 90px; align-items: end; margin-bottom: 30px;}
.retina3d .section-heading > p{max-width: 470px; color: var(--muted); font-size: 16px;}
.retina3d .paths{display: grid; grid-template-columns: 1fr 1fr; border-block: 1px solid var(--line);}
.retina3d .paths article{padding: 32px 42px 32px 0px;}
.retina3d .paths article + article{padding-left: 42px; border-left: 1px solid var(--line);}
.retina3d .path-label{font-size: 10px; color: var(--teal); font-weight: 800; display: block; margin-bottom: 18px;}
.retina3d .paths p{color: var(--muted); font-size: 15px; max-width: 490px;}
.retina3d .paths a{font-size: 14px; font-weight: 700; color: var(--blue); text-decoration: none;}
.retina3d .paths a span{margin-left: 20px;}
.retina3d .process{background: var(--surface);}
.retina3d .steps{display: grid; grid-template-columns: repeat(4, 1fr); gap: 32px; list-style: none; padding: 0px; margin: 35px 0px 0px;}
.retina3d .steps li{border-top: 1px solid rgb(185, 198, 217); padding-top: 20px;}
.retina3d .steps span{font-size: 12px; color: var(--blue); font-weight: 800;}
.retina3d .steps h3{font-size: 18px; margin: 22px 0px 12px;}
.retina3d .steps p{font-size: 14px; color: var(--muted); margin: 0px;}
.retina3d .quote-layout{display: grid; grid-template-columns: 0.8fr 1.4fr; gap: 85px;}
.retina3d .quote-layout aside{max-width: 350px;}
.retina3d .quote-layout aside > p{color: var(--muted); font-size: 15px;}
.retina3d .quote-layout aside .eyebrow{color: var(--teal); font-size: 11px;}
.retina3d .aside-note{border-left: 3px solid var(--yellow); padding-left: 18px; margin-top: 32px; font-size: 14px;}
.retina3d .aside-note p{font-size: 13px; color: var(--muted); margin: 8px 0px;}
.retina3d .required-note{margin-top: 32px; font-size: 12px !important;}
.retina3d .form-shell{min-width: 0px; border: 1px solid var(--line); border-radius: 8px; padding: 30px; background: rgb(255, 255, 255); box-shadow: rgba(7, 20, 63, 0.024) 0px 10px 30px;}
.retina3d .form-progress{display: flex; list-style: none; padding: 0px 0px 25px; margin: 0px 0px 25px; border-bottom: 1px solid var(--line); gap: 35px; font-size: 13px; font-weight: 600; color: var(--muted);}
.retina3d .form-progress li{display: flex; align-items: center; gap: 10px;}
.retina3d .form-progress span{width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; background: var(--surface);}
.retina3d .form-progress .active{color: var(--blue);}
.retina3d .form-progress .active span{background: var(--blue); color: white;}
.retina3d fieldset{margin: 0px; padding: 0px; border: 0px; min-width: 0px;}
.retina3d legend{font-size: 21px; font-weight: 700; margin-bottom: 25px; line-height: 1.4;}
.retina3d label{display: block; font-size: 12px; font-weight: 700; margin-bottom: 7px;}
.retina3d label span{font-weight: 400; color: var(--muted);}
.retina3d input:not([type="checkbox"]):not([type="file"]),.retina3d textarea,.retina3d select{width: 100%; min-width: 0px; background: white; color: var(--ink); border: 1px solid rgb(187, 197, 210); border-radius: 4px; padding: 11px 12px; font-size: 14px; min-height: 46px;}
.retina3d textarea{resize: vertical; display: block;}
.retina3d input:disabled,.retina3d select:disabled{opacity: 0.6; background: var(--surface) !important;}
.retina3d input:invalid[aria-invalid="true"],.retina3d textarea[aria-invalid="true"],.retina3d select[aria-invalid="true"]{border-color: rgb(181, 38, 47);}
.retina3d .fields{display: grid; gap: 18px; margin-top: 22px;}
.retina3d .two{grid-template-columns: 1fr 1fr;}
.retina3d .field-help{font-size: 12px; color: var(--muted); margin: 6px 0px 0px;}
.retina3d .dimension-heading{display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 24px; margin-bottom: 10px; font-size: 12px; font-weight: 700;}
.retina3d .check{display: flex; gap: 8px; align-items: center; margin: 0px; font-weight: 400;}
.retina3d .check input{width: 17px; height: 17px; accent-color: var(--blue);}
.retina3d .dimensions{display: grid; grid-template-columns: 1fr 1fr 1fr 75px; gap: 10px;}
.retina3d .dimensions label{font-size: 11px; color: var(--muted); font-weight: 400;}
.retina3d #r3d-material-detail,.retina3d #r3d-shipping-detail{margin-top: 20px;}
.retina3d .upload{border: 1px dashed rgb(172, 185, 205); border-radius: 4px; padding: 18px; margin-top: 24px; background: rgb(249, 251, 253);}
.retina3d .upload p{font-size: 12px; color: var(--muted); margin-bottom: 10px;}
.retina3d .upload input{font-size: 12px; width: 100%; max-width: 100%; color: var(--muted);}
.retina3d .upload input::file-selector-button{font: inherit; padding: 9px 12px; border: 1px solid rgb(186, 197, 213); background: white; border-radius: 4px; color: var(--ink); margin-right: 10px; cursor: pointer;}
.retina3d .upload small{font-size: 11px; display: block; margin-top: 12px; color: var(--muted);}
.retina3d #r3d-file-status:empty{display: none;}
.retina3d .form-bottom{display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-top: 26px;}
.retina3d .form-bottom > span{font-size: 12px; color: var(--muted);}
.retina3d .back{background: none; border: 0px; font-size: 14px; cursor: pointer; min-height: 44px; color: var(--blue);}
.retina3d .privacy{font-size: 12px; color: var(--muted); margin: 24px 0px 14px;}
.retina3d .privacy a{color: var(--blue);}
.retina3d .demo-note{font-size: 12px; background: rgb(255, 248, 231); color: rgb(103, 70, 0); padding: 12px; border-left: 3px solid var(--yellow);}
.retina3d #r3d-step2 > input{margin-bottom: 20px;}
.retina3d .request-summary{border-left: 3px solid var(--teal); padding: 10px 15px; background: rgb(239, 248, 248); font-size: 13px; margin-bottom: 24px; overflow-wrap: anywhere;}
.retina3d .error{font-size: 13px; color: rgb(157, 32, 44); background: rgb(255, 240, 240); padding: 12px;}
.retina3d .success{text-align: center; padding: 25px 5px;}
.retina3d .success-mark{display: grid; place-items: center; margin: 0px auto 25px; width: 55px; height: 55px; border-radius: 50%; background: rgb(224, 242, 239); color: var(--teal); font-size: 26px;}
.retina3d .success blockquote{margin: 22px 0px; background: var(--surface); padding: 20px; font-size: 15px;}
.retina3d .success p{font-size: 14px;}
.retina3d .success .button{margin-top: 20px;}
.retina3d .faq{background: var(--surface);}
.retina3d .faq-layout{display: grid; grid-template-columns: 0.8fr 1.4fr; gap: 85px;}
.retina3d .faq details{border-bottom: 1px solid rgb(203, 213, 225); padding: 20px 0px;}
.retina3d .faq details:first-child{border-top: 1px solid rgb(203, 213, 225);}
.retina3d .faq summary{cursor: pointer; font-weight: 600; font-size: 15px; padding-right: 15px;}
.retina3d .faq details p{margin: 15px 0px 0px; color: var(--muted); font-size: 14px;}
.retina3d footer{padding: 40px 0px;}
.retina3d .footer-inner{display: flex; gap: 35px; align-items: center; justify-content: space-between; font-size: 12px; color: var(--muted);}
.retina3d footer img{width: 155px; height: auto; display: block;}
.retina3d footer p{margin: 12px 0px 0px;}
.retina3d footer a{font-weight: 700; color: var(--blue); text-decoration: none;}
.retina3d .sr-only{position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0px, 0px, 0px, 0px);}
@media (min-width: 1600px){.retina3d .hero{background-position: center 54%;}
.retina3d .hero-inner{min-height: 580px;}}
@media (max-width: 1000px){.retina3d .header-inner{gap: 20px;}
.retina3d .header-inner nav{gap: 16px;}
.retina3d .hero-copy{width: 57%;}
.retina3d h1{font-size: 48px;}
.retina3d .hero-detail{max-width: 400px;}
.retina3d .quote-layout,.retina3d .faq-layout{gap: 35px; grid-template-columns: 0.65fr 1fr;}
.retina3d .form-shell{padding: 24px;}
.retina3d .proof-grid > div{padding: 20px 12px; gap: 10px;}
.retina3d .section-heading{gap: 40px;}
.retina3d .steps{gap: 20px;}
.retina3d .form-bottom{flex-wrap: wrap;}
.retina3d .dimensions{gap: 6px; grid-template-columns: 1fr 1fr 1fr 65px;}
.retina3d .dimensions input{padding: 10px 6px !important;}}
@media (max-width: 760px){.retina3d .container{width: calc(100% - 36px);}
.retina3d .preview{font-size: 10px;}
.retina3d .preview span{display: block; margin: 3px 0px 0px;}
.retina3d .header-inner{min-height: 76px; justify-content: space-between;}
.retina3d .logo{width: 151px;}
.retina3d .header-inner nav{display: none;}
.retina3d .header-inner .button{font-size: 12px; padding: 10px 12px; gap: 0px;}
.retina3d .hero{background-position: 70% bottom; background-size: auto 370px; padding-bottom: 305px;}
.retina3d .hero-inner{min-height: 0px; padding: 38px 0px 15px; background: var(--navy);}
.retina3d .hero-copy{width: 100%; max-width: 530px;}
.retina3d h1{font-size: 40px; margin-bottom: 20px;}
.retina3d .hero-lead{font-size: 18px;}
.retina3d .hero-detail{font-size: 14px; max-width: 100%;}
.retina3d .hero .actions{gap: 20px; margin-top: 24px;}
.retina3d .hero .button{font-size: 13px;}
.retina3d .image-note{left: 18px; right: 18px; bottom: 10px; font-size: 9px; width: fit-content;}
.retina3d .proof-grid{grid-template-columns: 1fr 1fr;}
.retina3d .proof-grid > div{border-bottom: 1px solid var(--line); padding: 20px 10px;}
.retina3d .proof-grid > div:nth-child(3){border-left: 1px solid var(--line);}
.retina3d .proof strong{font-size: 12px;}
.retina3d .section{padding: 52px 0px;}
.retina3d h2{font-size: 30px;}
.retina3d h3{font-size: 23px;}
.retina3d .section-heading{grid-template-columns: 1fr; gap: 0px; margin-bottom: 20px;}
.retina3d .section-heading > p{font-size: 15px;}
.retina3d .paths{grid-template-columns: 1fr;}
.retina3d .paths article,.retina3d .paths article + article{padding: 26px 0px; border-left: 0px;}
.retina3d .paths article + article{border-top: 1px solid var(--line);}
.retina3d .steps{grid-template-columns: 1fr 1fr; gap: 28px 22px;}
.retina3d .steps h3{font-size: 16px; margin-top: 16px;}
.retina3d .steps p{font-size: 13px;}
.retina3d .quote-layout,.retina3d .faq-layout{grid-template-columns: 1fr; gap: 25px;}
.retina3d .quote-layout aside{max-width: 100%;}
.retina3d .quote-layout aside h2 br{display: none;}
.retina3d .aside-note{margin-top: 20px;}
.retina3d .required-note{margin: 15px 0px 0px;}
.retina3d .form-shell{padding: 22px 18px;}
.retina3d .two{grid-template-columns: 1fr; gap: 18px;}
.retina3d .form-progress{gap: 25px;}
.retina3d .dimensions{grid-template-columns: 1fr 1fr;}
.retina3d .dimensions input{padding: 11px 12px !important;}
.retina3d .dimension-heading{align-items: flex-start; flex-wrap: wrap;}
.retina3d .form-bottom > .button{flex: 1 1 0%;}
.retina3d .form-bottom > span{width: 100%;}
.retina3d .form-bottom{gap: 12px;}
.retina3d .form-bottom .yellow{font-size: 13px;}
.retina3d .footer-inner{align-items: flex-start; flex-direction: column; gap: 20px;}
.retina3d .faq-layout{gap: 12px;}}
@media (prefers-reduced-motion: reduce){}
.retina3d .hero{background-size: auto 100%; background-position: right center;}
@media (max-width: 760px){.retina3d .hero{background-image: none;}
.retina3d .hero::before{content: ""; position: absolute; bottom: 0px; left: 0px; width: 100%; height: 305px; background: url("hero.webp") right center / auto 100% no-repeat;}
.retina3d .hero-inner{background: none;}
.retina3d .image-note{z-index: 1;}
.retina3d .quote-layout aside h2 br{display: initial;}}
@media (max-width: 360px){.retina3d h1{font-size: 32px;}
.retina3d .logo{width: 128px;}
.retina3d .header-inner{gap: 12px;}
.retina3d .header-inner .button{font-size: 11px; padding: 10px;}}
.retina3d{font-family:Inter,Arial,sans-serif;background:#fff;font-size:16px;box-sizing:border-box}
.retina3d h1,.retina3d h2,.retina3d h3{font-family:'Plus Jakarta Sans',Inter,Arial,sans-serif;font-weight:800;letter-spacing:0;color:var(--ink)}
.retina3d .hero h1{color:#fff}
.retina3d .hero{overflow:hidden}
.retina3d .trap{position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}
.retina3d [hidden]{display:none!important}
.retina3d .button:disabled{opacity:.65;cursor:wait}
.retina3d .section{scroll-margin-top:110px}
.retina3d .upload strong{font-size:13px}
.retina3d .upload p{margin:8px 0 0}
.retina3d .error a{color:inherit;text-decoration:underline}
.retina3d .hero-copy{position:relative;z-index:1}
@media(max-width:760px){.retina3d input:not([type=checkbox]),.retina3d textarea,.retina3d select{font-size:16px}.retina3d .section{scroll-margin-top:90px}}
@media(min-width:761px) and (max-width:1100px){.retina3d h1{font-size:42px}}
.retina3d-page .retina-skip-link:not(:focus){clip-path:inset(50%);width:1px;height:1px;overflow:hidden;padding:0;transform:none}
@media(max-width:760px){.retina3d-page .retina-affiliate-fixed{position:relative;inset:auto;transform:none;margin:16px 18px;display:inline-flex;width:auto;max-width:calc(100% - 36px)}}
@media(max-width:760px){.retina3d-page:has(#r3d-quote-form:focus-within) .qlwapp{visibility:hidden!important;pointer-events:none!important}}