/*
 * ANRAN DHT — Chinese homepage design sample
 * Scope: body.home-design-sample only. No other page is affected.
 * Direction: compact industrial editorial system, graphite green + warm metal.
 */

body.home-design-sample{
  --bg:#dceae4;
  --bg2:#d1e2da;
  --bg3:#c3d8cf;
  --accent:#087b5b;
  --accent-l:#0a936c;
  --accent-d:rgba(16,208,144,.12);
  --accent-g:rgba(16,208,144,.22);
  --t:#102920;
  --t2:#1d493a;
  --t3:#416a5a;
  --t4:#5d7d70;
  --bd:#afc9be;
  --bd2:#91b5a6;
  --ink:#0c261d;
  --paper:#eef4f1;
  --signal:#10d090;
  background:#dceae4;
  color:var(--t);
}

.home-design-sample main{background:#dceae4}
.home-design-sample a:focus-visible,
.home-design-sample button:focus-visible,
.home-design-sample summary:focus-visible,
.home-design-sample video:focus-visible{outline:3px solid rgba(16,208,144,.78);outline-offset:3px}

/* Navigation: calmer, denser, and aligned to the page grid. */
.home-design-sample .nav{
  height:74px;
  padding:0 max(28px,calc((100% - 1280px)/2));
  border-bottom:1px solid rgba(19,74,57,.16);
  background:#eef4f1;
  backdrop-filter:none;
  box-shadow:none;
}
.home-design-sample .nav.nav-scrolled{background:#eef4f1;box-shadow:0 12px 34px rgba(15,68,50,.1)}
.home-design-sample .nav-logo{height:36px}
.home-design-sample .nav-brand{gap:13px}
.home-design-sample .nav-brand-text{color:#10382b;font-size:.94rem;letter-spacing:.11em;text-transform:uppercase}
.home-design-sample .nav-links{gap:23px}
.home-design-sample .nav-links a{color:#315e4e;font-size:.72rem;font-weight:680;letter-spacing:.045em}
.home-design-sample .nav-links a.nav-cta{min-height:38px;padding:0 16px;border:1px solid #10d090;border-radius:2px;background:#10d090;color:#08251b}
.home-design-sample .nav-links a.nav-cta:hover{border-color:#38dfa9;background:#38dfa9;color:#08251b}
.home-design-sample .nav-lang{margin-left:13px;padding-left:13px}

/* Hero: one system statement, one engineering panel, one compact evidence rail. */
.home-design-sample .dht-home-hero{
  min-height:810px;
  align-items:center;
  padding:132px max(32px,calc((100% - 1280px)/2)) 34px;
  background:#10d090;
}
.home-design-sample .dht-home-hero .dht-hero-media{
  opacity:1;
  filter:none;
  object-position:center 54%;
}
.home-design-sample .dht-home-hero::before{
  display:none;
}
.home-design-sample .dht-home-hero::after{
  display:none;
}
.home-design-sample .dht-home-hero .dht-hero-inner{
  width:100%;
  max-width:1280px;
  display:grid;
  grid-template-columns:minmax(0,1fr) 360px;
  gap:42px 76px;
  align-items:end;
}
.home-design-sample .dht-home-hero-copy{min-width:0;padding:30px 32px;border:1px solid rgba(5,52,39,.28);background:#10d090;box-shadow:none}
.home-design-sample .dht-home-hero .dht-kicker{margin-bottom:20px;color:#064735;font-size:.68rem;letter-spacing:.19em}
.home-design-sample .dht-home-hero .dht-kicker::before{width:38px;background:#063b2d}
.home-design-sample .dht-home-hero h1{
  max-width:760px;
  margin-bottom:22px;
  font-size:clamp(4.15rem,7.1vw,6.9rem);
  line-height:.88;
  letter-spacing:-.065em;
  color:#062d22;
}
.home-design-sample .dht-home-hero .dht-hero-lead{max-width:720px;margin-bottom:14px;color:#073a2c;font-size:clamp(1.18rem,1.8vw,1.48rem);line-height:1.52}
.home-design-sample .dht-home-hero .dht-hero-copy{max-width:690px;color:rgba(5,52,39,.82);font-size:.94rem;line-height:1.72}
.home-design-sample .dht-home-hero .dht-actions{margin-top:27px}
.home-design-sample .dht-btn{min-height:46px;border-radius:2px;padding:0 20px;font-size:.83rem;letter-spacing:.01em}
.home-design-sample .dht-btn-primary{background:#f5fffb;color:#063428;border-color:rgba(6,52,40,.18)}
.home-design-sample .dht-btn-primary:hover{background:#fff;color:#052c22}
.home-design-sample .dht-btn-secondary{border-color:rgba(5,52,39,.48);color:#063428;background:#36dca8}
.home-design-sample .dht-btn-secondary:hover{border-color:#063428;color:#052c22;background:#55e4b7}

.home-design-sample .dht-home-instrument{
  align-self:end;
  border:1px solid rgba(5,52,39,.3);
  border-top:2px solid #063b2d;
  padding:22px;
  color:#063428;
  background:#2adda6;
  backdrop-filter:none;
  box-shadow:none;
}
.home-design-sample .dht-home-instrument-head{display:flex;justify-content:space-between;gap:16px;padding-bottom:16px;border-bottom:1px solid rgba(5,52,39,.22);font:700 .61rem/1 var(--mono);letter-spacing:.12em;color:#063b2d}
.home-design-sample .dht-home-instrument-head em{font-style:normal;color:rgba(5,52,39,.66)}
.home-design-sample .dht-home-instrument-title{display:block;margin:21px 0 19px;color:#052f24;font-size:1.42rem;line-height:1.24;letter-spacing:-.025em}
.home-design-sample .dht-home-instrument-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid rgba(5,52,39,.2);border-left:1px solid rgba(5,52,39,.2)}
.home-design-sample .dht-home-instrument-grid>div{min-height:91px;padding:13px 12px;border-right:1px solid rgba(5,52,39,.2);border-bottom:1px solid rgba(5,52,39,.2);background:#49e1b0}
.home-design-sample .dht-home-instrument-grid span{display:block;margin-bottom:10px;color:#07503b;font:800 .54rem/1 var(--mono);letter-spacing:.1em}
.home-design-sample .dht-home-instrument-grid strong{display:block;color:#052f24;font-size:.78rem;line-height:1.25}
.home-design-sample .dht-home-instrument-grid small{display:block;margin-top:5px;color:rgba(5,47,36,.72);font-size:.62rem;line-height:1.5}
.home-design-sample .dht-home-instrument>p{margin:16px 0 0;color:rgba(5,47,36,.7);font-size:.66rem;line-height:1.55}

.home-design-sample .dht-home-hero .dht-hero-strip{
  grid-column:1/-1;
  width:100%;
  max-width:none;
  margin-top:0;
  border:0;
  border-top:1px solid rgba(5,52,39,.28);
  background:transparent;
}
.home-design-sample .dht-home-hero .dht-hero-strip>div{padding:15px 18px 13px;border-right:1px solid rgba(5,52,39,.2);background:#10d090}
.home-design-sample .dht-home-hero .dht-hero-strip>div:last-child{border-right:0}
.home-design-sample .dht-home-hero .dht-hero-strip strong{color:#052f24;font-size:.82rem}
.home-design-sample .dht-home-hero .dht-hero-strip span{color:rgba(5,47,36,.74);font-size:.67rem}

/* Shared section rhythm: shorter, clearer, and less visually loose. */
.home-design-sample .dht-section{max-width:1280px;padding:76px 32px}
.home-design-sample .dht-section-wide{max-width:none}
.home-design-sample .dht-section-wide>.dht-shell{max-width:1280px}
.home-design-sample .dht-eyebrow{margin-bottom:12px;color:#087b5b;font-size:.63rem;letter-spacing:.18em}
.home-design-sample .dht-heading{max-width:880px;font-size:clamp(2.05rem,3.4vw,3.3rem);line-height:1.03;letter-spacing:-.045em}
.home-design-sample .dht-intro{margin-top:16px;font-size:.94rem;line-height:1.72}
.home-design-sample .dht-section-head{align-items:end;gap:54px;margin-bottom:30px}
.home-design-sample .dht-section-head .dht-intro{max-width:430px}

/* Two commercial lines presented as substantial industrial products. */
.home-design-sample .dht-home-products{background:#dceae4}
.home-design-sample .dht-product-grid{gap:12px}
.home-design-sample .dht-product-card{
  min-height:382px;
  padding:30px;
  border:1px solid rgba(36,57,45,.18);
  border-radius:3px;
  box-shadow:none;
  isolation:isolate;
}
.home-design-sample .dht-product-card::after{display:none}
.home-design-sample .dht-product-card::before{display:none}
.home-design-sample .dht-product-card:first-child{border-color:rgba(5,52,39,.24);background:#10d090;color:#063428}
.home-design-sample .dht-product-card:hover{transform:translateY(-3px);border-color:#18ae81;box-shadow:0 20px 52px rgba(8,65,48,.13)}
.home-design-sample .dht-product-card h3{max-width:72%;margin:28px 0 14px;font-size:clamp(1.8rem,2.7vw,2.45rem)}
.home-design-sample .dht-product-card p{max-width:72%;font-size:.86rem;line-height:1.72}
.home-design-sample .dht-product-card .dht-chip-row{max-width:74%;margin-top:19px}
.home-design-sample .dht-product-card .dht-chip{padding:6px 8px;border-radius:2px;font-size:.64rem}
.home-design-sample .dht-product-card .dht-card-link{padding-top:24px;font-size:.8rem}
.home-design-sample .dht-product-card:first-child .dht-card-index,
.home-design-sample .dht-product-card:first-child .dht-card-link{color:#064735}
.home-design-sample .dht-product-card:first-child h3{color:#052f24}
.home-design-sample .dht-product-card:first-child p{color:rgba(5,47,36,.8)}
.home-design-sample .dht-product-card:first-child .dht-chip{border-color:rgba(5,52,39,.25);background:#66e5bc;color:#063b2d}

/* Production evidence: real footage is visible before abstract system language. */
.home-design-sample .dht-home-video-section{
  max-width:none;
  padding:78px max(32px,calc((100% - 1280px)/2));
  border-top:1px solid rgba(5,52,39,.2);
  border-bottom:1px solid rgba(5,52,39,.2);
  background:#10d090;
  color:#063428;
}
.home-design-sample .dht-home-video-head{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:50px;align-items:end;margin-bottom:30px}
.home-design-sample .dht-home-video-section .dht-eyebrow{color:#064735}
.home-design-sample .dht-home-video-section .dht-heading{color:#052f24}
.home-design-sample .dht-home-video-section .dht-intro{max-width:730px;color:rgba(5,47,36,.78)}
.home-design-sample .dht-home-record-stamp{min-width:128px;padding-left:18px;border-left:1px solid rgba(5,52,39,.24);text-align:right}
.home-design-sample .dht-home-record-stamp span,.home-design-sample .dht-home-record-stamp small{display:block;color:rgba(5,47,36,.68);font:700 .57rem/1.4 var(--mono);letter-spacing:.1em}
.home-design-sample .dht-home-record-stamp strong{display:block;margin:4px 0;color:#063b2d;font:800 2.65rem/.95 var(--mono);letter-spacing:-.08em}
.home-design-sample .dht-home-video-grid{display:grid;grid-template-columns:minmax(0,1.23fr) minmax(360px,.77fr);grid-template-rows:repeat(2,minmax(0,1fr));gap:12px}
.home-design-sample .dht-home-video-card{min-width:0;margin:0;border:1px solid rgba(5,52,39,.24);background:#7ce9c6;display:grid;grid-template-columns:44% 56%;overflow:hidden}
.home-design-sample .dht-home-video-card--primary{grid-row:1/3;grid-template-columns:1fr;grid-template-rows:auto 1fr}
.home-design-sample .dht-home-video-frame{position:relative;min-height:205px;background:#080d0a;overflow:hidden}
.home-design-sample .dht-home-video-card--primary .dht-home-video-frame{aspect-ratio:16/9;min-height:0}
.home-design-sample .dht-home-video-frame video{display:block;width:100%;height:100%;object-fit:cover;background:#080d0a}
.home-design-sample .dht-home-video-frame>span{position:absolute;left:12px;top:12px;padding:6px 8px;border:1px solid rgba(5,52,39,.25);background:#10d090;color:#052f24;font:800 .54rem/1 var(--mono);letter-spacing:.1em;pointer-events:none}
.home-design-sample .dht-home-video-card figcaption{display:flex;min-width:0;flex-direction:column;padding:22px}
.home-design-sample .dht-home-video-card--primary figcaption{padding:25px 27px 28px}
.home-design-sample .dht-home-video-label{color:#07503b;font:800 .57rem/1 var(--mono);letter-spacing:.12em;text-transform:uppercase}
.home-design-sample .dht-home-video-card h3{margin:11px 0 8px;color:#052f24;font-size:1.06rem;line-height:1.25}
.home-design-sample .dht-home-video-card--primary h3{font-size:1.4rem}
.home-design-sample .dht-home-video-card p{margin:0;color:rgba(5,47,36,.76);font-size:.72rem;line-height:1.62}
.home-design-sample .dht-home-video-card a{margin-top:auto;padding-top:15px;color:#063b2d;font-size:.69rem;font-weight:800;line-height:1.45;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}

/* System flow becomes a compact engineering rail. */
.home-design-sample .dht-home-system{padding-top:74px;padding-bottom:74px;border-color:rgba(5,52,39,.2);background:#26d9a0}
.home-design-sample .dht-home-system .dht-eyebrow{color:#064735}
.home-design-sample .dht-home-system .dht-heading{color:#052f24}
.home-design-sample .dht-home-system .dht-intro{color:rgba(5,47,36,.76)}
.home-design-sample .dht-home-system .dht-process{margin-top:30px;border-color:rgba(5,52,39,.22);background:transparent}
.home-design-sample .dht-home-system .dht-step{position:relative;min-height:190px;padding:22px;border-color:rgba(5,52,39,.22);background:#5de4b9}
.home-design-sample .dht-home-system .dht-step::before{content:"";position:absolute;top:-4px;left:21px;width:7px;height:7px;border-radius:50%;background:#063b2d;box-shadow:0 0 0 4px rgba(5,52,39,.13)}
.home-design-sample .dht-home-system .dht-step-num{color:#064735}
.home-design-sample .dht-home-system .dht-step h3{margin:34px 0 9px;color:#052f24;font-size:.96rem}
.home-design-sample .dht-home-system .dht-step p{color:rgba(5,47,36,.72);font-size:.74rem}

/* Data proof: preserve the measured values and make the evidence block legible. */
.home-design-sample .dht-home-evidence{background:#e5efea}
.home-design-sample .dht-home-evidence .dht-proof-grid{grid-template-columns:1.04fr .96fr;gap:12px;margin-top:30px}
.home-design-sample .dht-home-evidence .dht-proof-image{min-height:425px;border-radius:2px}
.home-design-sample .dht-home-evidence .dht-proof-image img{opacity:1;filter:none}
.home-design-sample .dht-home-evidence .dht-proof-image figcaption{left:18px;right:18px;bottom:17px;border-left-color:#063b2d;border-radius:0;background:#10d090;color:#052f24;font-weight:700}
.home-design-sample .dht-home-evidence .dht-proof-panel{border-radius:2px;padding:28px;border-color:#c2d5cc;background:#f7faf8}
.home-design-sample .dht-home-evidence .dht-proof-panel h3{font-size:1.35rem}
.home-design-sample .dht-home-evidence .dht-proof-panel>p{font-size:.83rem}
.home-design-sample .dht-home-evidence .dht-proof-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;margin-top:21px;border:1px solid #cbded5;background:#cbded5}
.home-design-sample .dht-home-evidence .dht-proof-list>div{display:block;padding:14px;border:0;background:#eef5f1}
.home-design-sample .dht-home-evidence .dht-proof-list span{display:block;margin-bottom:7px;font-size:.64rem}
.home-design-sample .dht-home-evidence .dht-proof-list strong{display:block;text-align:left;font-size:.9rem}
.home-design-sample .dht-home-evidence .dht-note{padding-top:18px;font-size:.68rem}

/* Selection inputs: card density without the old large green field. */
.home-design-sample .dht-home-inputs{padding-top:72px;padding-bottom:72px;border-color:#b8cec4;background:#d2e3dc}
.home-design-sample .dht-home-inputs .dht-input-grid{gap:9px;margin-top:30px;border:0;background:transparent}
.home-design-sample .dht-home-inputs .dht-input{min-height:132px;padding:20px;border:1px solid #b9d0c6;background:#f7fbf9}
.home-design-sample .dht-home-inputs .dht-input code{color:#087b5b}
.home-design-sample .dht-home-inputs .dht-input h3{margin:22px 0 6px;font-size:.94rem}
.home-design-sample .dht-home-inputs .dht-input p{font-size:.73rem;line-height:1.58}

/* Knowledge section and closing action. */
.home-design-sample .dht-home-knowledge{background:#dceae4}
.home-design-sample .dht-home-knowledge .dht-faq{grid-template-columns:.82fr 1.18fr;gap:70px;margin-top:0}
.home-design-sample .dht-home-knowledge .dht-faq-list{border-top-color:#b8c3ba}
.home-design-sample .dht-home-knowledge .dht-faq details{padding:17px 0;border-bottom-color:#b8c3ba}
.home-design-sample .dht-home-knowledge .dht-faq summary{font-size:.92rem}
.home-design-sample .dht-home-knowledge .dht-faq details p{font-size:.79rem}
.home-design-sample .dht-home-cta{max-width:1280px;margin:0 auto 72px;padding:44px 46px;border:1px solid rgba(5,52,39,.24);border-radius:3px;background:#10d090;color:#063428}
.home-design-sample .dht-home-cta::after{display:none}
.home-design-sample .dht-home-cta h2{max-width:760px;color:#052f24;font-size:clamp(1.8rem,3vw,2.65rem)}
.home-design-sample .dht-home-cta p{max-width:760px;color:rgba(5,47,36,.78);font-size:.85rem}

.home-design-sample .footer{border-top:1px solid rgba(5,52,39,.24);background:#10d090;color:rgba(5,47,36,.8)}
.home-design-sample .footer h4,.home-design-sample .footer-brand{color:#052f24}
.home-design-sample .footer a{color:#064735}
.home-design-sample .footer a:hover{color:#021b14;text-decoration:underline;text-underline-offset:3px}

@media(max-width:1120px){
  .home-design-sample .nav-links{gap:15px}
  .home-design-sample .nav-links a{font-size:.66rem}
  .home-design-sample .dht-home-hero{min-height:870px}
  .home-design-sample .dht-home-hero .dht-hero-inner{grid-template-columns:minmax(0,1fr) 322px;gap:34px 42px}
  .home-design-sample .dht-home-hero h1{font-size:clamp(4rem,8.5vw,6.2rem)}
  .home-design-sample .dht-home-video-grid{grid-template-columns:1fr 1fr;grid-template-rows:auto}
  .home-design-sample .dht-home-video-card--primary{grid-column:1/-1;grid-row:auto}
  .home-design-sample .dht-home-video-card--primary .dht-home-video-frame{aspect-ratio:16/7}
  .home-design-sample .dht-home-system .dht-process{grid-template-columns:repeat(3,1fr)}
  .home-design-sample .dht-home-system .dht-step:last-child{grid-column:auto}
}

@media(max-width:900px){
  .home-design-sample .dht-home-hero{min-height:auto;padding-top:128px}
  .home-design-sample .dht-home-hero .dht-hero-inner{grid-template-columns:1fr;gap:28px}
  .home-design-sample .dht-home-instrument{display:grid;grid-template-columns:170px 1fr;gap:0 24px}
  .home-design-sample .dht-home-instrument-head{grid-column:1/-1}
  .home-design-sample .dht-home-instrument-title{align-self:center}
  .home-design-sample .dht-home-instrument>p{grid-column:1/-1}
  .home-design-sample .dht-section-head{display:block}
  .home-design-sample .dht-section-head .dht-intro{max-width:720px;margin-top:15px}
  .home-design-sample .dht-product-card h3,.home-design-sample .dht-product-card p,.home-design-sample .dht-product-card .dht-chip-row{max-width:86%}
  .home-design-sample .dht-home-video-head{grid-template-columns:1fr}
  .home-design-sample .dht-home-record-stamp{display:none}
  .home-design-sample .dht-home-video-card{grid-template-columns:1fr}
  .home-design-sample .dht-home-video-frame{aspect-ratio:16/9;min-height:0}
  .home-design-sample .dht-home-evidence .dht-proof-grid{grid-template-columns:1fr}
  .home-design-sample .dht-home-knowledge .dht-faq{grid-template-columns:1fr;gap:30px}
  .home-design-sample .dht-home-cta{margin-right:24px;margin-left:24px;grid-template-columns:1fr}
}

@media(max-width:700px){
  .home-design-sample .nav{height:66px;padding:0 18px}
  .home-design-sample .nav-brand-text{font-size:.74rem;letter-spacing:.07em}
  .home-design-sample .nav-logo{height:31px}
  .home-design-sample .dht-home-hero{padding:108px 20px 24px}
  .home-design-sample .dht-home-hero .dht-hero-media{object-position:64% center}
  .home-design-sample .dht-home-hero-copy{padding:22px 20px}
  .home-design-sample .dht-home-hero h1{font-size:clamp(3.2rem,16vw,4.6rem);line-height:.93}
  .home-design-sample .dht-home-hero .dht-hero-lead{font-size:1.04rem}
  .home-design-sample .dht-home-hero .dht-hero-copy{font-size:.82rem}
  .home-design-sample .dht-home-hero .dht-actions{display:grid;grid-template-columns:1fr}
  .home-design-sample .dht-home-instrument{display:block;padding:18px}
  .home-design-sample .dht-home-instrument-title{font-size:1.18rem}
  .home-design-sample .dht-home-instrument-grid>div{min-height:82px;padding:11px 10px}
  .home-design-sample .dht-home-hero .dht-hero-strip{grid-template-columns:1fr}
  .home-design-sample .dht-home-hero .dht-hero-strip>div{border-right:0;border-bottom:1px solid rgba(5,52,39,.2)}
  .home-design-sample .dht-section{padding:58px 20px}
  .home-design-sample .dht-heading{font-size:clamp(1.9rem,9.6vw,2.6rem)}
  .home-design-sample .dht-product-grid{grid-template-columns:1fr}
  .home-design-sample .dht-product-card{min-height:360px;padding:24px}
  .home-design-sample .dht-product-card h3,.home-design-sample .dht-product-card p,.home-design-sample .dht-product-card .dht-chip-row{max-width:100%}
  .home-design-sample .dht-home-video-section{padding:58px 20px}
  .home-design-sample .dht-home-video-grid{grid-template-columns:1fr}
  .home-design-sample .dht-home-video-card--primary{grid-column:auto}
  .home-design-sample .dht-home-video-card--primary .dht-home-video-frame{aspect-ratio:16/9}
  .home-design-sample .dht-home-system .dht-process{grid-template-columns:1fr}
  .home-design-sample .dht-home-evidence .dht-proof-image{min-height:330px}
  .home-design-sample .dht-home-evidence .dht-proof-list{grid-template-columns:1fr 1fr}
  .home-design-sample .dht-home-inputs .dht-input-grid{grid-template-columns:1fr}
  .home-design-sample .dht-home-cta{margin:0 20px 58px;padding:34px 24px}
}

@media(prefers-reduced-motion:reduce){
  .home-design-sample .dht-product-card,
  .home-design-sample .dht-product-card::before,
  .home-design-sample .dht-btn{transition:none}
}
