/* Skin-type guide (the weekly content page, Inbox request #416): the treatment and area page layouts, one block per skin type. */
.gp-check,.gp-types,.gp-conditions,.gp-reads{max-width:1320px;margin:96px auto 0;padding:0 28px}
.gp-check-list{list-style:none;margin:28px 0 0;padding:0;display:grid;grid-template-columns:repeat(5,1fr);gap:14px}
.gp-check-list a{display:flex;flex-direction:column;justify-content:space-between;gap:16px;height:100%;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:18px 20px;text-decoration:none;color:var(--ink-2);line-height:1.6;transition:border-color .2s}
.gp-check-list a:hover{border-color:var(--gold)}
.gp-check-list b{font-weight:500;color:var(--bronze-2)}
.gp-types-h{font-size:clamp(28px,3.2vw,42px);font-weight:300;margin:0}
.gp-type{margin-top:56px;padding-top:44px;border-top:1px solid var(--line);scroll-margin-top:150px}
.gp-type:first-of-type{margin-top:28px}
.gp-type-head{max-width:820px}
.gp-type-head h3{font-size:clamp(24px,2.6vw,32px);font-weight:400;margin:0}
.gp-type-head p{margin:12px 0 0;color:var(--ink-2);font-size:17px;line-height:1.8}
.gp-type-head .gp-signs{color:var(--bronze-2);font-size:16px}
.gp-label{font-size:16px;font-weight:500;color:var(--ink-3);margin:30px 0 14px}
.gp-shop{grid-template-columns:repeat(4,1fr)}
.gp-clinic{grid-template-columns:repeat(auto-fit,minmax(min(100%,460px),1fr))}
.gp-clinic .ap-card{flex-direction:row}
.gp-clinic .ap-img{flex:0 0 42%;aspect-ratio:auto;min-height:220px}
.gp-shop .ap-img{background:#fff;aspect-ratio:1/1}
.gp-shop .ap-img img{object-fit:contain;padding:14px}
.gp-cond-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:28px}
.gp-cond{display:flex;flex-direction:column;gap:10px;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:22px 24px}
.gp-cond h3{font-size:21px;font-weight:400;margin:0}
.gp-cond p{margin:0;color:var(--ink-2);line-height:1.7;flex:1}
.gp-cond ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px 16px}
.gp-cond li a{color:var(--bronze-2);font-size:15px}
.gp-cond .link-arrow{margin-top:6px}
.gp-clip video{aspect-ratio:1/1}
.gp-reads h2{font-size:clamp(28px,3.2vw,42px);font-weight:300;margin:0 0 22px}
.gp-read-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
@media (max-width:1100px){.gp-check-list{grid-template-columns:repeat(2,1fr)}.gp-shop{grid-template-columns:repeat(2,1fr)}.gp-cond-grid,.gp-read-grid{grid-template-columns:1fr}}
@media (max-width:980px){.gp-check,.gp-types,.gp-conditions,.gp-reads{margin-top:64px}}
@media (max-width:620px){
 .gp-check,.gp-types,.gp-conditions,.gp-reads{padding-inline:18px}
 .gp-check-list{grid-template-columns:1fr}
 .gp-check-list a{flex-direction:row;align-items:center;justify-content:space-between;gap:14px}
 .gp-check-list b{flex:none}
 .gp-type{margin-top:40px;padding-top:32px;scroll-margin-top:90px}
 .gp-shop{grid-template-columns:repeat(2,1fr);gap:12px}
 .gp-clinic{grid-template-columns:1fr}
 .gp-clinic .ap-card{flex-direction:column}
 .gp-clinic .ap-img{flex:none;aspect-ratio:16/10;min-height:0}
 .gp-shop .ap-body{padding:12px 14px 14px}
 .gp-shop .ap-body h4{font-size:15.5px}
 .gp-shop .ap-body p{font-size:14px;line-height:1.55}
}
