/* Homepage content only; global header/footer live in chrome.css. */
.home { color: #294431; }
.home main { padding: 0; }
.home main>*+* { margin-top: 0; }
.home h1, .home h2, .home h3 { font-family: "Microsoft YaHei", "PingFang SC", sans-serif; font-weight: 600; letter-spacing: -.035em; }
.home-hero { background: #f2f1eb; overflow: hidden; }
.hero-layout { display: grid; grid-template-columns: 1fr 1fr; align-items: center; min-height: 510px; gap: 30px; }
.hero-copy { padding: 62px 0; }
.eyebrow { font-size: 12px; color: #6b7964; letter-spacing: .12em; margin: 0 0 24px; }
.home h1 { font-size: clamp(34px, 3.7vw, 54px); line-height: 1.4; }
.hero-description { font-size: 15px; color: #6a7562; line-height: 1.9; margin: 24px 0 32px; max-width: 28em; }
.hero-link { display: inline-flex; gap: 38px; padding-bottom: 9px; border-bottom: 1px solid #91a087; font-size: 14px; }
.hero-art { margin: 0; }
.hero-art img { width: 100%; height: 385px; object-fit: cover; mix-blend-mode: normal; }


.home h2 { font-size: 29px; line-height: 1.5; }

.home-about { background: #294431; color: #fff; padding: 50px 0; }
.about-layout { display: grid; grid-template-columns: .65fr 1.8fr; gap: 65px; align-items: center; }
.about-layout p { margin: 0 0 20px; max-width: 38em; font-size: 15px; line-height: 1.95; color: #dce5d6; }
.about-layout a { font-size: 13px; border-bottom: 1px solid #8f9f87; padding-bottom: 7px; display: inline-flex; gap: 35px; }
@media(max-width:1100px) {

  .about-layout { gap: 40px; grid-template-columns: .6fr 1.8fr; }
  
}
@media(max-width:900px) {
  .hero-layout { min-height: 440px; gap: 15px; }
  .home h1 { font-size: 36px; }
  .hero-art img { height: 330px; }
  
}
@media(max-width:620px) {
  .hero-layout { grid-template-columns: 1fr; gap: 0; }
  .hero-copy { padding: 36px 0 24px; }
  .home h1 { font-size: 34px; }
  .eyebrow { margin-bottom: 19px; font-size: 11px; }
  .hero-description { margin: 20px 0 24px; font-size: 14px; }
  .hero-art { margin: 0; }
  .hero-art img { height: auto; aspect-ratio: 1.9; }
  
  .home h2 { font-size: 26px; }

  .about-layout { grid-template-columns: 1fr; gap: 20px; }
  .about-layout h2 br { display: block; }
  .about-layout p { font-size: 14px; }
  .home-about { padding: 36px 0; }
}

/* Business images belong with their descriptions; each has one detail link. */
.home-business { padding: 72px 0 80px; scroll-margin-top: 104px; }
.business-heading { display:flex; justify-content:space-between; align-items:baseline; gap:24px; margin-bottom:30px; }
.business-heading p { margin:0; color:#74806c; font-size:14px; }
.goods-feature { display:grid; grid-template-columns:1.12fr 1fr; background:#f3f4ef; }
.business-photo { position:relative; margin:0; overflow:hidden; background:#eeeee7; }
.business-photo img { width:100%; height:100%; object-fit:cover; }

.goods-feature>.business-photo { min-height:415px; }
.goods-feature>.business-photo img { position:absolute; inset:0; }
.goods-copy { padding:42px 46px; align-self:center; }
.business-label { font-size:12px; letter-spacing:.1em; color:#6b7964; margin:0 0 14px; }
.home .goods-copy h3 { font-size:34px; line-height:1.5; margin:0; }
.business-description { font-size:15px; line-height:1.95; color:#5f6e58; margin:19px 0 0; }
.business-detail { font-size:13px; line-height:1.9; color:#7a8471; margin:16px 0 0; }
.business-more { display:inline-flex; align-items:center; gap:45px; border-bottom:1px solid #a2ad97; padding:0 0 7px; font-size:13px; margin-top:26px; }
.business-more:hover { color:#926d25; border-color:currentColor; }
.business-pair { display:grid; grid-template-columns:1fr 1fr; gap:40px; margin-top:40px; }
.business-pair article { display:flex; flex-direction:column; }
.business-pair .business-photo { aspect-ratio:1.85; }
.business-copy { padding:24px 0 0; flex:1; display:flex; align-items:flex-start; flex-direction:column; }
.home .business-copy h3 { font-size:27px; line-height:1.5; margin:0; }
.business-copy .business-description { margin:13px 0 0; max-width:37em; }
.business-copy .business-more { margin-top:22px; }
@media(max-width:1100px) {
 .goods-copy { padding:30px; }
 .home .goods-copy h3 { font-size:30px; }
 .business-pair { gap:28px; }
}
@media(max-width:900px) {
 .goods-feature { grid-template-columns:1fr 1fr; }
 .goods-copy { padding:28px; }
 .goods-feature>.business-photo { min-height:400px; }
 .business-description { font-size:14px; }
 .home .business-copy h3 { font-size:24px; }
}
@media(max-width:620px) {
 .home-business { padding:40px 0 45px; }
 .business-heading { display:block; margin-bottom:24px; }
 .business-heading p { margin-top:10px; font-size:12px; }
 .goods-feature { grid-template-columns:1fr; }
 .goods-feature>.business-photo { min-height:0; aspect-ratio:1.4; }
 .goods-copy { padding:25px 24px 29px; }
 .home .goods-copy h3 { font-size:28px; }
 .business-description { margin-top:15px; }
 .business-detail { font-size:12px; }
 .business-pair { grid-template-columns:1fr; gap:32px; margin-top:30px; }
 .business-pair .business-photo { aspect-ratio:1.5; }
 .business-copy { padding-top:20px; }
 .business-label { margin-bottom:10px; }
 .home .business-copy h3 { font-size:24px; }
 .business-more { margin-top:22px; }
}

/* Bound colored sections to the same outer edges as the business content. */
.home-hero, .home-about { width:min(1440px, calc(100% - 96px)); margin-inline:auto; }
.home-hero { margin-top:28px; }
.home-hero .hero-layout { width:100%; padding:0 48px; gap:48px; }
.home-about { padding:0; margin-bottom:72px; }
.home-about .about-layout { width:100%; min-height:300px; padding:64px 72px; grid-template-columns:1fr 1.15fr; gap:80px; }
.home .about-layout h2 { font-size:38px; line-height:1.55; }
.about-layout p { max-width:34em; font-size:16px; line-height:2; margin-bottom:25px; }
@media(max-width:1100px) {
 .home-hero, .home-about { width:calc(100% - 64px); }
 .home-hero .hero-layout { padding:0 32px; gap:28px; }
 .home-about .about-layout { padding:48px; gap:48px; min-height:280px; }
 .home .about-layout h2 { font-size:32px; }
}
@media(max-width:620px) {
 .home-hero, .home-about { width:calc(100% - 40px); }
 .home-hero { margin-top:16px; }
 .home-hero .hero-layout { padding:0 22px; gap:0; }
 .home h1 { font-size:clamp(26px,7.3vw,34px); }
 .home-about { margin-bottom:40px; }
 .home-about .about-layout { min-height:0; padding:32px 26px; grid-template-columns:1fr; gap:22px; }
 .home .about-layout h2 { font-size:28px; }
 .about-layout p { font-size:14px; margin-bottom:20px; }
}