/* Legacy homepage structure retained for content and interaction compatibility. */
.reference-home {color:#17231f;font-family:'Rubik',Arial,sans-serif;font-size:16px;line-height:1.65}
.reference-home h1,.reference-home h2,.reference-home h3 {font-family:inherit;font-weight:650;letter-spacing:-.025em;text-wrap:initial}
.reference-home h2 {font-size:34px;line-height:1.25}
.reference-home h3 {font-size:20px;line-height:1.5}
.reference-home button {font:inherit;cursor:pointer}
.reference-home [hidden] {display:none!important}
.reference-home a,.reference-home button { -webkit-tap-highlight-color:transparent}
.reference-home section[id],.reference-home article[id],.reference-home p[id] {scroll-margin-top:125px}
.ref-container {width:min(1290px,calc(100% - 10.4167%));margin-inline:auto}
.ref-container:not(.factory-section):not(.document-section):not(.news-section):not(.home-contact) {padding-inline:20px}
.reference-home .button {border-radius:7px;padding:16px 30px;min-height:58px;font-weight:600}
.reference-home .reference-note {font-size:12px;line-height:1.55;color:#626b74;text-align:center;margin:22px 0 0}
.center-heading {text-align:center;margin:0 auto 30px}
.center-heading p {max-width:840px;margin:18px auto 0;color:#666;font-size:15px}
.section-marker {font-size:14px;font-weight:500;margin:0 0 60px}
.section-marker:after {content:"";display:block;width:90px;border-bottom:1px solid #aab0b4;margin-top:18px}
.center-title {text-align:center;margin-bottom:54px}
.outline-link {display:inline-flex;align-items:center;gap:25px;border:1px solid #303638;border-radius:9px;padding:13px 24px;font-size:14px;font-weight:600;min-height:51px}
.outline-link span {margin-right:-18px}
.outline-link:hover {background:#045ebf;color:white;border-color:#045ebf}
.text-link {display:inline-flex;gap:22px;align-items:center;border:0;border-bottom:1px solid currentColor;background:none;padding:0 0 6px;font-size:14px!important;font-weight:600!important;color:inherit}
.home-hero {height:40vw;max-height:850px;min-height:500px;position:relative;color:white;background:#102843;overflow:hidden}
.hero-slide {position:absolute;inset:0;overflow:hidden}
.hero-background {position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:65% 52%}
.hero-shade {position:absolute;inset:0;background:linear-gradient(90deg,rgba(4,21,43,.83),rgba(4,21,43,.45) 33%,transparent 65%)}
.hero-copy {position:relative;z-index:2;width:min(570px,44%);margin-left:7.3%;padding-top:clamp(135px,10.5vw,220px)}
.hero-kicker {font-size:17px;font-weight:600;letter-spacing:.08em;margin-bottom:22px}
.hero-copy h1,.hero-copy h2 {font-size:clamp(34px,3.2vw,58px);line-height:1.13;color:inherit;margin:0 0 23px}
.hero-copy p:not(.hero-kicker) {font-size:17px;line-height:1.6;margin-bottom:27px}
.hero-link {display:inline-flex;gap:30px;align-items:center;font-size:15px;border-bottom:1px solid #ffffff80;padding-bottom:8px}
.hero-controls {position:absolute;bottom:30px;right:70px;z-index:5;display:flex;align-items:center;gap:12px;font-size:15px}
.hero-controls button {border:0;background:#fff;color:#17231f;width:48px;height:48px;border-radius:14px;font-size:30px}
.hero-progress {width:160px;height:3px;background:#ffffff66;margin:0 15px}
.hero-progress span {height:100%;width:25%;display:block;background:#78b8f6;transition:width .3s}
.hero-slide--white {background:linear-gradient(115deg,#062149 0%,#045ebf 43%,#d4e3f3 43.1%,#f4f7fb 100%)}
.hero-cutout {position:absolute;width:48%;height:70%;object-fit:contain;right:4%;top:22%;filter:drop-shadow(0 18px 18px #0c285533)}
.hero-slide--track {background:linear-gradient(100deg,#071726,#101b26)}
.hero-track {position:absolute;width:48%;height:100%;right:2%;top:0;object-fit:cover;object-position:center 48%;opacity:.85}
.service-section {display:grid;grid-template-columns:repeat(3,1fr);gap:20px;padding-top:44px;padding-bottom:40px}
.service-card {border-radius:25px;background:#072656;color:white;padding:40px 30px 24px;min-height:431px}
.service-card:nth-child(2){background:#c1dcf7;color:#153253}
.service-card:nth-child(3){background:#91bde8;color:#112d4f}
.service-card h2 {font-size:20px;line-height:1.5;margin-bottom:14px;letter-spacing:-.015em}
.service-card p {font-size:16px;line-height:1.65;min-height:106px;margin:0 0 18px}
.service-card ul {margin:0;padding:13px 0 0;border-top:1px solid #ffffff55;list-style:none}
.service-card li {display:flex;gap:16px;margin:9px 0}
.service-card li:before {content:"›";font-size:24px;line-height:1}
.service-card a {text-decoration:underline;text-underline-offset:3px;font-size:15px}
.featured-section {padding-bottom:40px}
.product-tabs {display:flex;justify-content:center;gap:12px;margin:30px 0 40px;flex-wrap:wrap}
.product-tabs button {display:flex;gap:10px;align-items:center;border:1px solid #e6e6e6;border-radius:50px;min-height:58px;padding:12px 21px;background:white;color:#151515;font-size:13px;font-weight:600}
.product-tabs button[aria-selected=true] {background:#111;color:white;border-color:#111;box-shadow:0 12px 25px #0000000d}
.tab-icon {font-size:23px;font-weight:400;color:#8b9399}
.product-grid {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.product-card {background:white;border:0;padding:0;text-align:center;min-width:0;box-shadow:0 10px 24px #00000004;color:#111;text-decoration:none}
.product-image {position:relative;aspect-ratio:1/1;background:#fff;display:grid;place-items:center;overflow:hidden}
.product-image img {width:82%;height:78%;object-fit:contain;transition:transform .35s}
.product-card:hover .product-image img {transform:scale(1.06)}
.product-brand {position:absolute;z-index:2;top:10px;left:14px;width:72px;height:54px;background:transparent url('/images/haipai-logo.png') center/contain no-repeat;font-size:0;line-height:0}
.product-brand small {display:none}
.product-card h3 {margin:0;background:#f7f7f7;padding:19px 18px;min-height:112px;display:flex;flex-direction:column;justify-content:center;font-size:15px;line-height:1.7;letter-spacing:0}
.about-section {padding-top:0;padding-bottom:100px}
.about-grid {display:grid;grid-template-columns:1fr 1fr;gap:74px}
.about-images {display:grid;grid-template-columns:1fr 1fr;gap:20px;align-content:start;position:relative}
.about-images>div {border-radius:20px;overflow:hidden;height:160px;background:#eef1f3}
.about-images .about-main {grid-column:1/-1;height:330px}
.about-images img {width:100%;height:100%;object-fit:cover}
.about-images>div:last-of-type img {object-fit:contain;background:#f5f5f4}
.image-note {grid-column:1/-1;font-size:11px;color:#747e85;margin-top:-10px}
.about-copy h2 {font-size:31px;line-height:1.22;margin-bottom:23px}
.about-copy p {font-size:18px;line-height:1.65;margin:0 0 10px}
.about-copy .outline-link {margin-top:24px}
.range-numbers {display:grid;grid-template-columns:repeat(4,1fr);text-align:center;margin-top:100px;min-height:230px;align-items:center;background:radial-gradient(ellipse at center,#eaf1f7 0%,transparent 68%)}
.range-numbers strong {font-size:clamp(55px,6.5vw,100px);line-height:1.25;font-weight:750;color:#045ebf;letter-spacing:-.04em}
.range-numbers span {display:block;font-size:20px;font-weight:600;margin-top:8px}
.factory-section {padding-top:60px}
.factory-section .center-heading {margin-bottom:44px}
.factory-mosaic {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:340px 340px;gap:14px}
.mosaic-card {position:relative;display:block;overflow:hidden;border-radius:13px;color:white;background:#123}
.mosaic-card:after {content:"";position:absolute;inset:0;background:linear-gradient(180deg,#00000044,transparent 30%,#00000099)}
.mosaic-card>img {width:100%;height:100%;object-fit:cover;transition:transform .5s}
.mosaic-card:hover>img {transform:scale(1.035)}
.mosaic-tall {grid-row:span 2}
.mosaic-wide {grid-column:span 2}
.mosaic-card>div {position:absolute;z-index:2;bottom:25px;left:16px;right:16px}
.mosaic-tall>div {top:44%;bottom:auto}
.mosaic-wide>div {top:48px;bottom:auto}
.mosaic-card h3 {font-size:20px;color:white;line-height:1.3;margin-bottom:12px}
.mosaic-tall h3,.mosaic-wide h3 {font-size:32px}
.mosaic-card p {margin:0;line-height:1.5}
.mosaic-card .mosaic-centered {text-align:center;top:32%;bottom:auto}
.round-arrow {display:grid;place-items:center;width:55px;height:55px;border:1px solid white;border-radius:100%;font-size:26px;margin:0 auto 20px;background:#ffffff33}
.placeholder-badge {position:absolute;left:16px;top:14px;z-index:3;padding:4px 8px;background:#ffffffeb;color:#24364a;border-radius:3px;font-size:10px;line-height:1.4}
.mosaic-more {position:absolute;z-index:2;top:18px;right:16px;font-size:12px;font-weight:600}
.mosaic-wide .mosaic-more {top:20px}
.document-section {padding-top:86px}
.scroll-frame {position:relative}
.document-rail {display:flex;gap:26px;overflow-x:auto;scrollbar-width:none;scroll-snap-type:x mandatory}
.document-rail::-webkit-scrollbar {display:none}
.document-card {display:block;flex:0 0 calc((100% - 104px)/5);scroll-snap-align:start;background:none;border:0;padding:0;color:#1a2329;text-decoration:none;cursor:pointer;text-align:left}
.document-card>div {height:305px;background:#f5f6f7;padding:20px;display:flex;flex-direction:column;align-items:center;justify-content:center}
.document-card img {width:100%;height:220px;object-fit:contain;opacity:1}
.document-card>div span {font-size:11px;margin-top:12px;color:#5f6d79}
.document-card h3 {font-size:18px;margin:20px 0 0}
.rail-arrow {position:absolute;z-index:3;top:125px;width:40px;height:40px;border:0;border-radius:50%;background:#435362aa;color:white;font-size:26px!important}
.rail-arrow--prev {left:-20px}.rail-arrow--next {right:-20px}
.partner-section {padding-top:82px;padding-bottom:120px;text-align:center}
.partner-section h2 {font-size:24px}
.partner-rail {display:grid;grid-template-columns:repeat(6,1fr);gap:30px;margin-top:62px}
.partner-rail img {width:115px;height:76px;object-fit:contain;filter:grayscale(1);opacity:.65;margin-inline:auto}
.partner-rail span {display:block;margin-top:12px;font-size:10px;color:#697581}
.partnership-banner {position:relative;border-radius:24px;overflow:hidden;background:#071c38;color:white;min-height:400px}
.partnership-banner>img {position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.28)}
.banner-inner {position:relative;display:grid;grid-template-columns:1.7fr 1fr;align-items:center;gap:55px;width:min(1300px,90%);margin:auto;padding:98px 0}
.banner-inner h2 {font-size:46px;line-height:1.2;color:white;margin-bottom:23px}
.banner-inner p {margin:0;font-size:17px}
.banner-actions {display:flex;gap:16px;flex-wrap:wrap}
.more-products {padding-top:80px}
.category-columns {display:grid;grid-template-columns:repeat(4,1fr);gap:0}
.category-columns article {padding:0 30px 0 40px;border-left:1px solid #aeb4b8;display:flex;flex-direction:column;align-items:flex-start;min-width:0}
.category-columns article:first-child {border:0;padding-left:20px}
.category-columns h3 {color:#045ebf;margin-bottom:20px;min-height:60px;line-height:1.4}
.category-columns ul {list-style:none;padding:0;margin:0 0 30px}
.category-columns li {margin-bottom:14px;display:flex;align-items:baseline;gap:10px}
.category-columns li:before {content:"✓";color:#045ebf;font-size:13px}
.category-columns li button {background:none;border:0;padding:0;text-align:left;font-size:15px;color:#353e43}
.category-columns .text-link {margin-top:auto}
.resource-banners {display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:80px}
.resource-banners>a {display:block;position:relative;overflow:hidden;height:240px;border-radius:25px;background:#082650;color:white}
.resource-banners img {width:100%;height:100%;object-fit:cover;opacity:.25}
.resource-banners div {position:absolute;inset:auto 48px 36px}
.resource-banners h3 {font-size:20px;border-top:1px solid #ffffffaa;padding-top:18px;max-width:95%}
.resource-banners span {display:block;border-bottom:1px solid #ffffffaa;padding-bottom:8px;font-weight:600;font-size:14px}
.faq-section {padding-top:96px;padding-bottom:95px;display:grid;grid-template-columns:1fr 1fr;gap:40px}
.faq-section .section-marker {margin-bottom:40px}
.faq-section h2 {font-size:30px;line-height:1.3;max-width:560px}
.faq-section .outline-link {margin-top:42px}
.faq-list details {border-bottom:1px solid #acb1b5}
.faq-list summary {font-size:18px;font-weight:600;cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:23px 0;line-height:1.45}
.faq-list summary::-webkit-details-marker {display:none}
.faq-list summary:after {content:"▾";font-size:15px}
.faq-list details[open] summary:after {content:"▴"}
.faq-list p {padding:0 28px 22px 0;margin:0;color:#56616a;font-size:15px}
.home-contact {display:grid;grid-template-columns:1fr 1fr;gap:60px;padding-top:20px;padding-bottom:90px}
.contact-copy {padding-top:45px}
.contact-copy h2 {font-size:48px;line-height:1.2;letter-spacing:-.04em;max-width:590px}
.contact-copy>p {font-size:18px;margin:25px 0 38px}
.contact-details {display:grid;grid-template-columns:1fr 1fr;gap:35px 30px}
.contact-details h3 {font-size:18px;margin-bottom:12px}
.contact-details p,.contact-details a {font-size:15px;margin:0;overflow-wrap:anywhere}
.contact-details a {display:block}
.contact-copy>.text-link {margin-top:35px}
.contact-form-card {border-radius:26px;padding:45px 50px;background:white;box-shadow:0 8px 38px #14283b09}
.contact-form-card h2 {font-size:32px;margin-bottom:35px}
.contact-form-card .quote-form {gap:20px}
.contact-form-card input,.contact-form-card textarea {border-radius:10px;border-color:#aaa}
.contact-form-card .button {justify-self:start;min-height:51px;padding:11px 29px}
.news-section {padding-bottom:60px}
.news-section>header {display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:60px;margin-bottom:50px}
.news-section>header h2 {font-size:31px;margin:0}
.news-section>header h2 span {color:#929292}
.news-section>header p {margin:0;line-height:1.75}
.news-grid {display:grid;grid-template-columns:repeat(3,1fr);gap:30px}
.news-card:nth-child(n+4) {display:none}
.news-card .resource-open {text-align:left;padding:0;border:0;background:white;color:inherit;display:block;width:100%}
.news-card img {width:100%;height:306px;object-fit:cover;background:#f4f4f2}
.news-card div {padding:24px}
.news-card h3 {font-size:17.5px;line-height:1.5;margin-bottom:16px}
.news-label {font-size:12px;font-weight:500}
.news-card p {margin:20px 0 16px;line-height:1.8}
.news-controls {display:flex;justify-content:center;align-items:center;gap:20px;margin-top:24px;font-size:13px}
.news-controls button {width:36px;height:36px;background:#f1f4f6;border:0;border-radius:50%;font-size:24px}
@media(min-width:1900px) {.hero-copy {margin-left:calc((100% - 1290px)/2)}}
@media(max-width:1100px) {
 .ref-container {width:94%}.ref-container:not(.factory-section):not(.document-section):not(.news-section):not(.home-contact){padding-inline:12px}
 .service-card{padding:30px 22px}.service-card p{min-height:155px}
 .about-grid{gap:35px}.about-copy p{font-size:16px}
 .hero-copy{margin-left:5%;width:45%}.hero-copy h1,.hero-copy h2{font-size:36px}
 .product-tabs button{padding:10px 14px;font-size:12px}
 .factory-mosaic{grid-template-rows:290px 290px}
 .mosaic-tall h3,.mosaic-wide h3{font-size:27px}
 .category-columns article{padding-inline:20px}
 .home-contact{gap:25px}.contact-form-card{padding:35px 28px}.contact-copy h2{font-size:39px}
 .banner-inner h2{font-size:38px}.news-card img{height:240px}
}
@media(max-width:760px) {
 .reference-home h2{font-size:27px}.ref-container{width:calc(100% - 40px)}
 .ref-container:not(.factory-section):not(.document-section):not(.news-section):not(.home-contact){padding-inline:0}
 .home-hero{height:660px;min-height:0;max-height:none}
 .hero-background{object-position:64% 70%;height:100%}
 .hero-shade{background:linear-gradient(180deg,#061c38e6 0%,#061c3888 45%,#061c3833 70%)}
 .hero-copy{width:86%;margin-left:7%;padding-top:123px}
 .hero-kicker{font-size:12px;margin-bottom:17px}
 .hero-copy h1,.hero-copy h2{font-size:34px;max-width:330px;margin-bottom:18px}
 .hero-copy p:not(.hero-kicker){font-size:15px;max-width:290px}
 .hero-controls{bottom:20px;right:50px;gap:8px}
 .hero-controls button{width:40px;height:40px;border-radius:10px}
 .hero-progress{width:70px;margin:0 9px}
 .hero-slide--white{background:linear-gradient(160deg,#062149 0%,#045ebf 54%,#d4e3f3 54.1%,#f4f7fb 100%)}
 .hero-cutout{width:84%;height:40%;top:57%;right:4%}
 .hero-track{width:100%;height:55%;top:45%;right:0;object-position:center 42%;opacity:.8}
 .hero-slide--track .hero-copy{padding-top:118px}.hero-slide--track .hero-copy h2{font-size:31px}
 .service-section{grid-template-columns:1fr;gap:20px;padding-top:30px;padding-bottom:55px}
 .service-card{padding:34px 28px 28px;min-height:0}
 .service-card h2{font-size:20px}.service-card p{min-height:0;font-size:15px}
 .center-heading p{font-size:14px}.center-heading br{display:none}
 .product-tabs{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:25px 0}
 .product-tabs button{border-radius:14px;font-size:11px;text-align:left;min-height:60px;padding:10px}
 .tab-icon{font-size:21px}
 .product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
 .product-brand{left:10px;top:10px;font-size:12px}.product-brand small{font-size:5px}
 .product-image{aspect-ratio:1/1.15}.product-image img{width:90%;height:72%}
 .product-card h3{font-size:12px;line-height:1.6;padding:15px 8px;min-height:118px}
 .featured-section{padding-bottom:60px}
 .section-marker{margin-bottom:35px}
 .about-grid{grid-template-columns:1fr;gap:35px}
 .about-images{gap:12px}.about-images .about-main{height:260px}.about-images>div{height:125px}
 .about-copy h2{font-size:27px}.about-copy p{font-size:16px}
 .range-numbers{grid-template-columns:1fr 1fr;gap:25px 10px;margin-top:60px;min-height:0}
 .range-numbers strong{font-size:60px}.range-numbers span{font-size:14px}
 .about-section{padding-bottom:60px}.factory-section{padding-top:10px}
 .factory-mosaic{grid-template-columns:1fr;grid-template-rows:auto;gap:14px}
 .mosaic-tall,.mosaic-wide{grid-column:auto;grid-row:auto}
 .mosaic-card{height:320px}.mosaic-tall{height:430px}
 .mosaic-card h3,.mosaic-wide h3,.mosaic-tall h3{font-size:25px}
 .mosaic-card p{font-size:15px}
 .mosaic-tall>div{top:auto;bottom:30px}.mosaic-wide>div{top:60px}
 .mosaic-more{top:45px!important}
 .document-section{padding-top:55px}.document-card{flex-basis:calc((100% - 16px)/2)}
 .document-rail{gap:16px}.document-card>div{height:240px;padding:10px}.document-card img{height:165px}
 .document-card h3{font-size:15px}.document-card>div span{font-size:10px}
 .rail-arrow{width:32px;height:32px;top:100px}.rail-arrow--prev{left:-14px}.rail-arrow--next{right:-14px}
 .partner-section{padding-top:55px;padding-bottom:60px}.partner-section h2{font-size:23px}
 .partner-rail{grid-template-columns:repeat(3,1fr);gap:25px 12px;margin-top:35px}
 .partner-rail img{width:85px;height:65px}.partner-rail span{font-size:9px}
 .partnership-banner{border-radius:20px}
 .banner-inner{grid-template-columns:1fr;gap:30px;padding:60px 5px}
 .banner-inner h2{font-size:33px}.banner-inner p{font-size:15px}
 .banner-actions{gap:12px}.banner-actions .button{padding:13px 18px;min-height:50px;font-size:14px}
 .more-products{padding-top:55px}.center-title{margin-bottom:35px}
 .category-columns{grid-template-columns:1fr 1fr;gap:35px 0}
 .category-columns article,.category-columns article:first-child{padding:0 15px}
 .category-columns article:nth-child(odd){border-left:0;padding-left:0}
 .category-columns h3{font-size:17px;min-height:70px}
 .category-columns li{gap:7px}.category-columns li button{font-size:13px}
 .resource-banners{grid-template-columns:1fr;margin-top:50px}
 .resource-banners>a{height:210px}.resource-banners div{inset:auto 25px 28px}
 .resource-banners h3{font-size:19px}
 .faq-section{grid-template-columns:1fr;gap:35px;padding-top:60px;padding-bottom:55px}
 .faq-section h2{font-size:27px}.faq-section .outline-link{margin-top:20px}
 .faq-list summary{font-size:16px;padding:21px 0}
 .home-contact{grid-template-columns:1fr;gap:35px;padding-bottom:65px}
 .contact-copy{padding-top:0}.contact-copy h2{font-size:34px}
 .contact-copy>p{font-size:16px}
 .contact-details{gap:25px 20px}.contact-details h3{font-size:16px}.contact-details p,.contact-details a{font-size:13px}
 .contact-form-card{padding:30px 23px}.contact-form-card h2{font-size:28px}
 .news-section>header{grid-template-columns:1fr;gap:20px;margin-bottom:30px}.news-section>header h2{font-size:28px}
 .news-grid{grid-template-columns:1fr;gap:24px}.news-card img{height:260px}
 .news-card div{padding:20px 10px}.news-card h3{font-size:18px}
}
@media(prefers-reduced-motion:reduce){.reference-home *{scroll-behavior:auto!important;transition:none!important}}

/* Art-directed homepage hero: premium catalogue composition using verified product photography. */
.hero-slide--range{
 background:
  radial-gradient(circle at 17% 5%,rgba(27,112,158,.28),transparent 34%),
  linear-gradient(125deg,#061a29 0%,#08283d 45%,#0c3147 100%);
}
.hero-slide--range:before{
 content:"";position:absolute;inset:0 60% 0 0;opacity:.16;pointer-events:none;
 background-image:linear-gradient(rgba(255,255,255,.16) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.16) 1px,transparent 1px);
 background-size:44px 44px;
 -webkit-mask-image:linear-gradient(90deg,#000,transparent 92%);mask-image:linear-gradient(90deg,#000,transparent 92%);
}
.hero-slide--range:after{
 content:"";position:absolute;left:40.5%;top:0;width:1px;height:100%;
 background:linear-gradient(180deg,transparent,rgba(118,195,244,.7) 25%,rgba(118,195,244,.2) 78%,transparent);
}
.reference-home .hero-slide--range .hero-background{
 inset:26px 28px 26px auto;width:58%;height:calc(100% - 52px);object-position:58% 53%;
 border-radius:22px;box-shadow:0 28px 60px rgba(0,10,18,.34);filter:saturate(.93) contrast(1.03);
}
.reference-home .hero-slide--range .hero-shade{
 background:linear-gradient(90deg,rgba(5,24,37,.18) 0 40%,rgba(5,24,37,.08) 40.1% 56%,rgba(5,24,37,.18));
}
.reference-home .hero-slide--range .hero-copy{width:min(520px,34%);padding-top:clamp(112px,8vw,145px)}
.reference-home .hero-slide--range .hero-kicker{display:flex;align-items:center;gap:12px;color:#8ed0ff;font-size:12px;letter-spacing:.18em}
.reference-home .hero-slide--range .hero-kicker:before{content:"";width:30px;height:2px;background:#39a7ee}
.reference-home .hero-slide--range .hero-copy h1{font-size:clamp(2.55rem,3.35vw,3.7rem);line-height:1.04;letter-spacing:-.045em;margin-bottom:24px}
.reference-home .hero-slide--range .hero-copy p:not(.hero-kicker){color:#d6e1e8;font-size:15px;line-height:1.65}
.reference-home .hero-slide--range .hero-link{
 min-height:48px;padding:11px 17px 11px 20px;border:1px solid rgba(255,255,255,.3);border-radius:8px;
 background:rgba(255,255,255,.08);backdrop-filter:blur(8px);gap:34px;transition:background .25s,border-color .25s,transform .25s;
}
.reference-home .hero-slide--range .hero-link:hover{background:#0874c9;border-color:#0874c9;transform:translateY(-2px)}
.hero-trustline{display:flex;gap:22px;margin-top:26px;color:#9fb2bf;font-size:10px;font-weight:600;letter-spacing:.08em;text-transform:uppercase}
.hero-trustline span{display:flex;align-items:center;gap:8px}
.hero-trustline span:before{content:"";width:5px;height:5px;border-radius:50%;background:#49b6f4;box-shadow:0 0 0 4px rgba(73,182,244,.12)}
.hero-range-meta{
 position:absolute;z-index:3;right:52px;top:52px;display:grid;gap:2px;min-width:260px;padding:15px 18px;
 color:#122d3d;background:rgba(250,252,253,.88);border:1px solid rgba(255,255,255,.72);border-radius:12px;
 box-shadow:0 12px 34px rgba(7,28,42,.16);backdrop-filter:blur(12px);
}
.hero-range-meta span{font-size:9px;font-weight:750;letter-spacing:.18em;color:#0874c9}
.hero-range-meta strong{font-size:13px;letter-spacing:-.01em}
.hero-range-meta small{font-size:10px;color:#687a85}
.hero-controls{
 padding:7px 8px 7px 15px;border:1px solid rgba(255,255,255,.24);border-radius:16px;
 background:rgba(5,25,38,.66);box-shadow:0 12px 32px rgba(0,12,20,.18);backdrop-filter:blur(12px);
}
.hero-controls button{border:1px solid rgba(255,255,255,.5);border-radius:10px;transition:background .2s,color .2s,transform .2s}
.hero-controls button:hover{background:#0874c9;color:#fff;border-color:#0874c9;transform:translateY(-1px)}

@media(max-width:1100px){
 .reference-home .hero-slide--range .hero-copy{width:38%}
 .reference-home .hero-slide--range .hero-background{width:56%;object-position:60% 52%}
 .hero-range-meta{right:38px;top:38px}
}
@media(max-width:760px){
 .hero-slide--range:before{inset:0;opacity:.1}
 .hero-slide--range:after{display:none}
 .reference-home .hero-slide--range .hero-background{inset:auto 14px 14px;width:calc(100% - 28px);height:43%;border-radius:16px;object-position:54% 53%}
 .reference-home .hero-slide--range .hero-shade{background:linear-gradient(180deg,rgba(4,24,38,.08),rgba(4,24,38,.05) 54%,rgba(4,24,38,.36))}
 .reference-home .hero-slide--range .hero-copy{width:calc(100% - 40px);padding-top:92px}
 .reference-home .hero-slide--range .hero-copy h1{font-size:34px;line-height:1.08;max-width:390px}
 .reference-home .hero-slide--range .hero-copy p:not(.hero-kicker){max-width:340px;margin-bottom:18px}
 .hero-trustline{margin-top:17px;gap:14px;font-size:8px}
 .hero-range-meta{display:none}
 .hero-controls{right:24px;bottom:24px;padding:5px 6px 5px 10px}
 .hero-controls>span,.hero-progress{display:none}
}

/* Unified HaiPai visual system: restrained type, stable media and compact rhythm. */
.ref-container{width:min(var(--layout-wide),calc(100% - (var(--layout-gutter) * 2)))}
.home-hero{height:clamp(500px,38vw,620px);min-height:500px;max-height:620px}
.hero-copy{padding-top:clamp(128px,9vw,165px)}
.hero-copy h1,.hero-copy h2{font-size:clamp(2.25rem,3vw,3.25rem)}
.service-card{min-height:360px;padding:32px 28px 24px;border-radius:var(--radius-card)}
.service-card p{min-height:0}
.about-section{padding-bottom:72px}.about-copy p{font-size:16px}
.range-numbers{min-height:180px;margin-top:64px}.range-numbers strong{font-size:clamp(3rem,5vw,4.5rem)}.range-numbers span{font-size:16px}
.factory-section{padding-top:52px}.factory-mosaic{grid-template-rows:300px 300px}
.document-section{padding-top:64px}.document-card>div{height:250px}.document-card img{height:180px}
.partner-section{padding-top:64px;padding-bottom:80px}.partner-rail{margin-top:42px}
.partnership-banner{min-height:340px;border-radius:var(--radius-card)}.banner-inner{padding:72px 0}.banner-inner h2{font-size:38px}
.more-products{padding-top:68px}.resource-banners{margin-top:60px}
.faq-section{padding-top:72px;padding-bottom:72px}
.home-contact{padding-bottom:72px}.contact-copy h2{font-size:40px}.contact-form-card{border-radius:var(--radius-card);box-shadow:var(--shadow-card)}
@media(max-width:760px){
 .ref-container{width:calc(100% - 32px)}
 .home-hero{height:560px;min-height:560px;max-height:560px}
 .hero-copy{width:calc(100% - 40px);margin-left:20px;padding-top:108px}
 .hero-copy h1,.hero-copy h2{font-size:32px}
 .service-section{gap:14px;padding-bottom:44px}.service-card{padding:28px 24px;min-height:0}
 .featured-section{padding-bottom:48px}.product-card h3{min-height:96px}
 .section-marker{margin-bottom:30px}.about-section{padding-bottom:48px}.about-grid{gap:28px}
 .range-numbers{margin-top:44px;gap:20px 10px}.range-numbers strong{font-size:48px}
 .factory-mosaic{gap:12px}.mosaic-card{height:270px}.mosaic-tall{height:340px}
 .document-section{padding-top:44px}.document-card>div{height:210px}.document-card img{height:140px}
 .partner-section{padding:48px 0}.partnership-banner{min-height:330px}.banner-inner{padding:48px 4px}.banner-inner h2{font-size:30px}
 .more-products{padding-top:48px}.resource-banners{margin-top:42px}
 .faq-section{padding-top:52px;padding-bottom:48px}.home-contact{padding-bottom:52px}
 .contact-copy h2{font-size:30px}.news-section{padding-bottom:48px}
}

/* Dedicated homepage imagery, with the existing blue/white UI retained. */
.reference-home .about-images--editorial>div{background:#e5e9ec}
.reference-home .about-images--editorial>div:last-of-type img{object-fit:cover;background:none}
.reference-home .about-images--editorial .about-main img{object-position:center 52%}
.reference-home .partnership-banner--editorial{background:#10283e}
.reference-home .partnership-banner--editorial>img{filter:none;object-position:center;opacity:1}
.reference-home .partnership-banner--editorial::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(8,30,49,.82),rgba(8,30,49,.44) 48%,rgba(8,30,49,.04) 80%);pointer-events:none}
.reference-home .partnership-banner--editorial .banner-inner{z-index:1;grid-template-columns:1fr;gap:24px;padding:56px 0}
.reference-home .partnership-banner--editorial .banner-inner>div{max-width:60%}
.reference-home .partnership-banner--editorial .banner-inner h2{font-size:clamp(30px,3vw,42px);line-height:1.18;margin-bottom:18px}
.reference-home .partnership-banner--editorial .banner-inner p{font-size:14px;line-height:1.7;color:#d5e1e8}
.reference-home .partnership-banner--editorial .button{min-height:48px;padding:11px 23px}
.reference-home .resource-banners--editorial>a{height:260px;background:#102b43}
.reference-home .resource-banners--editorial img{opacity:1;transition:transform .45s ease}
.reference-home .resource-banners--editorial>a::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(6,29,49,.62),rgba(6,29,49,.2) 62%,rgba(6,29,49,.02)),linear-gradient(0deg,rgba(6,29,49,.5),transparent 70%);pointer-events:none}
.reference-home .resource-banners--editorial>a>div{z-index:1;inset:auto 32px 28px}
.reference-home .resource-banners--editorial h3{border:0;padding-top:0;font-size:21px;margin-bottom:16px}
.reference-home .resource-banners--editorial span{border:0;padding:0;color:#d0e6f7;font-size:12px}
.reference-home .resource-banners--editorial>a:hover img{transform:scale(1.025)}
.reference-home .news-section--editorial .news-card img{height:auto;aspect-ratio:3/2;object-fit:cover}
@media(max-width:760px){
 .reference-home .partnership-banner--editorial{min-height:490px}
 .reference-home .partnership-banner--editorial>img{height:42%;top:auto;bottom:0;object-position:right center}
 .reference-home .partnership-banner--editorial::after{background:linear-gradient(180deg,#10283e 0 52%,rgba(16,40,62,.18) 75%)}
 .reference-home .partnership-banner--editorial .banner-inner{padding:32px 4px 190px;gap:20px}
 .reference-home .partnership-banner--editorial .banner-inner>div{max-width:100%}
 .reference-home .partnership-banner--editorial .banner-inner h2{font-size:28px}
 .reference-home .partnership-banner--editorial .banner-inner p{font-size:13px}
 .reference-home .resource-banners--editorial>a{height:230px}
 .reference-home .resource-banners--editorial>a>div{inset:auto 24px 24px}
}
@media(prefers-reduced-motion:reduce){.reference-home .resource-banners--editorial img{transition:none}}

/* Editorial campaign: full-bleed material photography, live type, no poster panels. */
.haipai-ui .reference-home .home-hero--editorial{height:clamp(560px,36vw,720px);min-height:560px;max-height:720px;background:#242423}
.home-hero--editorial .hero-slide--editorial{background:#242423;color:#f7f5ef}
.home-hero--editorial .hero-slide--light{background:#eee7dc;color:#23302d}
.haipai-ui .home-hero--editorial .hero-background{inset:var(--hp-header-height) 0 0;width:100%;height:calc(100% - var(--hp-header-height));border:0;border-radius:0;box-shadow:none;filter:none;object-fit:cover;object-position:right center}
.haipai-ui .home-hero--editorial .hero-shade{background:linear-gradient(90deg,rgba(20,22,22,.55),rgba(20,22,22,.12) 43%,transparent 61%);pointer-events:none}
.haipai-ui .home-hero--editorial .hero-slide--light .hero-shade{background:linear-gradient(90deg,rgba(243,237,226,.78),rgba(243,237,226,.25) 40%,transparent 60%)}
.haipai-ui .home-hero--editorial .hero-copy{width:min(550px,43%);margin-left:max(40px,calc((100% - var(--layout-wide))/2));padding-top:clamp(146px,10vw,200px)}
.haipai-ui .home-hero--editorial .hero-slide .hero-copy .hero-kicker{display:flex;align-items:center;gap:12px;margin:0 0 23px;color:#d6ccbc;font-size:10px;font-weight:500;letter-spacing:.18em;line-height:1.5}
.haipai-ui .home-hero--editorial .hero-kicker::before{width:26px;height:1px;background:currentColor}
.haipai-ui .home-hero--editorial .hero-slide--light .hero-copy .hero-kicker{color:#645848}
.haipai-ui .home-hero--editorial .hero-copy :is(h1,h2){max-width:560px;margin:0 0 24px;color:inherit;font-size:clamp(40px,3.65vw,64px);font-weight:450;line-height:1.09;letter-spacing:-.045em}
.haipai-ui .home-hero--editorial .hero-copy p:not(.hero-kicker){margin:0 0 28px;color:#d9d6ce;font-size:14px;line-height:1.8}
.haipai-ui .home-hero--editorial .hero-slide--light .hero-copy p:not(.hero-kicker){color:#53584f}
.haipai-ui .home-hero--editorial .hero-link{display:inline-flex;align-items:center;gap:34px;min-height:44px;padding:0 0 8px;border:0;border-bottom:1px solid currentColor;border-radius:0;background:none;color:inherit;font-size:12px;font-weight:500;letter-spacing:.02em;transition:gap .2s}
.haipai-ui .home-hero--editorial .hero-link:hover{gap:45px}
.home-hero--editorial .hero-link span{font-size:20px;font-weight:400}
.home-hero--editorial .hero-caption{position:absolute;left:max(40px,calc((100% - var(--layout-wide))/2));right:40px;bottom:30px;display:flex;gap:26px;align-items:center;color:#d1cbc0;font-size:9px;font-weight:450;letter-spacing:.16em;line-height:1.6}
.home-hero--editorial .hero-caption span+span{padding-left:25px;border-left:1px solid #b8b09f55}
.home-hero--editorial .hero-slide--light .hero-caption{color:#635d53}
.haipai-ui .home-hero--editorial .hero-controls{right:max(40px,calc((100% - var(--layout-wide))/2));bottom:24px;gap:12px;padding:0;border:0;border-radius:0;background:none;box-shadow:none;backdrop-filter:none;color:#f5f2ea;font-size:11px;letter-spacing:.06em}
.haipai-ui .home-hero--editorial .hero-controls button{width:40px;height:40px;border:1px solid #d9d6ce66;border-radius:50%;background:transparent;color:inherit;font-size:23px}
.haipai-ui .home-hero--editorial .hero-controls button:hover{background:#f4f1e8;color:#262c29;border-color:#f4f1e8;transform:none}
.home-hero--editorial .hero-progress{width:68px;height:1px;margin:0 6px;background:#b8b09f66}
.home-hero--editorial .hero-progress span{background:currentColor}
.haipai-ui .home-hero--editorial:has(.hero-slide--light.is-active) .hero-controls{color:#303831}
.haipai-ui .home-hero--editorial:has(.hero-slide--light.is-active) .hero-controls button{border-color:#615f5266}
@media(max-width:1100px) and (min-width:761px){
 .haipai-ui .home-hero--editorial .hero-copy{width:45%;margin-left:30px}
 .haipai-ui .home-hero--editorial .hero-copy :is(h1,h2){font-size:39px}
 .home-hero--editorial .hero-caption{left:30px}
}
@media(max-width:760px){
 .haipai-ui .reference-home .home-hero--editorial{height:690px;min-height:690px;max-height:690px}
 .haipai-ui .home-hero--editorial .hero-copy{width:calc(100% - 48px);margin-left:24px;padding-top:108px}
 .haipai-ui .home-hero--editorial .hero-slide .hero-copy .hero-kicker{font-size:9px;margin-bottom:18px}
 .haipai-ui .home-hero--editorial .hero-copy :is(h1,h2){max-width:420px;font-size:clamp(32px,8.5vw,42px);line-height:1.1;margin-bottom:18px}
 .haipai-ui .home-hero--editorial .hero-copy p:not(.hero-kicker){max-width:360px;font-size:13px;line-height:1.7;margin-bottom:17px}
 .haipai-ui .home-hero--editorial .hero-background{inset:auto 0 42px;width:100%;height:270px;object-position:83% center}
 .haipai-ui .home-hero--editorial .hero-shade{background:linear-gradient(180deg,#242423 0 54%,transparent 66%)}
 .haipai-ui .home-hero--editorial .hero-slide--light .hero-shade{background:linear-gradient(180deg,#eee7dc 0 54%,transparent 66%)}
 .home-hero--editorial .hero-caption{left:24px;bottom:14px;font-size:8px}
 .home-hero--editorial .hero-caption span+span{display:none}
 .haipai-ui .home-hero--editorial .hero-controls{bottom:8px;right:18px;gap:8px}
 .haipai-ui .home-hero--editorial .hero-controls button{width:32px;height:32px;font-size:20px}
 .home-hero--editorial .hero-controls>span{display:block;font-size:9px}
 .home-hero--editorial .hero-progress{display:none}
}

.document-card>div{padding:0;background:#eef3f6;border:1px solid #dce5eb;border-radius:14px;overflow:hidden;height:auto}.document-card>div img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;padding:0;margin:0}.document-card>div span{display:block;width:100%;padding:14px 10px;text-align:center;background:#f4f7f9;color:#496474;box-sizing:border-box}.document-card h3{font-size:17px;line-height:1.4;margin-top:16px}

/* Restore full image depth in the resource cards. */
.document-card>div img{opacity:1;filter:contrast(1.08) saturate(1.03)}
.document-card>div span{margin-top:0;color:#294858;background:#edf2f6}

/* Resource navigation uses document diagrams, distinct from campaign imagery. */
.document-card>div{border:1px solid #d4e0e9;border-radius:12px;background:#eff4f8}.document-card>div img{opacity:1;filter:none;background:linear-gradient(145deg,#f8fafc,#e8f0f6);aspect-ratio:4/3;object-fit:contain;padding:12px;box-sizing:border-box}.document-card>div span{background:#fff;border-top:1px solid #dbe5ed;color:#31556e;letter-spacing:.02em}.document-card h3{color:#153b51;font-size:17px}.document-card:hover>div{border-color:#0864bd}.document-card:focus-visible{outline:3px solid #0864bd;outline-offset:5px}