/* 기본 컨테이너 폭 */
main.container,
.container{
  width:100%;
  margin-inline:auto;
}

/* 공통 grid/flex 레이아웃 */
.grid{
  display:grid;
  gap:12px;
}
.row{
  display:flex;
  gap:8px;
  align-items:center;
}

/* 홈 레이아웃 */
.home-grid{
  display:grid;
  gap:16px;
}
@media (min-width:900px){
  .home-grid{
    grid-template-columns:7fr 5fr;
    align-items:start;
  }
  .aside-recent{
    position:sticky;
    top:76px;
  }
}

/* 도메인 리스트 레이아웃 */
.domain-grid{
  display:grid;
  gap:16px;
}
@media (min-width:1000px){
  .domain-grid{
    grid-template-columns:7fr 5fr;
    align-items:start;
  }
}

/* 카드/그리드 베이스 (색상은 theme.css에서 제어) */
.card{
  border-radius:12px;
  padding:14px;
}

/* 2/3열 그리드 (container query 미지원 브라우저용 fallback) */
.grid-2{
  display:grid;
  gap:16px;
}
.grid-3{
  display:grid;
  gap:16px;
}
@media (min-width:900px){
  .grid-2{
    grid-template-columns:repeat(2, minmax(0,1fr));
  }
}
@media (min-width:1024px){
  .grid-3{
    grid-template-columns:repeat(3, minmax(0,1fr));
  }
}

/* Input group 레이아웃 (색상/보더는 theme.css에서) */
.input-group{
  display:flex;
  gap:8px;
  align-items:stretch;
}
.input-group input{
  flex:1;
  min-width:0;
  height:48px;
  padding:0 14px;
  border-radius:12px;
}
.input-group button{
  height:48px;
  padding-inline:14px;
  border-radius:12px;
}

/* 기타 */
.hero .row{
  margin-top:8px;
}