/* DriveMe compact public category pages V5.2 */
body:not(.auth-page)>header{height:60px;padding:0 20px}
body:not(.auth-page)>header .brand{font-size:21px}
body:not(.auth-page)>header .brand b{width:32px;height:36px}
body:not(.auth-page)>header nav{gap:27px;font-size:14px}
body:not(.auth-page)>header .button{min-height:38px;padding:0 18px;font-size:14px;border-width:2px}

.category-hero{margin:10px auto 8px;grid-template-columns:60% 40%;border-width:2px;border-radius:10px;box-shadow:0 7px 20px #082b4b14}
.category-hero>div{padding:20px 28px 18px}
.category-hero .eyebrow{font-size:10px;letter-spacing:.13em}
.category-hero h1{font-size:34px;line-height:1.03;margin:5px 0 7px}
.category-hero .lead{font-size:16px;line-height:1.4;margin:0;max-width:690px}
.category-hero ul{margin:11px 0 13px;display:grid;grid-template-columns:1fr 1fr;column-gap:22px;row-gap:2px}
.category-hero li{padding:3px 0 3px 19px;font-size:12px;line-height:1.34}
.category-hero li:before{font-size:12px}
.category-hero .hero-actions{gap:9px}
.category-hero .button{min-height:39px;padding:0 18px;font-size:13px;border-width:2px}
.category-hero figure{padding:17px;border-left-width:2px}
.category-hero img{max-height:224px}
.category-hero figcaption{font-size:11px;margin-top:3px}

.controls{margin:8px auto;gap:10px}
.controls article{border-width:2px;border-radius:8px;padding:11px 14px}
.controls b{font-size:15px}
.controls p{font-size:12px;line-height:1.35;margin:4px 0 0}
.notice{margin:8px auto 10px;padding:10px 15px;border-width:2px;border-radius:8px;display:grid;grid-template-columns:125px 1fr;align-items:center;gap:12px}
.notice b{font-size:14px}.notice p{font-size:11px;line-height:1.35;margin:0}
body:not(.auth-page)>footer{min-height:66px;padding-top:19px;padding-bottom:19px;font-size:12px}

@media(max-width:850px){
  .category-hero{grid-template-columns:1fr;margin:10px 14px}
  .category-hero>div{padding:22px}
  .category-hero figure{border-left:0;border-top:2px solid var(--line)}
  .category-hero img{max-height:250px}
  .controls{margin:10px 14px;grid-template-columns:1fr 1fr}
  .notice{margin:10px 14px}
}
@media(max-width:600px){
  body:not(.auth-page)>header{height:auto;min-height:64px;padding:10px 14px}
  .category-hero h1{font-size:30px}
  .category-hero ul{grid-template-columns:1fr}
  .category-hero .hero-actions{flex-direction:column}
  .controls{grid-template-columns:1fr}
  .notice{grid-template-columns:1fr}
}
