.page-home{background-color:var(--color-bg)}

/* home-visual ---------- */
.home-visual{background:linear-gradient(to bottom, var(--color-bg) 30%, #F8FDEC 100%)}
.home-visual .container{display:flex; justify-content:space-between; align-items:center; gap:8px; padding-right:0}
.home-visual .text-wrap{display:flex; flex-direction:column; align-items:flex-start; justify-content:flex-start; gap:4px; width:100%}
.home-visual .text-wrap .sub{font-size:15px; font-weight:600; color:var(--color-gray-c); line-height:1.3; letter-spacing:-0.02em}
.home-visual .text-wrap .title{font-size:22px; font-weight:700; color:var(--color-title); line-height:1.2; letter-spacing:-0.02em}
.home-visual .text-wrap .title span{font-weight:600}
.home-visual .text-wrap .desc{font-size:14px; color:var(--color-gray-d); line-height:1.45}
.home-visual .text-wrap .btn{margin-top:8px}

@media(min-width:768px){
  .home-visual .container{gap:40px}
  .home-visual .text-wrap{gap:8px}
  .home-visual .text-wrap .sub{font-size:16px}
  .home-visual .text-wrap .title{font-size:40px; font-weight:800}
  .home-visual .text-wrap .title span{font-weight:700}
  .home-visual .text-wrap .desc{font-size:15px; line-height:1.5}
}

/* section-card ---------- */
.page-home .cards{margin-top:12px}
.page-home .masonry-column{gap:12px !important}
.page-home .section-card .btn-more{width:100%; box-shadow:0 1px 0 0 inset var(--border-50)}

@media(min-width:768px){
  .page-home .cards{margin-top:20px}
  .page-home .masonry-wall{gap:20px !important}
  .page-home .masonry-column{gap:20px !important}
  .page-home .cards .section-header .title{font-size:20px}
}

@media(min-width:1070px){
  .page-home .cards .section-header .title{font-size:22px}
}

/* home-my */
.home-my{padding-top:0; padding-bottom:0; background:linear-gradient(to bottom, #F8FDEC 0%, var(--color-bg) 40%)}
.home-my .section-card{position:relative}
.home-my .cover-login{position:absolute; top:0; right:0; bottom:0; left:0; display:none; flex-direction:column; justify-content:center; align-items:center; gap:12px; width:100%; height:100%; padding:20px; background:linear-gradient(180deg, rgba(255,255,255,0.6) 0%, rgba(255,255,255,1) 95%)}
.home-my .cover-login .text{max-width:400px; font-size:14px; font-weight:500; line-height:1.3; text-align:center}
.home-my.login .cover-login{display:flex}
.home-my .my-co2{display:flex; align-items:center; justify-content:space-between; gap:12px; cursor:pointer}
.home-my .ico-arrow-right{font-size:20px; color:var(--color-gray-e)}
.home-my .text-wrap .label{font-size:13px; color:var(--color-gray-c); line-height:1.4; margin-bottom:2px}
.home-my .text-wrap .num{font-size:18px; font-weight:600; line-height:1.2; letter-spacing:-0.02em}
.home-my .data-wrap{--data-gap:6px; display:flex; flex-wrap:wrap; gap:var(--data-gap)}
.home-my .data-wrap .data-my{flex:0 0 calc(50% - var(--data-gap)); word-break:break-all}

@media(min-width:1070px){
  .home-my .text-wrap .label{font-size:14px}
  .home-my .text-wrap .num{font-size:20px}
  .home-my .data-wrap{--data-gap:8px; flex-wrap:nowrap}
  .home-my .data-wrap .data-my{flex:1}
}

/* daily-check */
.daily-check .ico-calendar{font-size:14px}
.daily-check .ico-calendar::before{width:18px; height:18px; background-size:cover}
.daily-check .list-wrap{display:flex; flex-direction:column; gap:8px}

@media(min-width:1070px){
  .daily-check .ico-calendar{font-size:16px}
  .daily-check .ico-calendar::before{width:20px; height:20px}
}

/* status */
.status .section-header .desc{font-size:12px; color:var(--color-gray-e)}
.status .cut-co2{display:flex; justify-content:space-between; align-items:center; gap:12px; padding:18px; background-color:var(--color-secondary); border-radius:var(--br-lg); font-size:14px; font-weight:500; color:var(--color-white); line-height:1.3; overflow:hidden}
.status .cut-co2 .num{font-size:16px; font-weight:600; letter-spacing:-0.03em}

@media(min-width:768px){
  .status .cut-co2 .num{font-size:18px}
}

@media(min-width:1070px){
  .status .section-header .desc{font-size:14px}
}

/* review */
.review .lists .title{-webkit-line-clamp:1}

@media(min-width:768px){
  .page-home .review .lists .thum::after{border-radius:var(--br-md)}
  .page-home .review .list-lateral .list-link{flex-direction:row; gap:16px}
  .page-home .review .list-lateral .thum{width:var(--thumb); height:var(--thumb); border-radius:var(--br-md)}
  .page-home .review .list-lateral .thum-img{padding-bottom:100%}
  .page-home .review .list-lateral .thum.noimg .thum-img{background-size:45%}
}

/* support */
.page-home .support .btn-wrap{display:flex; flex-direction:column; align-items:flex-end}
.page-home .support img{display:block; width:170px; height:auto; background-repeat:no-repeat; background-position:center; background-size:cover; flex-shrink:0; margin-bottom:-2px; z-index:2}
.page-home .support .btn{width:100%; background:linear-gradient(45deg, #54D684 0%, #22C55E 30%); box-shadow:0 6px 10px 0 rgba(0,194,97,0.3)}
.page-home .support .btn:hover{background:linear-gradient(45deg, #47D07A 0%, #1cbb56 30%)}

@media(min-width:768px){
  .page-home .support img{width:220px}
}